/* ================= Ek bileşenler ================= */
:root{--ease:cubic-bezier(.16,1,.3,1)}
html{-webkit-text-size-adjust:100%}
body{overflow-x:hidden}
.js body{animation:pagein 700ms ease-out both}
@keyframes pagein{from{opacity:0}to{opacity:1}}

/* Kaydırmayla belirme */
.js .reveal{opacity:0;transform:translateY(24px);transition:opacity 900ms var(--ease),transform 900ms var(--ease);transition-delay:var(--d,0ms);will-change:opacity,transform}
.js .reveal.in{opacity:1;transform:none;will-change:auto}

/* Daha akıcı etkileşim */
.tile,.srow,.crow,.btn,.quick a,.navlinks a{transition-timing-function:var(--ease)}
.tile .go svg,.btn svg,.quick a svg,.link svg{transition:transform 300ms var(--ease)}
.tile:hover .go svg,.quick a:hover svg,.link:hover svg{transform:translateX(5px)}
.btn:hover svg{transform:translateX(4px)}
.navlinks a[aria-current]{color:#fff;background:var(--g90);box-shadow:inset 0 -2px 0 var(--blue60)}
.navlinks .nav-cta[aria-current]{background:var(--blue60);box-shadow:none}

/* Şerit: kayan referanslar */
.marquee{overflow:hidden;border-block:1px solid var(--g20);background:#fff;-webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
.marquee-track{display:flex;width:max-content;animation:marq var(--dur,40s) linear infinite;will-change:transform}
.marquee:hover .marquee-track{animation-play-state:paused}
.mq-item{flex:none;width:200px;height:104px;display:grid;place-items:center;padding:24px 32px;border-right:1px solid var(--g20)}
.mq-item img{max-width:100%;max-height:52px;object-fit:contain;filter:grayscale(1);opacity:.65;transition:filter 300ms,opacity 300ms}
.mq-item:hover img{filter:none;opacity:1}
.mq-ph{display:inline-block;font-size:11px;letter-spacing:.24em;color:var(--g50);border:1px dashed var(--g30);padding:10px 18px}
@keyframes marq{to{transform:translateX(-50%)}}
.marquee.is-empty{opacity:.7}

/* İç sayfa başlığı */
.phero{background:var(--g10);border-bottom:1px solid var(--g20);padding:56px 0 48px}
.crumb{font-size:14px;color:var(--g70);margin:0 0 24px}
.crumb a{color:var(--blue60)}.crumb a:hover{text-decoration:underline}
.phero .lead{margin-top:20px;max-width:720px}
.phero-meta{display:flex;gap:32px;flex-wrap:wrap;margin-top:32px;font-size:14px;color:var(--g70)}
.phero-meta span{display:flex;align-items:center;gap:8px}
.phero-meta svg{width:18px;height:18px;color:var(--blue60)}

/* Hizmet bulucu */
.finder{padding:32px 0;border-bottom:1px solid var(--g20);background:#fff}
.finder .row{display:grid;grid-template-columns:5fr 7fr;gap:48px;align-items:center}
.finder h2{font-size:20px;font-weight:400;margin:0 0 4px}
.finder p{margin:0;font-size:14px;color:var(--g70)}
.search{position:relative}
.search svg{position:absolute;left:16px;top:16px;width:16px;height:16px;color:var(--g70);pointer-events:none}
.search input{width:100%;height:48px;padding:0 48px 0 44px;background:var(--g10);border:0;border-bottom:1px solid var(--g50);border-radius:0;outline:none;font-size:16px;color:var(--g100);appearance:none;-webkit-appearance:none}
.search input:focus{outline:2px solid var(--blue60);outline-offset:-2px}
.search button{position:absolute;right:0;top:0;width:48px;height:48px;background:none;border:0;cursor:pointer;font-size:20px;color:var(--g70)}
.tags{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.tag{background:var(--g10);border:0;color:var(--g100);font-size:13px;padding:6px 12px;border-radius:16px;cursor:pointer;transition:background 150ms}
.tag:hover{background:var(--g20)}
.subnav{position:sticky;top:48px;z-index:30;background:#fff;border-bottom:1px solid var(--g20)}
.subnav .wrap{display:flex;overflow-x:auto;scrollbar-width:none}
.subnav .wrap::-webkit-scrollbar{display:none}
.subnav a{flex:none;display:flex;align-items:center;height:48px;padding:0 16px;font-size:14px;color:var(--g70);border-bottom:2px solid transparent;white-space:nowrap;transition:color 150ms,border-color 150ms,background 150ms}
.subnav a:hover{background:var(--g10);color:var(--g100)}
.subnav a[aria-current]{color:var(--g100);border-bottom-color:var(--blue60)}
.subnav a[hidden]{display:none}

/* Hizmet ayrıntı bölümleri */
.svc{padding:72px 0;border-bottom:1px solid var(--g20);scroll-margin-top:96px}
.svc:nth-of-type(even){background:var(--g10)}
.svc[hidden]{display:none}
.svc-grid{display:grid;grid-template-columns:4fr 8fr;gap:64px}
.svc-side{position:sticky;top:112px;align-self:start}
.svc-side>svg{width:48px;height:48px;color:var(--blue60);margin-bottom:24px}
.svc-side .num{display:block;margin-bottom:8px}
.svc-side h2{font-weight:300;font-size:clamp(26px,2.6vw,34px);line-height:1.2;margin:0 0 16px}
.svc-side p{color:var(--g70);margin:0 0 28px;font-size:16px}
.svc-main h3{font-size:14px;font-weight:600;letter-spacing:.16px;color:var(--g100);margin:0 0 12px}
.svc-cols{display:grid;grid-template-columns:1fr 1fr;gap:48px;margin-bottom:48px}
.lst{list-style:none;margin:0;padding:0;border-top:1px solid var(--g50)}
.lst li{position:relative;padding:12px 8px 12px 28px;border-bottom:1px solid var(--g20);font-size:15px;line-height:1.4}
.lst li::before{content:"";position:absolute;left:4px;top:19px;width:8px;height:8px;background:var(--blue60)}
.lst.q li::before{background:none;border:1.5px solid var(--g50);border-radius:50%;width:9px;height:9px}
.mini-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin-bottom:40px}
.mini-steps div{border-top:1px solid var(--g100);padding:12px 24px 0 0}
.mini-steps div:first-child{border-top:4px solid var(--blue60)}
.mini-steps .num{display:block;margin-bottom:12px;font-size:13px}
.mini-steps strong{display:block;font-weight:600;font-size:15px;margin-bottom:4px}
.mini-steps p{margin:0;font-size:14px;color:var(--g70);line-height:1.43}
.callout{background:#fff;border-left:3px solid var(--blue60);padding:16px 20px;font-size:14px;line-height:1.5;color:var(--g70)}
.svc:nth-of-type(even) .callout{background:#fff}
.callout b{color:var(--g100);font-weight:600}
.none{padding:96px 0;text-align:center;color:var(--g70)}

/* Genel güvence + bölge */
.assure{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--g20);border:1px solid var(--g20)}
.assure>div{background:#fff;padding:24px 20px 28px}
.assure svg{width:28px;height:28px;color:var(--blue60);margin-bottom:32px}
.assure h3{font-size:16px;font-weight:600;margin:0 0 6px}
.assure p{margin:0;font-size:14px;color:var(--g70);line-height:1.43}

/* Çağrı bandı */
.band{background:var(--blue60);color:#fff;padding:56px 0}
.band .wrap{display:flex;justify-content:space-between;align-items:center;gap:32px;flex-wrap:wrap}
.band h2{font-weight:300;font-size:clamp(24px,3vw,36px);line-height:1.2;margin:0;max-width:640px}
.band p{margin:8px 0 0;color:#d0e2ff;font-size:16px}
.band .btn{background:#fff;color:var(--g100)}.band .btn:hover{background:var(--g10)}

/* Referans sayfası */
.refgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--g20);border:1px solid var(--g20)}
.refcard{background:#fff;min-height:176px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:24px;text-align:center;transition:background 150ms}
.refcard:hover{background:var(--g10)}
.refcard .logo{height:56px;width:100%;display:grid;place-items:center}
.refcard img{max-width:80%;max-height:56px;object-fit:contain;filter:grayscale(1);opacity:.75;transition:filter 300ms,opacity 300ms}
.refcard:hover img{filter:none;opacity:1}
.refcard .rn{font-size:13px;color:var(--g70)}
.refcard.ph{min-height:144px}
.note-box{margin-top:32px;padding:16px 20px;background:var(--g10);border-left:3px solid var(--g50);font-size:14px;color:var(--g70);max-width:720px}

/* ================= Tablet ================= */
@media(max-width:1056px){
  .svc-grid{grid-template-columns:1fr;gap:32px}
  .svc-side{position:static}
  .finder .row{grid-template-columns:1fr;gap:20px}
  .assure{grid-template-columns:repeat(2,1fr)}
  .refgrid{grid-template-columns:repeat(3,1fr)}
}

/* ================= Mobil ================= */
@media(max-width:672px){
  /* menü: yumuşak açılış */
  .navlinks{display:flex;visibility:hidden;opacity:0;transform:translateY(-8px);transition:opacity 250ms var(--ease),transform 250ms var(--ease),visibility 0s 250ms;max-height:calc(100vh - 48px);overflow-y:auto}
  .navlinks.open{visibility:visible;opacity:1;transform:none;transition:opacity 250ms var(--ease),transform 250ms var(--ease)}
  .navlinks a{min-height:52px;height:auto}
  .navlinks a[aria-current]{box-shadow:inset 3px 0 0 var(--blue60)}
  .navlinks .nav-cta{justify-content:flex-start}
  .brand{padding-right:8px}

  /* hero */
  .hero-copy{padding:48px 0 40px}
  .hero-actions{flex-direction:column;gap:1px}
  .hero-actions .btn{width:100%}
  .hero-foot{flex-direction:column;gap:8px;padding-top:32px}
  .ht{min-height:140px;padding:16px}
  .ht span{font-size:13px}

  /* bileşenler */
  .quick .wrap{grid-template-columns:1fr 1fr}
  .quick a{padding:16px 12px;font-size:13px;line-height:1.3;gap:8px}
  .head{margin-bottom:40px}
  .tile{min-height:0}
  .tile .top{padding-bottom:28px}
  .tile h3{font-size:18px}
  .step .num{margin-bottom:24px}
  .crow{padding:16px 0}
  .mq-item{width:160px;height:84px;padding:16px 20px}
  .phero{padding:36px 0 32px}
  .phero-meta{gap:12px;flex-direction:column}
  .svc{padding:48px 0;scroll-margin-top:88px}
  .svc-cols,.mini-steps,.assure{grid-template-columns:1fr}
  .svc-cols{gap:32px}
  .mini-steps div{padding-bottom:20px}
  .refgrid{grid-template-columns:repeat(2,1fr)}
  .refcard{min-height:128px;padding:16px}
  .band{padding:40px 0}
  .band .btn{width:100%}

  /* formlar: iOS yakınlaştırmasını engelle, dokunma hedefleri */
  .field input,.field select,.field textarea,.search input{font-size:16px}
  .actions .btn{flex-basis:100%}
  .btn{min-height:48px}

  /* alt sabit buton güvenli alan */
  .mcta .btn{padding-bottom:calc(14px + env(safe-area-inset-bottom))}
  .footer{padding-bottom:calc(88px + env(safe-area-inset-bottom))}
}

/* Dokunmatik cihazlarda yapışan hover durumlarını önle */
@media(hover:none){
  .tile:hover,.quick a:hover,.refcard:hover,.subnav a:hover{background:inherit}
  .tile:hover{background:var(--g10)}
  .section.alt .tile:hover{background:var(--white)}
  .tile:hover .go svg,.btn:hover svg{transform:none}
}

@media(prefers-reduced-motion:reduce){
  .js .reveal{opacity:1;transform:none}
  .js body{animation:none}
  .marquee{overflow-x:auto}
  .marquee-track{animation:none}
}

a.tag{display:inline-block}

.refcard .rv{font-size:12px;color:var(--blue60);opacity:0;transform:translateY(4px);transition:opacity 250ms,transform 250ms var(--ease)}
.refcard:hover .rv,.refcard:focus-visible .rv{opacity:1;transform:none}
@media(hover:none){.refcard .rv{opacity:1;transform:none}}
.mq-item{transition:background 150ms}
a.mq-item:hover{background:var(--g10)}

/* Randevu akışı */
.flow{margin:32px 0 0}
.flow>div{display:flex;gap:16px;padding:16px 0;border-top:1px solid var(--g80)}
.flow>div:last-child{border-bottom:1px solid var(--g80)}
.flow .num{color:var(--blue20);padding-top:2px}
.flow strong{display:block;font-weight:400;font-size:16px}
.flow small{display:block;color:var(--g30);font-size:14px;margin-top:2px}
.panel .flow{margin:0 0 8px}
.panel .flow>div{border-top-color:var(--g70)}
.panel .flow>div:last-child{border-bottom-color:var(--g70)}
.field[hidden]{display:none}

/* Yan "Destek al" butonu */
.sidetab{position:fixed;right:0;top:50%;z-index:60;display:flex;flex-direction:column;align-items:center;gap:12px;background:var(--blue60);color:#fff;padding:18px 12px;font-size:14px;letter-spacing:.4px;line-height:1;transform:translateY(-50%);transition:background 150ms,padding 250ms var(--ease);animation:sidein 900ms 1s var(--ease) both}
.sidetab:hover{background:var(--blue70);padding-right:18px}
.sidetab svg{width:20px;height:20px}
.sidetab span{writing-mode:vertical-rl;transform:rotate(180deg)}
@keyframes sidein{from{opacity:0;transform:translate(100%,-50%)}to{opacity:1;transform:translate(0,-50%)}}
@media(max-width:672px){.sidetab{padding:14px 9px;font-size:13px;top:42%}}
@media(prefers-reduced-motion:reduce){.sidetab{animation:none}}
/* Canlı logo boyutu */
.masthead .brand svg.mark-live{width:54px;height:34px;margin-top:-1px}