:root{
  --ink:#16161a;
  --ink-soft:#5c5c63;
  --ghost:#c2c2bd;
  --paper:#fafaf8;
  --line:#e7e7e2;
  --pill:#ffffff;
  --grad:linear-gradient(95deg, #F4611A 0%, #C0561B 42%, #6B4A26 72%, #2E4034 100%);

  --fs:min(64px, (100vw - 32px) / 14.6);
  --r:calc(var(--fs) * 5.3);
  --stage-h:calc(var(--fs) * 3.28);
  --dots-h:640px;
}

*{box-sizing:border-box; margin:0; padding:0}

html{scroll-behavior:smooth}
.howto,.integ,.feat,.pipe-sec,.ssa,.pricing,.tools,.contact{scroll-margin-top:24px}

html,body{
  max-width:100%;
  overflow-x:hidden;
  overflow-x:clip;
}

body{
  font-family:'Inter',system-ui,-apple-system,sans-serif;
  color:var(--ink);
  background:var(--paper);
  -webkit-font-smoothing:antialiased;
}

.grid-bg{
  position:absolute; top:0; left:0; right:0; height:var(--dots-h);
  z-index:0; pointer-events:none;
  background-image:radial-gradient(circle, #d6d6d0 1.1px, transparent 1.1px);
  background-size:18px 18px;
  -webkit-mask-image:
    linear-gradient(to right,  transparent 0%, #000 20%, #000 80%, transparent 100%),
    linear-gradient(to bottom, transparent 0%, #000 30%, #000 84%, transparent 100%);
  mask-image:
    linear-gradient(to right,  transparent 0%, #000 20%, #000 80%, transparent 100%),
    linear-gradient(to bottom, transparent 0%, #000 30%, #000 84%, transparent 100%);
  -webkit-mask-composite:source-in;
  mask-composite:intersect;
}

.page{position:relative; z-index:1}

nav{
  position:relative; z-index:20;
  display:flex; align-items:center; justify-content:space-between;
  max-width:1180px; margin:0 auto; padding:24px 24px;
}
.brand{flex:1; display:flex; align-items:center}
.brand img{height:27px; width:auto; max-width:150px; display:block}
.nav-links{flex:none; display:flex; align-items:center; gap:18px; font-size:14px; color:var(--ink-soft); white-space:nowrap}
.nav-links > a{color:inherit; text-decoration:none}
.nav-links > a:hover{color:var(--ink)}

.nav-item{position:relative; display:flex; align-items:center}
.nav-item::after{content:""; position:absolute; top:100%; left:-20px; right:-20px; height:18px}
.nav-trigger{display:inline-flex; align-items:center; gap:5px; color:inherit; text-decoration:none}
.nav-trigger:hover{color:var(--ink)}
.chev{
  width:10px; height:7px; fill:none; stroke:currentColor;
  stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round;
  transition:transform .2s ease;
}
.nav-item:hover .chev,.nav-item:focus-within .chev{transform:rotate(180deg)}

.mega{
  position:absolute; top:100%; left:0;
  transform:translateY(8px);
  margin-top:18px; width:min(700px, 92vw);
  background:#fff; border:1px solid var(--line); border-radius:22px;
  box-shadow:0 20px 56px rgba(20,20,25,.13);
  padding:16px; z-index:30;
  opacity:0; visibility:hidden; pointer-events:none;
  transition:opacity .18s ease, transform .18s ease, visibility .18s;
}
.nav-item:hover .mega,.nav-item:focus-within .mega{
  opacity:1; visibility:visible; pointer-events:auto;
  transform:translateY(0);
}
.mega-grid{display:grid; grid-template-columns:1fr 1fr; gap:2px 8px}
.mega-col{display:flex; flex-direction:column; gap:2px}
.mega-item{
  display:flex; align-items:center; gap:12px;
  padding:10px 12px; border-radius:14px;
  color:var(--ink); text-decoration:none; font-size:14px; font-weight:500;
  transition:background .15s ease;
}
.mega-item:hover{background:#f6f6f3}
.mega-badge{
  flex:none; width:38px; height:38px; border-radius:11px;
  border:1px solid var(--line); display:flex; align-items:center; justify-content:center;
  color:#8d8d86; transition:color .15s ease, border-color .15s ease;
}
.mega-badge svg{
  width:19px; height:19px; display:block;
  fill:none; stroke:currentColor; stroke-width:1.6;
  stroke-linecap:round; stroke-linejoin:round;
}
.mega-item:hover .mega-badge{color:var(--ink); border-color:#d9d9d3}
.mega-arrow{margin-left:auto; color:#c9c9c4; font-size:16px; line-height:1}
.mega-lines{display:flex; flex-direction:column; gap:3px; line-height:1.3}
.mega-lines b{font-weight:600; color:var(--ink)}
.mega-lines small{font-size:13px; font-weight:400; color:var(--ink-soft)}
.mega-soon{color:var(--ghost); font-weight:400}
.mega-sep{height:1px; background:var(--line); margin:12px 8px}
.mega-feature{display:flex; align-items:center; gap:18px}
.mega-feature-main{
  flex:none; display:flex; align-items:center; gap:12px;
  padding:10px 12px; border-radius:14px; text-decoration:none;
  transition:background .15s ease;
}
.mega-feature-main:hover{background:#f6f6f3}
.mega-feature .mega-badge{
  border-color:transparent;
  background:linear-gradient(#fff,#fff) padding-box, var(--grad) border-box;
  border:1.5px solid transparent;
}
.mega-name{font-size:14px; font-weight:600; color:var(--ink)}
.mega-desc{font-size:13px; font-weight:400; color:var(--ink-soft)}
.mega-tags{margin-left:auto; display:flex; align-items:center; gap:6px; padding-right:12px}
.mega-tag{
  font-size:11px; line-height:16px; padding:4px 10px; border-radius:999px;
  background:#f0f0ec; color:var(--ink-soft);
}
.mega-tag.is-cta{
  font-size:11px; font-weight:600; line-height:16px; padding:4px 14px;
  background:var(--ink); color:#fff; text-decoration:none;
  transition:background .15s ease;
}
.mega-tag.is-cta:hover{background:#2e2e34}

.nav-right{flex:1; display:flex; align-items:center; justify-content:flex-end; gap:1px}
button.icon-btn{border:0; background:none; cursor:pointer; font:inherit}
.icon-btn{
  flex:none;
  display:inline-flex; align-items:center; justify-content:center;
  width:32px; height:32px; border-radius:9px;
  color:var(--ink-soft); text-decoration:none;
  transition:background .15s ease, color .15s ease;
}
.icon-btn:hover{background:#f1f1ed; color:var(--ink)}
.icon-btn svg{
  width:18px; height:18px; display:block;
  fill:none; stroke:currentColor; stroke-width:1.8;
  stroke-linecap:round; stroke-linejoin:round;
}

/* Dil seçici — küre ikonuna tıklayınca açılan Türkçe / English menüsü */
.lang{position:relative; flex:none; display:inline-flex}
.lang.is-open > .icon-btn{background:#f1f1ed; color:var(--ink)}
.lang-menu{
  position:absolute; top:100%; right:0; margin-top:4px;
  min-width:150px; padding:6px; z-index:40;
  display:flex; flex-direction:column; gap:2px;
  background:#fff; border:1px solid var(--line); border-radius:14px;
  box-shadow:0 16px 40px rgba(20,20,25,.13);
}
/* display:flex, tarayıcının [hidden] için uyguladığı display:none kuralını eziyor —
   bu satır olmadan menü kapalıyken de görünür kalır. */
.lang-menu[hidden]{display:none}
.lang-opt{
  display:flex; align-items:center; gap:8px;
  border:0; background:none; cursor:pointer; font:inherit; text-align:left;
  padding:9px 11px; border-radius:9px;
  font-size:14px; color:var(--ink-soft);
  transition:background .15s ease, color .15s ease;
}
.lang-opt span{flex:1}
.lang-opt svg{
  width:15px; height:15px; flex:none; opacity:0;
  fill:none; stroke:currentColor; stroke-width:2;
  stroke-linecap:round; stroke-linejoin:round;
}
.lang-opt:hover{background:#f1f1ed; color:var(--ink)}
.lang-opt.is-on{color:var(--ink); font-weight:500}
.lang-opt.is-on svg{opacity:1; color:#c2521a}

.burger{display:none}
.burger .ico-x{display:none}
.burger.is-open .ico-bar{display:none}
.burger.is-open .ico-x{display:block}

.mobile-menu{
  position:absolute; top:100%; left:0; right:0; z-index:40;
  background:#fff; border-top:1px solid var(--line);
  box-shadow:0 18px 40px rgba(20,20,25,.10);
  padding:10px 16px 20px;
  max-height:calc(100vh - 76px); overflow-y:auto;
}
.mobile-menu[hidden]{display:none}
.mobile-menu a,.mobile-menu summary{
  display:block; padding:11px 4px; font-size:15px;
  color:var(--ink); text-decoration:none;
  border-bottom:1px solid #f0f0ec;
}
.mobile-menu summary{
  list-style:none; cursor:pointer; font-weight:600;
  display:flex; align-items:center; justify-content:space-between;
}
.mobile-menu summary::-webkit-details-marker{display:none}
.mobile-menu summary::after{
  content:""; width:8px; height:8px; margin-right:4px;
  border-right:1.8px solid var(--ink-soft); border-bottom:1.8px solid var(--ink-soft);
  transform:rotate(45deg) translateY(-2px); transition:transform .2s ease;
}
.mobile-menu details[open] summary::after{transform:rotate(-135deg) translateY(-2px)}
.mobile-menu details a{
  padding-left:14px; font-size:14px; color:var(--ink-soft);
  border-bottom:1px solid #f6f6f3;
}
.mm-cta{
  margin-top:16px; text-align:center; border-bottom:0 !important;
  background:var(--ink); color:#fff !important; border-radius:999px;
  padding:13px 20px !important; font-weight:500;
}

.hero{max-width:1180px; margin:0 auto; padding:130px 24px 96px; text-align:center}

h1{
  font-family:'Archivo',sans-serif; font-weight:700;
  font-size:var(--fs); line-height:1.06; letter-spacing:-0.05em;
}
.line-2{
  display:flex; align-items:center; justify-content:center;
  gap:0.28em; flex-wrap:nowrap;
}
.headline-text{position:relative; z-index:1}
.sub,.actions{position:relative; z-index:1}

.slot{
  position:relative; display:inline-block;
  height:var(--stage-h);
  width:var(--w0, auto);
  animation:slotw 24s cubic-bezier(.65,.05,.35,1) infinite;
  margin-top:calc((var(--stage-h) - var(--fs) * 1.06) / -2);
  margin-bottom:calc((var(--stage-h) - var(--fs) * 1.06) / -2);
  overflow:visible;
  z-index:0;
}
.sizer{display:block; height:0; overflow:hidden; visibility:hidden; white-space:nowrap}
.wheel{
  position:absolute; top:50%; left:calc(-1 * var(--r));
  width:0; height:0;
  animation:spin 24s cubic-bezier(.65,.05,.35,1) infinite;
}
.word{
  position:absolute; left:0; top:0;
  width:calc(var(--fs) * 8); height:0;
  display:flex; align-items:center; justify-content:flex-start;
  white-space:nowrap;
  filter:blur(4px);
  transform-origin:0 0;
  transform:rotate(var(--a)) translateX(var(--r));
  animation:blurword 24s cubic-bezier(.65,.05,.35,1) infinite;
}
.word > span{
  display:inline-block;
  background-image:var(--grad);
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:var(--ghost);
  color:var(--ghost);
  animation:focusword 24s cubic-bezier(.65,.05,.35,1) infinite;
  animation-delay:inherit;
}

.sub{
  max-width:720px; margin:clamp(20px, calc(var(--fs) * 0.55), 36px) auto 0;
  font-size:clamp(11.5px, calc(var(--fs) * 0.26), 17px);
  text-wrap:pretty;
  line-height:1.6; color:var(--ink-soft);
}

.actions{display:flex; gap:12px; justify-content:center; margin-top:36px; flex-wrap:nowrap}
.btn{
  font-size:15px; font-weight:500; padding:13px 25px; border-radius:10px;
  text-decoration:none; border:2px solid transparent; white-space:nowrap;
  transition:background .2s ease, border-color .2s ease;
}
.btn-primary{background:var(--ink); color:#fff}
.btn-ghost{background:#fff; color:var(--ink); border-color:var(--line)}
.btn-primary:hover{
  border-color:transparent;
  background:linear-gradient(var(--ink),var(--ink)) padding-box, var(--grad) border-box;
}
.btn-ghost:hover{
  border-color:transparent;
  background:linear-gradient(#fff,#fff) padding-box, var(--grad) border-box;
}

.marquee{
  position:relative; margin-top:64px; overflow:hidden;
  -webkit-mask-image:linear-gradient(to right, transparent, #000 12%, #000 88%, transparent);
  mask-image:linear-gradient(to right, transparent, #000 12%, #000 88%, transparent);
}
.marquee-track{display:flex; width:max-content; animation:marquee 32s linear infinite}
.marquee:hover .marquee-track{animation-play-state:paused}
.mq-group{display:flex; align-items:center; gap:64px; padding-right:64px}
.mq-item{
  height:36px; display:flex; align-items:center;
  font-family:'Archivo',sans-serif; font-weight:600; font-size:17px;
  letter-spacing:-0.02em; color:#a9a9a3; white-space:nowrap;
}
.mq-item[class*="mq-"]{
  height:36px; background-repeat:no-repeat; background-position:center;
  background-size:contain; opacity:.36;
}
.mq-aws{width:204px; background-image:url("/img/aws.png")}
.mq-ads{width:324px; background-image:url("/img/amazon-ads.png")}
.mq-spapi{width:204px; background-image:url("/img/amazon-sp-api.png")}
.mq-mcf{width:207px; background-image:url("/img/amazon-mcf.png")}
.mq-br{width:250px; background-image:url("/img/amazon-brand-registry.png")}
.mq-trans{width:170px; background-image:url("/img/transparency.png")}
.mq-meta{width:90px; background-image:url("/img/meta-business-partner.png")}
.mq-shop{width:214px; background-image:url("/img/shopify-partners.png")}

.stats{
  display:flex; justify-content:center; gap:56px; flex-wrap:wrap;
  margin-top:36px; padding-top:0;
  max-width:760px; margin-left:auto; margin-right:auto;
}
.stat-n{font-family:'Archivo',sans-serif; font-weight:700; font-size:30px; letter-spacing:-0.03em}
.stat-l{font-size:13px; color:var(--ink-soft); margin-top:4px}

.howto{max-width:1180px; margin:0 auto; padding:0 24px 96px}
.sec-intro{max-width:760px; margin:0 auto 32px; text-align:center}
.sec-intro h2{
  font-family:'Archivo',sans-serif; font-weight:700;
  font-size:clamp(24px, calc(var(--fs) * 0.52), 34px);
  letter-spacing:-0.035em; line-height:1.15;
}
.sec-intro p{
  margin-top:12px; font-size:clamp(13px, calc(var(--fs) * 0.26), 16px);
  line-height:1.65; color:var(--ink-soft); text-wrap:pretty;
}
.howto-card{border:1px solid var(--line); border-radius:22px; overflow:hidden; background:#fff}
.howto-body{display:flex; align-items:stretch}
.howto-left{
  flex:0 0 340px; display:flex; flex-direction:column; justify-content:center;
  border-right:1px solid var(--line);
}
.howto-head{
  display:flex; align-items:center; gap:13px;
  padding:26px 24px 0;
}
.howto-badge{
  flex:none; width:44px; height:44px; border-radius:13px;
  display:flex; align-items:center; justify-content:center;
  border:1.6px solid transparent;
  background:linear-gradient(#fff,#fff) padding-box, var(--grad) border-box;
  color:#8d8d86;
}
.howto-badge svg{
  width:22px; height:22px; display:block;
  fill:none; stroke:currentColor; stroke-width:1.6;
  stroke-linecap:round; stroke-linejoin:round;
}
.howto-head h3{
  font-family:'Archivo',sans-serif; font-size:17px; font-weight:700; letter-spacing:-0.02em;
}
.howto-head p{font-size:14px; color:var(--ink-soft); margin-top:10px}
.howto-ver{
  display:block; margin-top:3px;
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:12px; color:#9a9a93; letter-spacing:.01em;
}
.howto-rule{
  flex:none; padding:16px 24px 22px;
  font-size:14px; line-height:1.7; color:var(--ink-soft);
}
.howto-desc{
  padding:0 24px 26px;
  font-size:14px; line-height:1.65; color:var(--ink-soft); text-wrap:pretty;
}
.howto-canvas{
  flex:1; min-width:0; overflow-x:auto;
  scrollbar-width:none; -ms-overflow-style:none;
  display:flex; align-items:center;
  padding:36px 0;
  background-image:radial-gradient(circle, #e0e0da 1.3px, transparent 1.3px);
  background-size:16px 16px;
}
.howto-canvas::-webkit-scrollbar{display:none}
.howto-canvas svg{display:block; width:100%; min-width:660px; height:auto}

.flow{width:100%; min-width:660px; height:auto; display:block}
.flow .fbase{fill:none; stroke:#e4e4de; stroke-width:1.2}
.flow .fhalo1,.flow .fhalo2,.flow .fhalo3,.flow .fhalo4,
.flow .fhead,.flow .fmid,.flow .ftail{
  fill:none; stroke-linecap:round;
  animation:beam 1.9s linear infinite;
}
.flow .fhalo1{stroke-width:13; opacity:.45; filter:url(#fblur); stroke-dasharray:5 95}
.flow .fhalo2{stroke-width:10; opacity:.26; filter:url(#fblur); stroke-dasharray:13 87}
.flow .fhalo3{stroke-width:7;  opacity:.15; filter:url(#fblur); stroke-dasharray:21 79}
.flow .fhalo4{stroke-width:5;  opacity:.08; filter:url(#fblur); stroke-dasharray:30 70}
.flow .fhead{stroke-width:3.4; opacity:1;   stroke-dasharray:2.5 97.5}
.flow .fmid {stroke-width:2.4; opacity:.5;  stroke-dasharray:5 95}
.flow .ftail{stroke-width:1.4; opacity:.22; stroke-dasharray:9 91}
.flow .is-out{
  animation-name:beam, hue;
  animation-duration:1.9s, 5.4s;
  animation-timing-function:linear, linear;
  animation-iteration-count:infinite, infinite;
}
.flow .floop{animation-duration:3.2s, 5.4s}
.flow .fnode rect{fill:#fff; stroke:var(--line); stroke-width:1}
.flow .fedge{
  fill:none; stroke-width:2; stroke-linecap:round;
  stroke-dasharray:16 84;
  animation:beam 1.9s linear infinite;
}
.flow .fnode text{font-family:'Inter',sans-serif; font-size:13px; fill:var(--ink)}
.flow .fring{transform-origin:550px 220px}
.flow .fring-a{animation:orbitA 54s linear infinite}
.flow .fring-b{animation:orbitB 78s linear infinite}
.flow .fring-c{animation:orbitC 108s linear infinite}
.flow .fring circle{
  transform-box:fill-box; transform-origin:center;
  animation-name:dotpulse; animation-timing-function:ease-in-out;
  animation-iteration-count:infinite;
}
.flow .xb{transform-box:fill-box; transform-origin:center; animation-timing-function:ease-in-out;
  animation-iteration-count:infinite}
.flow .xb1{animation-name:xd1; animation-duration:17s}
.flow .xb2{animation-name:xd2; animation-duration:23s}
.flow .xb3{animation-name:xd3; animation-duration:19s}
.flow .xb4{animation-name:xd4; animation-duration:26s}
.flow .xb5{animation-name:xd5; animation-duration:14s}
.flow .xb6{animation-name:xd6; animation-duration:21s}

@keyframes spin{
  0%,3.125% {transform:rotate(-0deg)}
  4.1667%,7.2917% {transform:rotate(-15deg)}
  8.3333%,11.4583% {transform:rotate(-30deg)}
  12.5%,15.625% {transform:rotate(-45deg)}
  16.6667%,19.7917% {transform:rotate(-60deg)}
  20.8333%,23.9583% {transform:rotate(-75deg)}
  25%,28.125% {transform:rotate(-90deg)}
  29.1667%,32.2917% {transform:rotate(-105deg)}
  33.3333%,36.4583% {transform:rotate(-120deg)}
  37.5%,40.625% {transform:rotate(-135deg)}
  41.6667%,44.7917% {transform:rotate(-150deg)}
  45.8333%,48.9583% {transform:rotate(-165deg)}
  50%,53.125% {transform:rotate(-180deg)}
  54.1667%,57.2917% {transform:rotate(-195deg)}
  58.3333%,61.4583% {transform:rotate(-210deg)}
  62.5%,65.625% {transform:rotate(-225deg)}
  66.6667%,69.7917% {transform:rotate(-240deg)}
  70.8333%,73.9583% {transform:rotate(-255deg)}
  75%,78.125% {transform:rotate(-270deg)}
  79.1667%,82.2917% {transform:rotate(-285deg)}
  83.3333%,86.4583% {transform:rotate(-300deg)}
  87.5%,90.625% {transform:rotate(-315deg)}
  91.6667%,94.7917% {transform:rotate(-330deg)}
  95.8333%,98.9583% {transform:rotate(-345deg)}
  100% {transform:rotate(-360deg)}
}
@keyframes slotw{
  0%,3.125% {width:var(--w0, auto)}
  4.1667%,7.2917% {width:var(--w1, auto)}
  8.3333%,11.4583% {width:var(--w2, auto)}
  12.5%,15.625% {width:var(--w3, auto)}
  16.6667%,19.7917% {width:var(--w4, auto)}
  20.8333%,23.9583% {width:var(--w5, auto)}
  25%,28.125% {width:var(--w6, auto)}
  29.1667%,32.2917% {width:var(--w7, auto)}
  33.3333%,36.4583% {width:var(--w8, auto)}
  37.5%,40.625% {width:var(--w9, auto)}
  41.6667%,44.7917% {width:var(--w10, auto)}
  45.8333%,48.9583% {width:var(--w11, auto)}
  50%,53.125% {width:var(--w0, auto)}
  54.1667%,57.2917% {width:var(--w1, auto)}
  58.3333%,61.4583% {width:var(--w2, auto)}
  62.5%,65.625% {width:var(--w3, auto)}
  66.6667%,69.7917% {width:var(--w4, auto)}
  70.8333%,73.9583% {width:var(--w5, auto)}
  75%,78.125% {width:var(--w6, auto)}
  79.1667%,82.2917% {width:var(--w7, auto)}
  83.3333%,86.4583% {width:var(--w8, auto)}
  87.5%,90.625% {width:var(--w9, auto)}
  91.6667%,94.7917% {width:var(--w10, auto)}
  95.8333%,98.9583% {width:var(--w11, auto)}
  100% {width:var(--w0, auto)}
}
@keyframes blurword{
  0%,3.125% {filter:blur(0);   opacity:1}
  4.1667%,7.2917% {filter:blur(4px); opacity:.45}
  8.3333%,11.4583% {filter:blur(8px); opacity:.18}
  12.5%,87.5% {filter:none;     opacity:0}
  91.6667%,94.7917% {filter:blur(8px); opacity:.18}
  95.8333%,98.9583% {filter:blur(4px); opacity:.45}
  100% {filter:blur(0);   opacity:1}
}
@keyframes focusword{
  0%,3.125% {-webkit-text-fill-color:transparent}
  4.1667%,98.9583% {-webkit-text-fill-color:var(--ghost)}
  100% {-webkit-text-fill-color:transparent}
}
@keyframes marquee{from{transform:translateX(0)} to{transform:translateX(-50%)}}
@keyframes beam{from{stroke-dashoffset:100} to{stroke-dashoffset:0}}
@keyframes hue{
  0%  {stroke:#FF5F0E}
  17% {stroke:#FFA23D}
  34% {stroke:#E0B21C}
  50% {stroke:#5FA36F}
  67% {stroke:#2E8F84}
  84% {stroke:#4A7FC1}
  100%{stroke:#FF5F0E}
}
@keyframes orbitA{to{transform:rotate(360deg)}}
@keyframes orbitB{to{transform:rotate(-360deg)}}
@keyframes orbitC{to{transform:rotate(360deg)}}
@keyframes dotpulse{
  0%,100%{transform:scale(.35); opacity:.12}
  50%    {transform:scale(1.4);  opacity:1}
}
@keyframes xd1{0%,100%{transform:translate(0,0)} 33%{transform:translate(42px,30px)} 66%{transform:translate(-18px,52px)}}
@keyframes xd2{0%,100%{transform:translate(0,0)} 30%{transform:translate(-46px,24px)} 70%{transform:translate(-14px,64px)}}
@keyframes xd3{0%,100%{transform:translate(0,0)} 35%{transform:translate(-38px,-44px)} 72%{transform:translate(18px,-62px)}}
@keyframes xd4{0%,100%{transform:translate(0,0)} 40%{transform:translate(52px,-30px)} 75%{transform:translate(22px,-58px)}}
@keyframes xd5{0%,100%{transform:translate(0,0)} 50%{transform:translate(-34px,38px)}}
@keyframes xd6{0%,100%{transform:translate(0,0)} 45%{transform:translate(30px,64px)} 80%{transform:translate(-40px,30px)}}

.feat{max-width:1180px; margin:0 auto; padding:0 24px 96px}
.feat-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:16px}
.feat-card{
  border:1px solid var(--line); border-radius:18px; background:#fff; padding:22px 22px 24px;
  transition:border-color .15s ease;
}
.feat-card:hover{border-color:#d9d9d3}
.feat-card .fi{
  display:flex; align-items:center; justify-content:center;
  width:42px; height:42px; border-radius:12px;
  border:1px solid var(--line); color:#8d8d86;
}
.feat-card .fi svg{
  width:20px; height:20px; display:block;
  fill:none; stroke:currentColor; stroke-width:1.6;
  stroke-linecap:round; stroke-linejoin:round;
}
.feat-card h4{
  margin-top:15px; font-family:'Archivo',sans-serif;
  font-size:15px; font-weight:700; letter-spacing:-0.02em; line-height:1.3;
}
.feat-card p{margin-top:8px; font-size:13.5px; line-height:1.65; color:var(--ink-soft); text-wrap:pretty}
@media (max-width:940px){ .feat-grid{grid-template-columns:repeat(2,1fr)} }
@media (max-width:620px){ .feat-grid{grid-template-columns:1fr} }

.integ{max-width:1180px; margin:0 auto; padding:0 24px 96px}
.integ-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:16px}
.integ-tile{
  display:flex; flex-direction:column;
  border:1px solid var(--line); border-radius:18px; background:#fff; padding:22px;
  transition:border-color .15s ease;
}
.integ-tile:hover{border-color:#d4d4ce}
.integ-ico{
  width:42px; height:42px; border-radius:12px; border:1px solid var(--line);
  display:flex; align-items:center; justify-content:center; color:#8d8d86;
}
.integ-ico svg{
  width:20px; height:20px; display:block;
  fill:none; stroke:currentColor; stroke-width:1.6;
  stroke-linecap:round; stroke-linejoin:round;
}
.integ-tile b{
  display:block; margin-top:15px; font-family:'Archivo',sans-serif;
  font-size:17px; font-weight:600; letter-spacing:-0.015em;
}
.integ-tile p{margin-top:11px; font-size:14px; line-height:1.7; color:var(--ink-soft); text-wrap:pretty}
.integ-soon{
  margin-left:8px; vertical-align:middle;
  font-family:'Inter',sans-serif; font-size:11px; font-weight:500; line-height:16px;
  padding:4px 10px; border-radius:999px; background:#fdece2; color:#c2521a;
}
.integ-tags{display:flex; flex-wrap:wrap; gap:6px; margin-top:auto; padding-top:18px}
.integ-tags span{
  font-size:11px; line-height:16px; padding:4px 10px; border-radius:999px;
  background:#f0f0ec; color:var(--ink-soft);
}
.integ-tile img{max-width:64%; max-height:38px; filter:grayscale(1) brightness(0); opacity:.38}
.integ-note{margin-top:28px; text-align:center; font-size:13.5px; color:var(--ghost)}
@media (max-width:940px){ .integ-grid{grid-template-columns:repeat(2,1fr)} }
@media (max-width:620px){ .integ-grid{grid-template-columns:1fr} }

.pipe-sec{max-width:1180px; margin:0 auto; padding:0 24px 96px}
.pipe-card{
  border:1px solid var(--line); border-radius:22px; background:#fff;
  padding:40px 28px; overflow-x:auto;
  background-image:radial-gradient(circle, #e0e0da 1.3px, transparent 1.3px);
  background-size:16px 16px;
}
.pipe .pnode rect{fill:#fff; stroke:var(--line); stroke-width:1}
.pipe .pnode g{fill:none; stroke:#8d8d86; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round}
.pipe .pnode text{
  text-anchor:middle; font-family:'Inter',sans-serif; font-size:13px; fill:var(--ink-soft);
}
.pipe .pbase{fill:none; stroke:#e2e2dc; stroke-width:1.4}
.pipe .pbeam{
  fill:none; stroke:#FF5F0E; stroke-width:2.6; stroke-linecap:round;
  stroke-dasharray:22 78; animation:beam 1.7s linear infinite;
}
.pipe-facts{
  display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top:26px;
}
.pipe-facts div{display:flex; flex-direction:column; gap:5px}
.pipe-facts b{font-family:'Archivo',sans-serif; font-size:15px; font-weight:700; letter-spacing:-0.02em}
.pipe-facts span{font-size:13.5px; line-height:1.6; color:var(--ink-soft)}
@media (max-width:720px){ .pipe-facts{grid-template-columns:1fr} }
@media (prefers-reduced-motion:reduce){ .pipe .pbeam{animation:none} }

.pipe-card{
  display:flex; align-items:stretch; padding:0; overflow:hidden;
  border:1px solid var(--line); border-radius:22px; background:#fff;
  background-image:none;
}
.pipe-side{
  flex:1; min-width:0; padding:30px 24px;
  display:flex; align-items:center; justify-content:center;
  background-image:radial-gradient(circle, #e0e0da 1.3px, transparent 1.3px);
  background-size:16px 16px;
}
.calc-side{flex:0 0 400px; padding:28px 26px; border-left:1px solid var(--line)}
.pipe{
  display:block; width:100%; max-width:560px; min-width:0;
  height:auto; aspect-ratio:580 / 428; flex:none;
}
.pipe .pnode text.pt{text-anchor:middle; font-size:17.5px; font-weight:600; fill:var(--ink)}
.pipe .pnode text.ps{text-anchor:middle; font-size:15px; fill:var(--ink-soft)}

.calc-head b{display:block; font-family:'Archivo',sans-serif; font-size:16px; font-weight:700; letter-spacing:-0.02em}
.calc-head span{display:block; margin-top:5px; font-size:13.5px; color:var(--ink-soft); line-height:1.55}
.calc-row{display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:16px}
.calc label{display:flex; flex-direction:column; gap:6px; min-width:0; font-size:12.5px; color:var(--ink-soft)}
.calc input,.ct-form input,.ct-form textarea{
  width:100%; min-width:0; font:inherit; font-size:14px; color:var(--ink);
  padding:11px 12px; border:1px solid var(--line); border-radius:11px; background:#fff;
}
.calc input:focus,.ct-form input:focus,.ct-form textarea:focus{
  outline:none; border-color:#c9c9c2;
}
.calc-btn{
  width:100%; margin-top:18px; font:inherit; font-size:15px; font-weight:500;
  padding:13px 20px; border:0; border-radius:11px;
  background:var(--ink); color:#fff; cursor:pointer;
  transition:background .15s ease;
}
.calc-btn:hover{background:#2e2e34}
@media (max-width:940px){
  .pipe-card{flex-direction:column}
  .calc-side{flex:none; border-left:0; border-top:1px solid var(--line)}
}

.calc-field{display:flex; flex-direction:column; gap:6px}
.calc-lbl{font-size:12.5px; color:var(--ink-soft)}

.calc-row.is-stack{grid-template-columns:1fr}
.calc-field{display:flex; flex-direction:column; gap:8px; margin-top:16px}
.calc-lbl{font-size:12.5px; color:var(--ink-soft)}
.radios{display:flex; gap:8px; flex-wrap:wrap}
.radios label{display:inline-flex; cursor:pointer}
.radios input{position:absolute; opacity:0; width:0; height:0}
.radios span{
  display:inline-block; font-size:13.5px; padding:9px 18px; border-radius:999px;
  border:1.5px solid var(--line); color:var(--ink-soft);
  transition:color .15s ease, border-color .15s ease;
}
.radios label:hover span{border-color:#d4d4ce; color:var(--ink)}
.radios input:checked + span{
  color:var(--ink); border-color:transparent;
  background:linear-gradient(#fff,#fff) padding-box, var(--grad) border-box;
}
.radios input:focus-visible + span{outline:2px solid var(--ink); outline-offset:2px}

@media (max-width:620px){
  .pipe-side{padding:26px 18px}
}

.ssa{max-width:1180px; margin:0 auto; padding:0 24px 96px}
.chip-row{
  display:flex; gap:8px; overflow-x:auto; padding-bottom:6px; margin-bottom:22px;
  scrollbar-width:none; -ms-overflow-style:none;
}
.chip-row::-webkit-scrollbar{display:none}
.chip-cat{
  flex:none; font-size:13px; padding:8px 15px; border-radius:999px;
  border:1px solid var(--line); background:#fff; color:var(--ink-soft);
  white-space:nowrap; cursor:default; transition:border-color .15s ease, color .15s ease;
}
.chip-cat:hover{border-color:#d4d4ce; color:var(--ink)}
.chip-cat.is-on{
  color:var(--ink); border-color:transparent;
  background:linear-gradient(#fff,#fff) padding-box, var(--grad) border-box;
  border:1.5px solid transparent;
}

.svc-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:16px}
.svc{
  display:flex; flex-direction:column; overflow:hidden;
  border:1px solid var(--line); border-radius:18px; background:#fff;
  transition:border-color .15s ease;
}
.svc:hover{border-color:#d9d9d3}
.svc-thumb{
  height:132px; display:flex; align-items:flex-end; padding:14px;
  background:var(--grad); position:relative;
}
.svc-thumb::after{
  content:""; position:absolute; inset:0;
  background:radial-gradient(circle at 78% 18%, rgba(255,255,255,.34), transparent 62%);
}
.svc-thumb span{
  position:relative; z-index:1;
  font-size:11.5px; letter-spacing:.06em; text-transform:uppercase;
  color:#fff; background:rgba(0,0,0,.24); padding:5px 11px; border-radius:999px;
}
.svc-body{display:flex; flex-direction:column; flex:1; padding:16px 18px 18px}
.svc-by{
  display:flex; align-items:center; gap:6px;
  font-family:'Archivo',sans-serif; font-weight:700; font-size:14px; letter-spacing:-0.02em;
}
.svc-by svg{
  width:15px; height:15px; fill:none; stroke:#FF5F0E;
  stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round;
}
.svc-by em{
  font-family:'Inter',sans-serif; font-style:normal;
  font-size:12px; font-weight:400; color:var(--ghost); margin-left:2px;
}
/* Başlık tek satır, taşan kısım "…" ile kesilir — hizmet adları çok değişken
   uzunlukta geliyor, ızgaradaki kartlar aynı hizada dursun. */
.svc h3{
  margin-top:11px; font-family:'Archivo',sans-serif; font-size:15.5px; font-weight:700;
  letter-spacing:-0.02em; line-height:1.3;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
/* Açıklama en fazla 3 satır; fazlası "…" ile kesilir. */
.svc p{
  margin-top:7px; font-size:13px; line-height:1.6; color:var(--ink-soft); text-wrap:pretty;
  display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3; line-clamp:3;
  overflow:hidden;
}
.svc-foot{
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  margin-top:auto; padding-top:16px;
}
.svc-foot b{font-family:'Archivo',sans-serif; font-size:17px; font-weight:700; letter-spacing:-0.02em}
.svc-foot small{font-size:11.5px; font-weight:400; color:var(--ink-soft)}
/* Kart butonu artık katalog bağlantısı (<span> değil <a>) — alt çizgi istemiyoruz. */
.svc-btn{
  font-size:13px; font-weight:500; padding:9px 15px; border-radius:10px;
  border:1px solid var(--line); color:var(--ink); white-space:nowrap;
  text-decoration:none;
}
.svc:hover .svc-btn{border-color:#cfcfc9}

.ssa-cta{
  display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap;
  margin-top:22px; padding:22px 24px;
  border:1px solid var(--line); border-radius:18px; background:#fff;
}
.ssa-cta b{display:block; font-family:'Archivo',sans-serif; font-size:16px; font-weight:700; letter-spacing:-0.02em}
.ssa-cta span{display:block; margin-top:4px; font-size:13.5px; color:var(--ink-soft)}
@media (max-width:940px){ .svc-grid{grid-template-columns:repeat(2,1fr)} }
@media (max-width:620px){ .svc-grid{grid-template-columns:1fr} }

.pricing{max-width:1180px; margin:0 auto; padding:0 24px 96px}
.cycle{
  display:flex; align-items:center; gap:4px; width:max-content;
  margin:0 auto 28px; padding:5px; border:1px solid var(--line);
  border-radius:999px; background:#fff; flex-wrap:wrap; justify-content:center;
}
.cyc{
  font-size:14px; padding:9px 20px; border-radius:999px;
  color:var(--ink-soft); cursor:pointer; white-space:nowrap;
  transition:background .15s ease, color .15s ease;
}
.cyc:hover{color:var(--ink)}
.cyc.is-on{background:#f4f4f0; color:#c2521a; font-weight:500}
.cycle-note{
  font-size:12.5px; padding:7px 14px; border-radius:999px;
  background:#fdece2; color:#c2521a; white-space:nowrap;
}

.plan-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:16px; align-items:start}
.plan{
  position:relative; display:flex; flex-direction:column;
  border:1px solid var(--line); border-radius:20px; background:#fff; padding:24px 22px 26px;
}
.plan.is-pop{
  border-color:transparent;
  background:linear-gradient(#fff,#fff) padding-box, var(--grad) border-box;
  border:1.6px solid transparent;
}
.plan-pop{
  position:absolute; top:20px; right:20px;
  font-size:11.5px; font-weight:500; padding:5px 12px; border-radius:999px;
  background:var(--grad); color:#fff;
}
.plan-head{display:flex; align-items:center; gap:10px}
.plan-ico{
  flex:none; width:34px; height:34px; border-radius:10px;
  border:1px solid var(--line); display:flex; align-items:center; justify-content:center;
  color:#8d8d86;
}
.plan-ico svg{width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round}
.plan-head b{font-family:'Archivo',sans-serif; font-size:19px; font-weight:700; letter-spacing:-0.03em}
.plan-tag{display:block; margin-top:9px; font-size:13px; color:var(--ink-soft)}
.plan-price{display:flex; align-items:baseline; gap:7px; margin-top:16px}
.plan-price em{
  font-family:'Archivo',sans-serif; font-style:normal;
  font-size:38px; font-weight:700; letter-spacing:-0.045em; line-height:1;
}
.plan-price i{font-style:normal; font-size:14px; color:var(--ink-soft)}
.plan-sub{display:block; margin-top:7px; font-size:12.5px; color:var(--ghost)}
.plan-list{list-style:none; margin:20px 0 0; padding:0; display:flex; flex-direction:column; gap:9px}
.plan-list li{
  position:relative; padding-left:22px; font-size:13.5px; line-height:1.45; color:var(--ink-soft);
}
.plan-list li::before{
  content:""; position:absolute; left:2px; top:5px; width:9px; height:5px;
  border-left:1.8px solid var(--ink); border-bottom:1.8px solid var(--ink);
  transform:rotate(-45deg);
}
.plan-list li.is-off{color:var(--ghost)}
.plan-list li.is-off::before{
  content:"×"; border:0; transform:none;
  left:3px; top:0; width:auto; height:auto;
  font-size:15px; line-height:1.45; color:var(--ghost);
}
.plan-list li b{color:var(--ink); font-weight:600}
.plan-btn{
  margin-top:22px; text-align:center; font-size:14.5px; font-weight:500;
  padding:12px 18px; border-radius:11px; text-decoration:none;
  border:1px solid var(--line); color:var(--ink);
  transition:border-color .15s ease;
}
.plan-btn:hover{border-color:#cfcfc9}
.plan.is-pop .plan-list li.is-off{color:var(--ghost)}
.plan-list li.is-off::before{
  content:"×"; border:0; transform:none;
  left:3px; top:0; width:auto; height:auto;
  font-size:15px; line-height:1.45; color:var(--ghost);
}
.plan-list li b{color:var(--ink); font-weight:600}
.plan-btn{background:var(--ink); color:#fff; border-color:transparent}
.plan.is-pop .plan-btn:hover{background:#2e2e34}
@media (max-width:1040px){ .plan-grid{grid-template-columns:repeat(2,1fr)} }
@media (max-width:620px){ .plan-grid{grid-template-columns:1fr} }

.tools{max-width:1180px; margin:0 auto; padding:0 24px 96px}
.tools-badge{
  display:inline-block; margin-bottom:14px;
  font-size:12px; padding:6px 13px; border-radius:999px;
  background:#fdece2; color:#c2521a;
}
.tool-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:16px}
.tool{
  display:flex; flex-direction:column; text-decoration:none; color:var(--ink);
  border:1px solid var(--line); border-radius:18px; background:#fff; padding:22px;
  transition:border-color .15s ease, transform .15s ease;
}
.tool:hover{border-color:#d9d9d3; transform:translateY(-2px)}
.tool-ico{
  width:42px; height:42px; border-radius:12px; border:1px solid var(--line);
  display:flex; align-items:center; justify-content:center; color:#8d8d86;
}
.tool-ico svg{width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round}
.tool b{color:var(--ink); margin-top:15px; font-family:'Archivo',sans-serif; font-size:15.5px; font-weight:700; letter-spacing:-0.02em}
.tool p{margin-top:8px; font-size:13.5px; line-height:1.6; color:var(--ink-soft); text-wrap:pretty}
.tool-go{margin-top:16px; font-size:13px; font-weight:500; color:#c2521a}
@media (max-width:940px){ .tool-grid{grid-template-columns:repeat(2,1fr)} }
@media (max-width:620px){ .tool-grid{grid-template-columns:1fr} }

.contact{max-width:1180px; margin:0 auto; padding:0 24px 96px}
.ct-card{
  display:flex; align-items:stretch; overflow:hidden;
  border:1px solid var(--line); border-radius:22px; background:#fff;
}
.ct-side{
  flex:0 0 330px; padding:30px 28px; display:flex; flex-direction:column; gap:22px;
  border-right:1px solid var(--line);
  background-image:radial-gradient(circle, #e0e0da 1.3px, transparent 1.3px);
  background-size:16px 16px;
}
.ct-line{display:flex; align-items:center; gap:13px}
.ct-ico{
  flex:none; width:40px; height:40px; border-radius:12px;
  border:1px solid var(--line); background:#fff; color:#8d8d86;
  display:flex; align-items:center; justify-content:center;
}
.ct-ico svg{width:19px; height:19px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round}
.ct-line b{display:block; font-family:'Archivo',sans-serif; font-size:14.5px; font-weight:700; letter-spacing:-0.02em}
.ct-line small{display:block; margin-top:2px; font-size:13px; color:var(--ink-soft)}
/* Telefon ve WhatsApp bağlantıları satırın kendi rengini korusun, altı çizili gelmesin. */
.ct-line small a{color:inherit; text-decoration:none; transition:color .15s ease}
.ct-line small a:hover{color:#c2521a}
.ct-form{flex:1; min-width:0; padding:28px 26px; display:flex; flex-direction:column}
.ct-form .calc-row:first-child{margin-top:0}
.ct-form textarea{resize:vertical; font:inherit; font-size:14px}
.ct-form label{display:flex; flex-direction:column; gap:6px; min-width:0; font-size:12.5px; color:var(--ink-soft)}
.ct-note{margin-top:11px; font-size:12px; color:var(--ghost); text-align:center}

.ft{border-top:1px solid var(--line); background:#fff}
.ft-inner{
  max-width:1180px; margin:0 auto; padding:52px 24px 40px;
  display:grid; grid-template-columns:1.5fr 1fr 1fr 1fr 1fr; gap:28px;
}
.ft-brand img{display:block; height:27px; width:auto}
.ft-brand p{margin-top:14px; font-size:13.5px; line-height:1.65; color:var(--ink-soft); max-width:260px}
.ft-col{display:flex; flex-direction:column; gap:9px}
.ft-col b{font-family:'Archivo',sans-serif; font-size:13px; font-weight:700; letter-spacing:-0.01em; margin-bottom:3px}
.ft-col a{font-size:13.5px; color:var(--ink-soft); text-decoration:none; line-height:1.4}
.ft-col a:hover{color:var(--ink)}
/* Çerez tercihleri bir eylem; buton ama sütundaki linklerle aynı görünmeli. */
.ft-linkbtn{
  font: inherit; font-size:13.5px; line-height:1.4; color:var(--ink-soft);
  background:none; border:0; padding:0; text-align:left; cursor:pointer;
}
.ft-linkbtn:hover{color:var(--ink)}
.ft-bottom{
  max-width:1180px; margin:0 auto; padding:20px 24px 34px;
  border-top:1px solid var(--line);
  display:flex; justify-content:space-between; gap:14px; flex-wrap:wrap;
  font-size:12.5px; color:var(--ghost);
}
@media (max-width:620px){
  .ct-form .calc-row{grid-template-columns:1fr}
}
@media (max-width:940px){
  .ct-card{flex-direction:column}
  .ct-side{flex:none; border-right:0; border-bottom:1px solid var(--line)}
  .ft-inner{grid-template-columns:1fr 1fr}
}
@media (max-width:620px){ .ft-inner{grid-template-columns:1fr} }

.ft-dl{display:flex; align-items:center; gap:10px; margin-top:24px}
.ft-dl b{font-family:'Archivo',sans-serif; font-size:14px; font-weight:700; letter-spacing:-0.02em}
.ft-soon{
  font-size:11.5px; padding:5px 12px; border-radius:999px;
  background:var(--grad); color:#fff;
}
.ft-app{
  display:flex; align-items:center; gap:11px; margin-top:9px; max-width:240px;
  padding:9px 14px; border:1px solid var(--line); border-radius:12px;
  text-decoration:none; color:var(--ink); transition:border-color .15s ease;
}
.ft-app:hover{border-color:#d4d4ce}
/* Uygulama yayında değilken rozet bağlantı değil — tıklanabilir gibi durmasın. */
.ft-app.is-soon{cursor:default; opacity:.72}
.ft-app.is-soon:hover{border-color:var(--line)}
.ft-app-ico{
  flex:none; width:26px; height:26px; border-radius:8px;
  background:#f2f2ee; border:1px solid var(--line);
  display:flex; align-items:center; justify-content:center; color:var(--ink);
}
.ft-app-ico svg{width:16px; height:16px; display:block}
.ft-app small{display:block; font-size:11px; color:var(--ink-soft)}
.ft-app b{display:block; font-family:'Archivo',sans-serif; font-size:13.5px; font-weight:700; letter-spacing:-0.02em}
.ft-socs{display:flex; gap:8px}
.ft-soc{
  width:34px; height:34px; border-radius:10px; border:1px solid var(--line);
  display:flex; align-items:center; justify-content:center; color:var(--ink-soft);
  transition:border-color .15s ease, color .15s ease;
}
.ft-soc:hover{border-color:#d4d4ce; color:var(--ink)}
.ft-soc svg{width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round}

.ft-mid{
  max-width:1180px; margin:0 auto; padding:6px 24px 26px;
  display:flex; align-items:center; gap:20px; flex-wrap:wrap;
}
.ft-pay{margin-left:auto; display:flex; align-items:center; gap:14px; flex-wrap:wrap}
.ft-pay-lbl{font-size:12.5px; color:var(--ghost)}
.pay-banner{height:22px; width:auto; max-width:100%; display:block}

a:focus-visible,.btn:focus-visible,.icon-btn:focus-visible{outline:2px solid var(--ink); outline-offset:3px}

html:not(.js) .wheel,html:not(.js) .word,html:not(.js) .word > span,html:not(.js) .slot{animation:none}
html:not(.js) .slot{width:auto}
html:not(.js) .word:not(:first-child){display:none}
html:not(.js) .word:first-child{filter:none; opacity:1}
html:not(.js) .word:first-child > span{-webkit-text-fill-color:transparent}

@media (max-width:900px){
  .nav-links{display:none}
  .burger{display:inline-flex}
  .stats{gap:32px}
}
@media (max-width:820px){
  .howto-body{display:block}
  .howto-left{flex:none; border-right:0; border-bottom:1px solid var(--line)}
}
@media (max-width:520px){
  .hero{padding:80px 16px 64px}
  .actions{gap:8px}
  .btn{font-size:13px; padding:11px 16px}
  .line-2{flex-wrap:wrap}
}
@media (prefers-reduced-motion:reduce){
  .wheel,.word,.word > span,.slot,.marquee-track{animation:none}
  .slot{width:auto}
  .word{filter:none}
  .word:not(:first-child){display:none}
  .word:first-child > span{-webkit-text-fill-color:transparent}
  .flow .fhalo1,.flow .fhalo2,.flow .fhalo3,.flow .fhalo4,
  .flow .fhead,.flow .fmid,.flow .ftail,
  .flow .fring,.flow .fring circle,.flow .xb,.flow .fedge{animation:none}
}

.svc-perks{display:flex; flex-direction:column; gap:6px; margin-top:11px}
.svc-perk{display:flex; align-items:center; gap:7px; font-size:12.5px; line-height:1.35}
.svc-perk svg{
  flex:none; width:15px; height:15px; fill:none; stroke:currentColor;
  stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round;
}
.svc-perk.is-point{color:var(--accent-ink, #c2521a)}
.svc-perk.is-ref{color:#2f7d53}

.svc-bundle{
  margin:14px 0 2px; padding:13px 14px; border-radius:13px;
  background:#eef2ee; border:1px solid #dfe7df;
}
.svc-bundle > b{
  display:flex; align-items:center; gap:7px;
  font-family:'Archivo',sans-serif; font-size:12.5px; font-weight:700;
  letter-spacing:-0.01em; color:#2E4034;
}
.svc-bundle > b svg{
  flex:none; width:15px; height:15px; fill:none; stroke:currentColor;
  stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round;
}
.svc-bundle ul{list-style:none; margin:9px 0 0; padding:0; display:flex; flex-direction:column; gap:5px}
.svc-bundle li{display:flex; align-items:center; gap:8px; font-size:12.5px; line-height:1.4}
.svc-bundle li::before{
  content:""; flex:none; width:6px; height:6px; border-radius:999px;
  border:1.4px solid #7fa38a;
}
.svc-bundle li a{color:#2E4034; text-decoration:underline; text-underline-offset:2px}
.svc-bundle li a:hover{text-decoration-thickness:2px}
.svc-old{display:flex; align-items:center; gap:9px; margin-top:11px; flex-wrap:wrap}
.svc-old s{font-size:13px; color:var(--ghost)}
.svc-save{
  font-size:11.5px; font-weight:500; padding:4px 10px; border-radius:999px;
  background:var(--grad); color:#fff;
}

.svc-rate{display:flex; align-items:center; gap:5px; margin-left:auto; font-size:12px; color:var(--ink-soft)}
.svc-stars{display:inline-flex; gap:1px}
.svc-stars svg{width:12px; height:12px; fill:#FF5F0E}
.svc-stars svg.off{fill:#e4e4de}
.svc-stars svg.half{fill:url(#halfstar)}
.svc-rate b{font-family:'Archivo',sans-serif; font-size:12.5px; font-weight:700; color:var(--ink); letter-spacing:-0.02em}
.svc-rate small{color:var(--ghost); font-size:11.5px}

/* ---- Sıkça sorulan sorular ---- */
.doc{max-width:1180px; margin:0 auto; padding:56px 24px 96px}
.faq-chips{display:flex; gap:8px; justify-content:center; flex-wrap:wrap; margin-bottom:34px}
.faq-chips a{
  font-size:13.5px; padding:9px 16px; border-radius:999px; text-decoration:none;
  border:1px solid var(--line); background:#fff; color:var(--ink-soft);
}
.faq-chips a:hover{border-color:#d4d4ce; color:var(--ink)}
.faq-wrap{max-width:760px; margin:0 auto}
.faq-group + .faq-group{margin-top:38px}
.faq-group h3{
  font-family:'Archivo',sans-serif; font-size:15px; font-weight:700;
  letter-spacing:-0.02em; color:var(--ink-soft); margin-bottom:12px;
}
.faq-q{border:1px solid var(--line); border-radius:14px; background:#fff; margin-bottom:8px}
.faq-q summary{
  list-style:none; cursor:pointer; padding:16px 18px;
  display:flex; align-items:center; justify-content:space-between; gap:14px;
  font-size:15px; font-weight:500;
}
.faq-q summary::-webkit-details-marker{display:none}
.faq-plus{position:relative; flex:none; width:14px; height:14px}
.faq-plus::before,.faq-plus::after{
  content:""; position:absolute; background:var(--ink-soft); border-radius:2px;
  transition:transform .2s ease, opacity .2s ease;
}
.faq-plus::before{left:0; top:6px; width:14px; height:1.8px}
.faq-plus::after{left:6px; top:0; width:1.8px; height:14px}
.faq-q[open] .faq-plus::after{transform:rotate(90deg); opacity:0}
.faq-q p{padding:0 18px 18px; font-size:14px; line-height:1.7; color:var(--ink-soft); text-wrap:pretty}
.faq-cta{
  max-width:760px; margin:40px auto 0; padding:24px;
  border:1px solid var(--line); border-radius:18px; background:#fff;
  display:flex; align-items:center; justify-content:space-between; gap:18px; flex-wrap:wrap;
}
.faq-cta b{display:block; font-family:'Archivo',sans-serif; font-size:16px; font-weight:700; letter-spacing:-0.02em}
.faq-cta span{display:block; margin-top:4px; font-size:13.5px; color:var(--ink-soft)}

/* ---- Blog ---- */
.blog{max-width:1180px; margin:0 auto; padding:56px 24px 96px}
.blog-chips{display:flex; gap:8px; justify-content:center; flex-wrap:wrap; margin-bottom:30px}
/* Tasarımda çiplerin hepsi <span>'di; gerçek sayfada kategoriler <a> olduğu için
   iki etiket de aynı kurala bağlı — yoksa linkler tarayıcı varsayılanına düşüyor. */
.blog-chips span, .blog-chips a{
  font-size:13.5px; padding:9px 16px; border-radius:999px;
  border:1px solid var(--line); background:#fff; color:var(--ink-soft); cursor:pointer;
  text-decoration:none; white-space:nowrap;
}
.blog-chips span:hover, .blog-chips a:hover{border-color:#d4d4ce; color:var(--ink)}
.blog-chips span.is-on, .blog-chips a.is-on{
  color:var(--ink); border-color:transparent;
  background:linear-gradient(#fff,#fff) padding-box, var(--grad) border-box;
  border:1.5px solid transparent;
}
.post-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:18px}
.post{
  color:inherit; text-decoration:none;
  display:flex; flex-direction:column; overflow:hidden;
  border:1px solid var(--line); border-radius:18px; background:#fff;
  transition:border-color .15s ease, transform .15s ease;
}
.post:hover{border-color:#d9d9d3; transform:translateY(-2px)}
.post-thumb{height:150px; position:relative; background:var(--grad); display:flex; align-items:flex-end; padding:14px}
.post-thumb::after{content:""; position:absolute; inset:0; background:radial-gradient(circle at 76% 20%, rgba(255,255,255,.34), transparent 62%)}
.post-thumb span{
  position:relative; z-index:1; font-size:11.5px; letter-spacing:.06em; text-transform:uppercase;
  color:#fff; background:rgba(0,0,0,.24); padding:5px 11px; border-radius:999px;
}
.post-body{padding:18px; display:flex; flex-direction:column; flex:1}
.post h3{font-family:'Archivo',sans-serif; font-size:16px; font-weight:700; letter-spacing:-0.025em; line-height:1.3}
.post p{margin-top:9px; font-size:13.5px; line-height:1.65; color:var(--ink-soft); text-wrap:pretty}
.post small{margin-top:auto; padding-top:14px; font-size:12.5px; color:var(--ghost)}
.post.is-big{grid-column:1 / -1; flex-direction:row; margin-bottom:18px}
.post.is-big .post-thumb{flex:0 0 46%; height:auto; min-height:250px}
.post.is-big .post-body{justify-content:center; padding:30px}
.post.is-big h3{font-size:24px; letter-spacing:-0.035em}
.post.is-big p{font-size:15px; max-width:520px}
.news{
  margin-top:36px; padding:26px; border-radius:18px;
  border:1.6px solid transparent;
  background:linear-gradient(#fff,#fff) padding-box, var(--grad) border-box;
  display:flex; align-items:center; justify-content:space-between; gap:18px; flex-wrap:wrap;
}
.news b{display:block; font-family:'Archivo',sans-serif; font-size:17px; font-weight:700; letter-spacing:-0.025em}
.news span{display:block; margin-top:5px; font-size:13.5px; color:var(--ink-soft)}
.news form{display:flex; gap:10px; flex-wrap:wrap}
.news input{
  font:inherit; font-size:14px; padding:12px 14px; min-width:240px;
  border:1px solid var(--line); border-radius:11px; background:#fff;
}
.news input:focus{outline:none; border-color:#c9c9c2}
@media (max-width:940px){ .post-grid{grid-template-columns:repeat(2,1fr)} .post.is-big{flex-direction:column} .post.is-big .post-thumb{flex:none; height:170px; min-height:0} }
@media (max-width:620px){ .post-grid{grid-template-columns:1fr} }


/* ---- Blog yazısı ---- */
.fig{margin:30px 0}
.fig-ph{
  position:relative; height:300px; border-radius:16px; overflow:hidden;
  background:var(--grad); display:flex; align-items:flex-end; padding:14px;
}
.fig-ph::after{content:""; position:absolute; inset:0; background:radial-gradient(circle at 74% 20%, rgba(255,255,255,.32), transparent 60%)}
.fig-ph span{
  position:relative; z-index:1; font-size:11px; letter-spacing:.07em; text-transform:uppercase;
  color:#fff; background:rgba(0,0,0,.24); padding:5px 11px; border-radius:999px;
}
.fig img{display:block; width:100%; height:auto; border-radius:16px}
.fig figcaption{
  margin-top:10px; font-size:12.5px; line-height:1.55; color:var(--ghost); text-wrap:pretty;
}
.fig-2{display:grid; grid-template-columns:1fr 1fr; gap:14px}
.fig-2 .fig-ph{height:210px}
.fig-wide{width:calc(100% + 120px); margin-left:-60px}
.fig-wide .fig-ph{height:360px; border-radius:20px}
.fig-wide figcaption{padding:0 60px}
@media (max-width:1100px){ .fig-wide{width:100%; margin-left:0} .fig-wide figcaption{padding:0} }
@media (max-width:620px){ .fig-2{grid-template-columns:1fr} .fig-ph{height:220px} .fig-wide .fig-ph{height:240px} }

.art-top{max-width:1180px; margin:0 auto; padding:44px 24px 0}
.art-tag{
  display:inline-block; font-size:11.5px; letter-spacing:.06em; text-transform:uppercase;
  color:#fff; background:var(--grad); padding:6px 13px; border-radius:999px;
}
.art-top h1{
  margin-top:16px; max-width:820px;
  font-family:'Archivo',sans-serif; font-weight:700;
  font-size:clamp(28px, calc(var(--fs) * 0.62), 42px);
  letter-spacing:-0.04em; line-height:1.12;
}
.art-meta{display:flex; align-items:center; gap:12px; margin-top:20px; flex-wrap:wrap}
.art-av{width:38px; height:38px; border-radius:12px; background:var(--grad); flex:none}
.art-meta b{display:block; font-family:'Archivo',sans-serif; font-size:14px; font-weight:700; letter-spacing:-0.02em}
.art-meta small{display:block; margin-top:2px; font-size:12.5px; color:var(--ink-soft)}
.art-hero{
  position:relative; height:320px; margin:26px 0 0; border-radius:22px;
  background:var(--grad); overflow:hidden;
}
.art-hero::after{content:""; position:absolute; inset:0; background:radial-gradient(circle at 76% 18%, rgba(255,255,255,.3), transparent 60%)}

.art{max-width:1180px; margin:0 auto; padding:0 24px 90px}
.art-wrap{display:grid; grid-template-columns:1fr 232px; gap:40px; align-items:start; margin-top:34px}
.art-body{max-width:720px}
.art-body .lead{font-size:18px; line-height:1.7; color:var(--ink); text-wrap:pretty}
.art-body h3{
  margin-top:34px; font-family:'Archivo',sans-serif; font-size:20px;
  font-weight:700; letter-spacing:-0.03em; scroll-margin-top:24px;
}
.art-body p{margin-top:12px; font-size:15.5px; line-height:1.8; color:var(--ink-soft); text-wrap:pretty}
.art-body p b{color:var(--ink); font-weight:600}
.pull{
  margin:30px 0; padding:22px 24px; border-radius:16px;
  border:1.6px solid transparent;
  background:linear-gradient(#fff,#fff) padding-box, var(--grad) border-box;
  font-family:'Archivo',sans-serif; font-size:18px; font-weight:600;
  letter-spacing:-0.02em; line-height:1.45;
}
.art-side{position:sticky; top:20px; display:flex; flex-direction:column; gap:26px}
.art-side b.hd{font-size:12px; letter-spacing:.08em; text-transform:uppercase; color:var(--ghost)}
.art-toc{display:flex; flex-direction:column; gap:9px; margin-top:12px}
.art-toc a{font-size:13px; line-height:1.5; color:var(--ink-soft); text-decoration:none}
.art-toc a:hover{color:var(--ink)}
.shares{display:flex; gap:8px; margin-top:12px}
.sh{
  width:36px; height:36px; border-radius:11px; border:1px solid var(--line);
  display:flex; align-items:center; justify-content:center; color:var(--ink-soft);
  transition:border-color .15s ease, color .15s ease;
}
.sh:hover{border-color:#d4d4ce; color:var(--ink)}
.sh svg{width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round}

.author{
  max-width:720px; margin-top:44px; padding:22px; display:flex; gap:16px; align-items:center;
  border:1px solid var(--line); border-radius:18px; background:#fff;
}
.author b{display:block; font-family:'Archivo',sans-serif; font-size:15px; font-weight:700; letter-spacing:-0.02em}
.author p{margin-top:5px; font-size:13.5px; line-height:1.6; color:var(--ink-soft)}
.rel{max-width:1180px; margin:0 auto; padding:0 24px 96px}
.rel h2{font-family:'Archivo',sans-serif; font-size:22px; font-weight:700; letter-spacing:-0.03em; margin-bottom:18px}
@media (max-width:960px){ .art-wrap{grid-template-columns:1fr} .art-side{position:static; flex-direction:row; flex-wrap:wrap; gap:34px} }

/* ---- yorumlar ---- */
.rv-sum{
  display:grid; grid-template-columns:200px 1fr; gap:28px; align-items:center;
  padding:22px 24px; border:1px solid var(--line); border-radius:18px; background:#fff;
}
.rv-score{text-align:center}
.rv-score b{display:block; font-family:'Archivo',sans-serif; font-size:42px; font-weight:700; letter-spacing:-0.045em; line-height:1}
.rv-score small{display:block; margin-top:8px; font-size:12.5px; color:var(--ink-soft)}
.rv-stars{display:inline-flex; gap:2px}
.rv-stars svg{width:15px; height:15px; fill:#FF5F0E}
.rv-stars svg.off{fill:#e4e4de}
.rv-score .rv-stars{margin-top:8px}
.rv-score .rv-stars svg{width:17px; height:17px}
.rv-bars{display:flex; flex-direction:column; gap:7px}
.rv-bar{display:flex; align-items:center; gap:10px; font-size:12.5px; color:var(--ink-soft)}
.rv-bar > span{width:10px; text-align:right}
.rv-bar i{flex:1; height:7px; border-radius:999px; background:#f0f0ec; overflow:hidden}
.rv-bar b{display:block; height:100%; border-radius:999px; background:var(--grad)}
.rv-bar em{width:34px; font-style:normal; text-align:right; color:var(--ghost)}

.rv-list{display:flex; flex-direction:column; gap:14px; margin-top:16px}
.rv{display:flex; gap:14px; padding:20px; border:1px solid var(--line); border-radius:18px; background:#fff}
.rv-av{
  flex:none; width:42px; height:42px; border-radius:13px; background:var(--grad);
  display:flex; align-items:center; justify-content:center;
  font-family:'Archivo',sans-serif; font-size:14px; font-weight:700; color:#fff; letter-spacing:-0.02em;
}
.rv-body{flex:1; min-width:0}
.rv-head{display:flex; align-items:center; gap:10px; flex-wrap:wrap}
.rv-head b{font-family:'Archivo',sans-serif; font-size:14.5px; font-weight:700; letter-spacing:-0.02em}
.rv-head small{margin-left:auto; font-size:12.5px; color:var(--ghost)}
.rv-ver{display:inline-flex; align-items:center; gap:5px; font-size:11.5px; color:#2f7d53}
.rv-ver svg{width:13px; height:13px; fill:none; stroke:currentColor; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round}
.rv .rv-stars{margin-top:7px}
.rv p{margin-top:9px; font-size:14px; line-height:1.7; color:var(--ink-soft); text-wrap:pretty}
.rv-reply{
  margin-top:14px; padding:14px 16px; border-radius:13px;
  background:#f6f6f3; border-left:2.5px solid #FF5F0E;
}
.rv-reply b{font-family:'Archivo',sans-serif; font-size:13px; font-weight:700; letter-spacing:-0.02em}
.rv-reply p{margin-top:5px; font-size:13.5px; line-height:1.6}
.rv-more{
  margin-top:14px; width:100%; font:inherit; font-size:14px; padding:12px;
  border:1px solid var(--line); border-radius:12px; background:#fff;
  color:var(--ink-soft); cursor:pointer;
}
.rv-more:hover{border-color:#d4d4ce; color:var(--ink)}
@media (max-width:640px){ .rv-sum{grid-template-columns:1fr; gap:18px} }

a:focus-visible,.btn:focus-visible,.icon-btn:focus-visible{outline:2px solid var(--ink); outline-offset:3px}

html:not(.js) .wheel,html:not(.js) .word,html:not(.js) .word > span,html:not(.js) .slot{animation:none}
html:not(.js) .slot{width:auto}
html:not(.js) .word:not(:first-child){display:none}
html:not(.js) .word:first-child{filter:none; opacity:1}
html:not(.js) .word:first-child > span{-webkit-text-fill-color:transparent}

@media (max-width:900px){
  .nav-links{display:none}
  .burger{display:inline-flex}
  .stats{gap:32px}
}
@media (max-width:820px){
  .howto-body{display:block}
  .howto-left{flex:none; border-right:0; border-bottom:1px solid var(--line)}
}
@media (max-width:520px){
  .hero{padding:80px 16px 64px}
  .actions{gap:8px}
  .btn{font-size:13px; padding:11px 16px}
  .line-2{flex-wrap:wrap}
}
@media (prefers-reduced-motion:reduce){
  .wheel,.word,.word > span,.slot,.marquee-track{animation:none}
  .slot{width:auto}
  .word{filter:none}
  .word:not(:first-child){display:none}
  .word:first-child > span{-webkit-text-fill-color:transparent}
  .flow .fhalo1,.flow .fhalo2,.flow .fhalo3,.flow .fhalo4,
  .flow .fhead,.flow .fmid,.flow .ftail,
  .flow .fring,.flow .fring circle,.flow .xb,.flow .fedge{animation:none}
}

/* ---- servis detay ---- */
.sd{max-width:1180px; margin:0 auto; padding:34px 24px 90px}
.sd-crumb{display:flex; gap:8px; font-size:13px; color:var(--ghost); margin-bottom:20px}
.sd-crumb a{color:var(--ink-soft); text-decoration:none}
.sd-crumb a:hover{color:var(--ink)}
.sd-wrap{display:grid; grid-template-columns:1fr 358px; gap:24px; align-items:start}

.sd-cover{
  position:relative; height:330px; border-radius:20px; overflow:hidden;
  background:var(--grad); display:flex; align-items:center; justify-content:center;
}
.sd-cover::after{content:""; position:absolute; inset:0; background:radial-gradient(circle at 76% 18%, rgba(255,255,255,.3), transparent 60%)}
.sd-play{
  position:relative; z-index:1; width:66px; height:66px; border-radius:999px;
  background:rgba(255,255,255,.92); display:flex; align-items:center; justify-content:center;
  box-shadow:0 12px 30px rgba(20,20,25,.2);
}
.sd-play svg{width:22px; height:22px; margin-left:3px; fill:var(--ink)}
.sd-tag{
  display:inline-block; margin-top:22px; font-size:11.5px; letter-spacing:.06em;
  text-transform:uppercase; color:#fff; background:var(--grad); padding:6px 13px; border-radius:999px;
}
.sd h1{
  margin-top:14px; font-family:'Archivo',sans-serif; font-weight:700;
  font-size:clamp(26px, calc(var(--fs) * 0.58), 38px); letter-spacing:-0.04em; line-height:1.14;
}
.sd-meta{display:flex; align-items:center; gap:14px; margin-top:12px; flex-wrap:wrap; font-size:13px; color:var(--ink-soft)}
.sd-meta .dot{width:4px; height:4px; border-radius:999px; background:var(--line)}

.sd-tabs{display:flex; gap:2px; margin-top:26px; border-bottom:1px solid var(--line)}
.sd-tabs a{
  padding:11px 15px; font-size:14px; color:var(--ink-soft); text-decoration:none;
  border-bottom:2px solid transparent; margin-bottom:-1px;
}
.sd-tabs a:hover{color:var(--ink)}
.sd-tabs a.is-on{color:var(--ink); font-weight:500; border-bottom-color:var(--accent, #FF5F0E)}

.sd-block{padding-top:30px; scroll-margin-top:20px}
.sd-block > h2{font-family:'Archivo',sans-serif; font-size:19px; font-weight:700; letter-spacing:-0.03em}
.sd-block p{margin-top:12px; font-size:15px; line-height:1.8; color:var(--ink-soft); text-wrap:pretty; max-width:720px}
.sd-inc{list-style:none; margin:18px 0 0; padding:0; display:grid; grid-template-columns:1fr 1fr; gap:10px 22px}
.sd-inc li{position:relative; padding-left:24px; font-size:14px; line-height:1.5; color:var(--ink-soft)}
.sd-inc li::before{
  content:""; position:absolute; left:3px; top:6px; width:9px; height:5px;
  border-left:1.8px solid var(--ink); border-bottom:1.8px solid var(--ink); transform:rotate(-45deg);
}
.sd-steps{display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-top:18px}
.sd-step{padding:18px; border:1px solid var(--line); border-radius:16px; background:#fff}
.sd-num{
  display:flex; align-items:center; justify-content:center; width:28px; height:28px;
  border-radius:9px; font-family:'Archivo',sans-serif; font-size:13px; font-weight:700;
  color:var(--ink); background:linear-gradient(#fff,#fff) padding-box, var(--grad) border-box;
  border:1.5px solid transparent; margin-bottom:12px;
}
.sd-step b{display:block; font-family:'Archivo',sans-serif; font-size:14.5px; font-weight:700; letter-spacing:-0.02em}
.sd-step small{display:block; margin-top:6px; font-size:13px; line-height:1.55; color:var(--ink-soft)}
.sd-empty{
  margin-top:16px; padding:26px; text-align:center; font-size:13.5px; color:var(--ghost);
  border:1px dashed var(--line); border-radius:16px;
}
.sd-prov{display:flex; align-items:center; gap:14px; margin-top:16px; padding:18px; border:1px solid var(--line); border-radius:16px; background:#fff}
.sd-prov-logo{flex:none; width:52px; height:52px; border-radius:14px; background:var(--grad)}
.sd-prov b{display:flex; align-items:center; gap:6px; font-family:'Archivo',sans-serif; font-size:16px; font-weight:700; letter-spacing:-0.02em}
.sd-prov b svg{width:15px; height:15px; fill:none; stroke:#FF5F0E; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round}
.sd-prov small{display:block; margin-top:4px; font-size:13px; color:var(--ink-soft)}
.sd-prov a{margin-left:auto; font-size:13.5px; color:var(--accent-ink, #c2521a); text-decoration:none; white-space:nowrap}

/* satın alma kartı */
.sd-buy{position:sticky; top:20px; border:1px solid var(--line); border-radius:20px; background:#fff; padding:22px}
.sd-buy-top{display:flex; align-items:center; gap:11px; padding-bottom:16px; border-bottom:1px solid var(--line)}
.sd-buy-logo{flex:none; width:40px; height:40px; border-radius:12px; background:var(--grad)}
.sd-buy-top b{display:block; font-family:'Archivo',sans-serif; font-size:15px; font-weight:700; letter-spacing:-0.02em}
.sd-buy-top small{display:block; margin-top:2px; font-size:12.5px; color:var(--ghost)}
.sd-price{display:flex; align-items:baseline; gap:8px; margin-top:16px; flex-wrap:wrap}
.sd-price em{font-style:normal; font-family:'Archivo',sans-serif; font-size:30px; font-weight:700; letter-spacing:-0.04em}
.sd-price span{font-size:13px; color:var(--ink-soft)}
.sd-taksit{margin-top:8px; font-size:12.5px; color:var(--ink-soft)}
.sd-actions{display:flex; flex-direction:column; gap:9px; margin-top:18px}
.sd-btn{
  width:100%; text-align:center; font-size:15px; font-weight:500; padding:13px 18px;
  border-radius:12px; text-decoration:none; border:1px solid transparent; cursor:pointer;
}
.sd-btn.is-primary{background:var(--ink); color:#fff}
.sd-btn.is-primary:hover{background:#2e2e34}
.sd-btn.is-ghost{background:#fff; color:var(--ink); border-color:var(--line)}
.sd-btn.is-ghost:hover{border-color:#cfcfc9}
.sd-trust{margin-top:16px; padding-top:16px; border-top:1px solid var(--line); display:flex; flex-direction:column; gap:8px}
.sd-trust span{display:flex; align-items:center; gap:8px; font-size:12.5px; color:var(--ink-soft)}
.sd-trust svg{flex:none; width:15px; height:15px; fill:none; stroke:#2f7d53; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round}

.sd-more{max-width:1180px; margin:0 auto; padding:0 24px 96px}
.sd-more h2{font-family:'Archivo',sans-serif; font-size:20px; font-weight:700; letter-spacing:-0.03em; margin-bottom:14px}
.sd-more + .sd-more{padding-top:0}
.sd-rows{display:grid; grid-template-columns:repeat(4,1fr); gap:14px}
.sd-row{
  display:flex; align-items:center; gap:12px; padding:14px;
  border:1px solid var(--line); border-radius:16px; background:#fff;
  text-decoration:none; color:var(--ink); transition:border-color .15s ease;
}
.sd-row:hover{border-color:#d9d9d3}
.sd-row-th{flex:none; width:44px; height:44px; border-radius:12px; background:var(--grad)}
.sd-row-t{min-width:0}
.sd-row-t b{display:block; font-size:13.5px; font-weight:600; line-height:1.3}
.sd-row-t small{display:block; margin-top:3px; font-size:12.5px; color:var(--ink-soft)}
.sd-row-go{margin-left:auto; color:var(--ghost); font-size:17px}
@media (max-width:1040px){ .sd-wrap{grid-template-columns:1fr} .sd-buy{position:static} .sd-steps{grid-template-columns:1fr 1fr} .sd-rows{grid-template-columns:1fr 1fr} }
@media (max-width:620px){ .sd-inc{grid-template-columns:1fr} .sd-steps{grid-template-columns:1fr} .sd-rows{grid-template-columns:1fr} }

/* ---- sağlayıcı profili ---- */
.pf-cover{
  position:relative; height:210px; border-radius:0 0 26px 26px; overflow:hidden;
  background:var(--grad); max-width:1180px; margin:0 auto;
}
.pf-cover::after{content:""; position:absolute; inset:0; background:radial-gradient(circle at 78% 20%, rgba(255,255,255,.3), transparent 60%)}
.pf{max-width:1180px; margin:0 auto; padding:0 24px 90px}
.pf-head{display:flex; align-items:flex-end; gap:20px; margin-top:18px; flex-wrap:wrap}
.pf-logo{
  flex:none; width:104px; height:104px; margin-top:-76px; border-radius:26px;
  background:var(--grad); border:4px solid #fff; box-shadow:0 10px 28px rgba(20,20,25,.12);
}
.pf-id{flex:1; min-width:240px; padding-bottom:6px}
.pf-id h1{
  display:flex; align-items:center; gap:9px;
  font-family:'Archivo',sans-serif; font-size:30px; font-weight:700; letter-spacing:-0.04em;
}
.pf-id h1 svg{flex:none; width:20px; height:20px; fill:none; stroke:#FF5F0E; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round}
.pf-id p{margin-top:7px; font-size:14.5px; line-height:1.6; color:var(--ink-soft); max-width:560px}
.pf-act{display:flex; gap:10px; padding-bottom:6px; flex-wrap:wrap}
.pf-btn{
  font-size:14.5px; font-weight:500; padding:12px 20px; border-radius:12px;
  text-decoration:none; border:1px solid transparent; white-space:nowrap;
}
.pf-btn.is-primary{background:var(--ink); color:#fff}
.pf-btn.is-primary:hover{background:#2e2e34}
.pf-btn.is-ghost{background:#fff; color:var(--ink); border-color:var(--line)}
.pf-btn.is-ghost:hover{border-color:#cfcfc9}

.pf-stats{
  display:flex; gap:34px; flex-wrap:wrap; margin-top:26px; padding:20px 24px;
  border:1px solid var(--line); border-radius:18px; background:#fff;
}
.pf-stats b{display:block; font-family:'Archivo',sans-serif; font-size:21px; font-weight:700; letter-spacing:-0.03em}
.pf-stats span{display:block; margin-top:3px; font-size:12.5px; color:var(--ink-soft)}

.pf-tabs{display:flex; gap:2px; margin-top:28px; border-bottom:1px solid var(--line)}
.pf-tabs a{
  padding:11px 15px; font-size:14px; color:var(--ink-soft); text-decoration:none;
  border-bottom:2px solid transparent; margin-bottom:-1px;
}
.pf-tabs a:hover{color:var(--ink)}
.pf-tabs a.is-on{color:var(--ink); font-weight:500; border-bottom-color:#FF5F0E}

.pf-block{padding-top:30px; scroll-margin-top:20px}
.pf-block > h2{font-family:'Archivo',sans-serif; font-size:19px; font-weight:700; letter-spacing:-0.03em; margin-bottom:16px}
.pf-about{display:grid; grid-template-columns:1fr 340px; gap:26px; align-items:start}
.pf-about p{font-size:15px; line-height:1.8; color:var(--ink-soft); text-wrap:pretty}
.pf-about p + p{margin-top:12px}
.pf-box{border:1px solid var(--line); border-radius:18px; background:#fff; padding:8px 18px}
.pf-info{display:flex; justify-content:space-between; gap:16px; padding:12px 0; border-bottom:1px solid #f2f2ee; font-size:13.5px}
.pf-info:last-child{border-bottom:0}
.pf-info span{color:var(--ink-soft)}
.pf-info b{font-weight:600; text-align:right}
.pf-empty{
  padding:28px; text-align:center; font-size:13.5px; color:var(--ghost);
  border:1px dashed var(--line); border-radius:16px;
}
@media (max-width:900px){
  .pf-about{grid-template-columns:1fr}
  .pf-logo{width:84px; height:84px; margin-top:-58px; border-radius:22px}
}

/* ---- pazaryeri başlığı ---- */
.mk-top{background:#fff; border-bottom:1px solid var(--line); position:sticky; top:0; z-index:30}
.mk-in{
  max-width:1400px; margin:0 auto; padding:12px 24px;
  display:flex; align-items:center; gap:14px;
}
.mk-logo{display:flex; align-items:center}
.mk-mark{display:block; height:30px; width:auto}
.mk-ico{width:19px; height:19px; flex:none; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round}
.mk-loc{
  display:flex; align-items:center; gap:8px; border:0; background:none;
  padding:6px 8px; border-radius:10px; color:var(--ink); text-align:left;
  transition:background .15s ease;
}
.mk-loc:hover{background:var(--soft)}
.mk-loc small,.mk-mini small{display:block; font-size:11px; color:var(--ink-soft); line-height:1.2}
.mk-loc b,.mk-mini b{display:flex; align-items:center; gap:5px; font-family:'Archivo',sans-serif; font-size:13.5px; font-weight:700; letter-spacing:-0.02em; line-height:1.25}

.mk-search{
  flex:1; min-width:0; display:flex; align-items:stretch;
  border:1.6px solid var(--line); border-radius:13px; background:#fff;
  transition:border-color .15s ease;
}
.mk-search:focus-within{border-color:transparent; background:linear-gradient(#fff,#fff) padding-box, var(--grad) border-box}
.mk-catwrap{position:relative; flex:none; display:flex; align-self:stretch}
.mk-catlist{
  position:absolute; top:calc(100% + 8px); left:0; z-index:40;
  min-width:250px; list-style:none; margin:0; padding:6px;
  background:#fff; border:1px solid var(--line); border-radius:14px;
  box-shadow:0 16px 40px rgba(20,20,25,.13);
}
.mk-catlist[hidden]{display:none}
.mk-catlist li{
  padding:9px 11px; border-radius:9px; font-size:13.5px; color:var(--ink);
  cursor:pointer; display:flex; align-items:center; justify-content:space-between; gap:12px;
}
.mk-catlist li:hover,.mk-catlist li.is-cur{background:#f6f6f3}
/* Satırlar artık bağlantı; tıklama alanı tüm satır olsun ve link gibi görünmesin. */
.mk-catlist li > a{flex:1; min-width:0; color:inherit; text-decoration:none; margin:-9px -11px; padding:9px 11px}
.mk-catlist li > em{font-style:normal; font-size:12px; color:var(--ghost)}
/* Hizmeti olmayan pazaryeri: listede kalır ama seçilemez. */
.mk-catlist li.is-bos{color:var(--ghost); cursor:default}
.mk-catlist li.is-bos:hover{background:none}
.mk-catlist li[aria-selected="true"]::after{
  content:""; width:9px; height:5px; margin-right:2px;
  border-left:1.8px solid var(--ink); border-bottom:1.8px solid var(--ink);
  transform:rotate(-45deg) translateY(-2px);
}
.mk-dd.is-open .mk-chev{transform:rotate(180deg)}
.mk-ddloc{position:relative}
.mk-ddwide{
  min-width:520px; display:grid; grid-template-columns:1fr 1fr; gap:0 4px;
}
@media (max-width:760px){ .mk-ddwide{min-width:260px; grid-template-columns:1fr} }
.mk-cat{
  flex:none; display:flex; align-items:center; gap:7px; border:0; background:var(--soft);
  padding:0 14px; font-size:13px; color:var(--ink-soft); white-space:nowrap;
  border-radius:11px 0 0 11px;
}
.mk-cat:hover{color:var(--ink)}
.mk-loc .mk-chev{margin-top:1px}
.mk-chev{transition:transform .18s ease; width:10px; height:7px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round}
.mk-search input{
  flex:1; min-width:0; border:0; font:inherit; font-size:15px; color:var(--ink);
  padding:12px 14px; background:none;
}
.mk-search input:focus{outline:none}
.mk-go{
  flex:none; border:0; width:52px; color:#fff; background:var(--grad);
  border-radius:0 11px 11px 0;
  display:flex; align-items:center; justify-content:center;
}
.mk-go .mk-ico{width:20px; height:20px}

.mk-mini{
  display:flex; align-items:center; gap:8px; padding:6px 8px; border-radius:10px;
  color:var(--ink); text-decoration:none; white-space:nowrap;
  transition:background .15s ease;
}
.mk-mini:hover{background:var(--soft)}
.mk-acc{margin-left:auto}
.mk-cart{
  position:relative; display:flex; align-items:center; gap:8px;
  padding:8px 12px; border-radius:11px; text-decoration:none; color:var(--ink);
  border:1px solid var(--line); transition:border-color .15s ease;
}
.mk-cart:hover{border-color:#d4d4ce}
.mk-cart b{font-family:'Archivo',sans-serif; font-size:13.5px; font-weight:700; letter-spacing:-0.02em}
.mk-badge{
  position:absolute; top:2px; left:24px; min-width:16px; height:16px; padding:0 4px;
  border-radius:999px; background:var(--accent-ink, #c2521a); color:#fff;
  font-size:10px; font-weight:600; display:flex; align-items:center; justify-content:center;
}

.mk-sub{
  max-width:1400px; margin:0 auto; padding:0 24px 10px;
  display:flex; align-items:center; gap:4px; overflow-x:auto;
  scrollbar-width:none;
}
.mk-sub::-webkit-scrollbar{display:none}
.mk-sub a,.mk-all{
  flex:none; display:flex; align-items:center; gap:7px;
  padding:8px 13px; border-radius:10px; font-size:13.5px;
  color:var(--ink-soft); text-decoration:none; border:0; background:none; white-space:nowrap;
}
.mk-sub a:hover,.mk-all:hover{background:var(--soft); color:var(--ink)}
.mk-all{font-weight:500; color:var(--ink)}

@media (max-width:1100px){ .mk-hide{display:none} }
@media (max-width:820px){
  .mk-loc{display:none}
  .mk-in{flex-wrap:wrap}
  .mk-search{order:3; flex-basis:100%}
}

/* ---- SSA pazaryeri sayfası ---- */
.sp-hero{max-width:1180px; margin:0 auto; padding:40px 24px 26px}
.sp-search{
  display:flex; gap:10px; max-width:640px; margin:0 auto; align-items:stretch;
}
.sp-search input{
  flex:1; min-width:0; font:inherit; font-size:15px; color:var(--ink);
  padding:14px 18px; border:1px solid var(--line); border-radius:13px; background:#fff;
}
.sp-search input:focus{outline:none; border-color:#c9c9c2}
.sp-search button{
  flex:none; font:inherit; font-size:15px; font-weight:500; color:#fff;
  padding:14px 24px; border:0; border-radius:13px; background:var(--ink); cursor:pointer;
  transition:background .15s ease;
}
.sp-search button:hover{background:#2e2e34}

/* Üst barla içerik arasında nefes payı. Yukarıdaki `.sp{padding-top:34px}` kuralı bu
   kısayolla eziliyordu; değer buraya alındı. Boşluk hem filtre kartına hem sonuç
   barına uygulanır — böylece ikisi aynı hizada başlar (kart sticky olduğu için
   padding yokken 3px aşağı kayıyordu). */
.sp{max-width:1180px; margin:0 auto; padding:20px 24px 96px}
.sp-wrap > *{min-width:0}
.sp-wrap{display:grid; grid-template-columns:262px 1fr; gap:20px; align-items:start}

.sp-filters{
  border:1px solid var(--line); border-radius:18px; background:#fff; padding:20px;
  /* Üst bar sticky ve 115px; 135 = altına 20px boşluk. Sayfa başındaki boşlukla
     aynı olsun diye — 118'de kaydırınca araya yalnız 3px kalıyordu. */
  position:sticky; top:135px;
  max-height:calc(100vh - 155px); overflow-y:auto;
  scrollbar-width:none;
}
.sp-filters::-webkit-scrollbar{display:none}
.fgroup + .fgroup{margin-top:20px; padding-top:20px; border-top:1px solid var(--line)}
.fgroup > b{
  display:block; margin-bottom:11px;
  font-family:'Archivo',sans-serif; font-size:13px; font-weight:700; letter-spacing:-0.01em;
}
.fcheck span{flex:1; min-width:0; color:var(--ink-soft)}
.fcheck:hover span{color:var(--ink)}
.fcheck em{font-style:normal; font-size:12px; color:var(--ghost)}
.frange{display:flex; align-items:center; gap:8px}
.frange input{
  flex:1; min-width:0; font:inherit; font-size:13.5px; text-align:center;
  padding:9px 8px; border:1px solid var(--line); border-radius:10px; background:#fff;
}
.frange input:focus{outline:none; border-color:#c9c9c2}
.frange span{color:var(--ghost); font-size:13px}
/* Filtre satırları artık bağlantı; sütundaki diğer öğelerle aynı görünmeli. */
.sp-filters a.fcheck{text-decoration:none; color:inherit}
/* Satır etiketlerinde font-size tanımlı değildi, tarayıcı varsayılanı 16px'e
   düşüyordu — kartın geri kalanı (başlıklar 13px, buton ve girişler 13.5px)
   yanında iri duruyor ve uzun kategori adları iki satıra taşıyordu. */
.sp-filters .fcheck span{font-size:13.5px; line-height:1.35}
/* Puan satırları: yıldızlar metinden kısa olduğu için satırlar sıkışıp onay
   kutuları birbirine yapışıyordu. Yıldız büyütüldü ve satıra dikey pay verildi;
   satır yüksekliği diğer filtre satırlarıyla (13.5px × 1.35 ≈ 18px) uyumlu. */
.sp-filters .fstars{padding:3px 0}
.sp-filters .fstars .svc-stars{flex:1; min-width:0; gap:2px}
.sp-filters .fstars .svc-stars svg{width:16px; height:16px}
.fclear{
  display:block; width:100%; margin-top:18px; font:inherit; font-size:13.5px;
  padding:10px; border:1px solid var(--line); border-radius:11px;
  background:#fff; color:var(--ink-soft); cursor:pointer;
  text-align:center; text-decoration:none;
}
.fclear:hover{border-color:#d4d4ce; color:var(--ink)}

.sp-bar{
  display:flex; align-items:center; justify-content:space-between; gap:14px;
  flex-wrap:wrap; margin-bottom:16px;
}
.sp-bar b{font-family:'Archivo',sans-serif; font-size:15px; font-weight:700; letter-spacing:-0.02em}
.sp-bar b span{font-weight:400; color:var(--ink-soft)}
.sp-sort{display:flex; align-items:center; gap:8px; font-size:13.5px; color:var(--ink-soft)}
.sp-grid > *{min-width:0}
.sp-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:16px}
/* Tasarımda sayfa numaraları <span>'di; gerçek sayfalamada gezinilebilir olmaları
   için <a> oldular. Aynı kurala bağlı, yoksa tarayıcı varsayılanına (mavi, altı
   çizili) düşüyorlardı. Geçerli sayfa ve "…" hâlâ <span>. */
.sp-page{display:flex; justify-content:center; gap:6px; margin-top:26px}
.sp-page span, .sp-page a{
  min-width:36px; height:36px; padding:0 10px; border-radius:11px;
  border:1px solid var(--line); background:#fff; color:var(--ink-soft);
  display:flex; align-items:center; justify-content:center; font-size:13.5px; cursor:pointer;
  text-decoration:none;
}
.sp-page span:hover, .sp-page a:hover{border-color:#d4d4ce; color:var(--ink)}
.sp-page span.is-on{
  color:var(--ink); border-color:transparent;
  background:linear-gradient(#fff,#fff) padding-box, var(--grad) border-box;
  border:1.5px solid transparent;
}
@media (max-width:1000px){
  .sp-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:640px){
  .sp-grid{grid-template-columns:1fr}
  .sp{padding:0 14px 70px}
  .sp-filters{padding:16px}
  .mk-in{padding:10px 14px; gap:10px}
  .mk-sub{padding:0 14px 8px}
  .svc-body{padding:14px 15px 16px}
}

/* ---- açılır seçici (ortak) ---- */
.sel{position:relative}
.sel-btn{
  display:flex; align-items:center; gap:10px;
  font:inherit; font-size:13.5px; color:var(--ink); cursor:pointer;
  padding:9px 13px; border:1px solid var(--line); border-radius:11px; background:#fff;
  white-space:nowrap; transition:border-color .15s ease;
}
.sel-btn:hover{border-color:#d4d4ce}
.sel.is-open .sel-btn{border-color:#c9c9c2}
.sel-chev{
  width:10px; height:7px; flex:none; margin-left:auto;
  fill:none; stroke:var(--ink-soft); stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round;
  transition:transform .18s ease;
}
.sel.is-open .sel-chev{transform:rotate(180deg)}
.sel-list{
  position:absolute; top:calc(100% + 6px); right:0; z-index:50;
  min-width:190px; list-style:none; margin:0; padding:6px;
  background:#fff; border:1px solid var(--line); border-radius:13px;
  box-shadow:0 16px 40px rgba(20,20,25,.13);
}
.sel-list[hidden]{display:none}
.sel-list li{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:9px 11px; border-radius:9px; font-size:13.5px; color:var(--ink); cursor:pointer;
}
.sel-list li:hover{background:var(--soft)}
/* Seçenekler bağlantı oldu (onclick yerine); tıklama alanı tüm satır olsun ve
   tarayıcının mavi/altı çizili varsayılanına düşmesin. */
.sel-list li > a{
  flex:1; min-width:0; color:inherit; text-decoration:none;
  margin:-9px -11px; padding:9px 11px;
}
.sel-list li[aria-selected="true"]::after{
  content:""; width:9px; height:5px; margin-right:2px;
  border-left:1.8px solid var(--ink); border-bottom:1.8px solid var(--ink);
  transform:rotate(-45deg) translateY(-2px);
}
.sp-sort-l{font-size:13.5px; color:var(--ink-soft)}

/* ---- onay kutusu (ortak) ---- */
.chk input[type="checkbox"],
.fcheck input[type="checkbox"]{
  appearance:none; -webkit-appearance:none; flex:none;
  width:16px; height:16px; min-width:16px; min-height:16px;
  margin:0; padding:0; font-size:inherit;
  border:1.5px solid #c9c9c2; border-radius:5px; background:#fff;
  position:relative; cursor:pointer;
}
.chk input[type="checkbox"]:checked,
.fcheck input[type="checkbox"]:checked{border-color:var(--ink); background:var(--ink)}
.chk input[type="checkbox"]:checked::after,
.fcheck input[type="checkbox"]:checked::after{
  content:""; position:absolute; left:50%; top:50%;
  width:8px; height:4.2px; margin:-3.4px 0 0 -4px;
  border-left:1.8px solid #fff; border-bottom:1.8px solid #fff;
  transform:rotate(-45deg);
}
.chk,.fcheck{display:flex; align-items:flex-start; gap:10px; cursor:pointer}
.frm label.chk,.frm .chk{flex-direction:row}
.fcheck{align-items:center}

/* ---- mobil pazaryeri ---- */
.sp-mbar{display:none}
.sp-main{display:block; min-width:0}
@media (max-width:1000px){
  .sp-wrap{display:block}
  .sp-filters{
    position:fixed; left:0; right:0; bottom:0; z-index:70;
    max-height:80vh; border-radius:22px 22px 0 0; border:0;
    box-shadow:0 -14px 40px rgba(20,20,25,.18);
    padding:10px 18px calc(20px + env(safe-area-inset-bottom));
    transform:translateY(100%); transition:transform .24s ease;
    overflow-y:auto;
  }
  .sp-filters::before{
    content:""; display:block; width:38px; height:4px; border-radius:999px;
    background:var(--line); margin:0 auto 14px;
  }
  body.sheet-on .sp-filters{transform:none}
  body.sheet-on::after{
    content:""; position:fixed; inset:0; z-index:65;
    background:rgba(20,20,25,.32); backdrop-filter:blur(2px);
  }
  body.sheet-on{overflow:hidden}

  .sp-mbar{
    display:flex; gap:8px; position:sticky; top:0; z-index:20;
    padding:10px 0 12px; background:var(--paper);
  }
  .sp-mbtn{
    flex:1; display:flex; align-items:center; justify-content:center; gap:8px;
    font:inherit; font-size:14px; padding:11px 14px;
    border:1px solid var(--line); border-radius:12px; background:#fff; color:var(--ink);
  }
  .sp-mbtn svg{width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round}
  .sp-mcount{
    min-width:19px; height:19px; padding:0 6px; border-radius:999px;
    background:var(--grad); color:#fff; font-size:11px;
    display:flex; align-items:center; justify-content:center;
  }
  .fclear{margin-bottom:6px}
}
@media (max-width:760px){
  .mk-catwrap{display:none}
  .mk-search{width:100%}
  .mk-mini.mk-acc small{display:none}
  .mk-in{flex-wrap:wrap; row-gap:10px}
  .mk-search{order:5; flex-basis:100%}
  .sp-bar b{font-size:14px}
  .sp-sort{display:none}
}

@media (max-width:1000px){
  /* kategori şeridi aramanın altında, kart yerine mini çip */
  .mk-sub{
    padding:0 24px 10px; gap:6px;
    -webkit-mask-image:linear-gradient(to right,#000 88%,transparent);
    mask-image:linear-gradient(to right,#000 88%,transparent);
    -webkit-mask-repeat:repeat-x; mask-repeat:repeat-x;
    -webkit-mask-size:100% 100%; mask-size:100% 100%;
  }
  .mk-sub a,.mk-all{padding:7px 12px; font-size:13px; border:1px solid var(--line); border-radius:999px; background:#fff}
  .mk-all{order:-1}
  .sp-bar{margin-bottom:12px}
}

/* ---- servis detay · sorular ve yanıtlar ---- */
.qa-top{display:flex; align-items:center; justify-content:space-between; gap:18px; flex-wrap:wrap}
.qa-top p{font-size:14px; line-height:1.6; color:var(--ink-soft); max-width:58ch}
.qa-top p b{color:var(--ink); font-weight:500}
.qa-top .sd-btn{flex:none; padding:11px 18px; font-size:14px}

.qa-l{list-style:none; margin:22px 0 0; padding:0}
.qa-item{padding:20px 0; border-bottom:1px solid var(--line)}
.qa-item:first-child{padding-top:0}
.qa-item:last-child{border-bottom:0}
.qa-q, .qa-a{display:flex; gap:13px}
.qa-a{margin-top:14px; padding-left:32px}
.qa-mark{
  width:24px; height:24px; flex:none; border-radius:8px;
  display:flex; align-items:center; justify-content:center;
  background:var(--soft); color:var(--ink-soft);
  font-family:'Archivo',sans-serif; font-size:12px; font-weight:700;
}
.qa-mark.is-a{background:var(--ink); color:#fff}
.qa-q p{font-size:15px; line-height:1.55; font-weight:500}
.qa-a p{font-size:14px; line-height:1.7; color:var(--ink-soft)}
.qa-q small, .qa-a small{display:block; margin-top:6px; font-size:12.5px; color:var(--ghost)}
.qa-a small b{font-weight:500; color:var(--ink-soft)}
.qa-a small svg{
  width:13px; height:13px; vertical-align:-2px; fill:none; stroke:#2f7d53;
  stroke-width:2; stroke-linecap:round; stroke-linejoin:round;
}

@media (max-width:640px){
  .qa-a{padding-left:0}
  .qa-top .sd-btn{width:100%}
  .qa-form-f span{width:100%}
  .qa-form-f .sd-btn{flex:1}
}

/* ---- modal (pazarlama tarafı) ---- */
.ovl{
  position:fixed; inset:0; z-index:90;
  display:flex; align-items:center; justify-content:center; padding:24px;
  background:rgba(20,20,25,.38);
}
.ovl[hidden]{display:none}
.mdl{
  display:flex; flex-direction:column; width:100%; max-width:540px;
  max-height:calc(100vh - 48px); background:#fff; border-radius:20px;
  box-shadow:0 24px 70px rgba(20,20,25,.28);
}
.mdl-h{
  display:flex; align-items:flex-start; gap:16px;
  padding:20px 22px 17px; border-bottom:1px solid var(--line);
}
.mdl-ht{flex:1; min-width:0}
.mdl-ht b{
  display:block; font-family:'Archivo',sans-serif; font-size:17px;
  font-weight:700; letter-spacing:-0.02em;
}
.mdl-ht small{display:block; margin-top:4px; font-size:12.5px; line-height:1.5; color:var(--ink-soft)}
.mdl-x{
  flex:none; display:flex; padding:7px; border:0; border-radius:9px;
  background:transparent; cursor:pointer; transition:background .15s ease;
}
.mdl-x:hover{background:var(--soft)}
.mdl-x svg{
  width:18px; height:18px; fill:none; stroke:var(--ink-soft);
  stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round;
}
.mdl-b{flex:1; padding:18px 22px; overflow-y:auto}
.mdl-f{
  display:flex; align-items:center; justify-content:flex-end; gap:10px;
  padding:15px 22px; border-top:1px solid var(--line);
}
.mdl-f .sd-btn{padding:12px 20px; font-size:14px}
body.is-locked{overflow:hidden}

/* ---- soru modali içeriği ---- */
.sor-prov{display:flex; align-items:center; gap:12px; padding:13px 15px; border-radius:14px; background:var(--soft)}
.sor-logo{width:38px; height:38px; flex:none; border-radius:11px; background:var(--grad)}
.sor-id{flex:1; min-width:0}
.sor-id b{display:block; font-size:14px; font-weight:500}
.sor-id b svg{
  width:14px; height:14px; vertical-align:-2px; fill:none; stroke:#2f7d53;
  stroke-width:2; stroke-linecap:round; stroke-linejoin:round;
}
.sor-id small{display:block; margin-top:2px; font-size:12.5px; color:var(--ink-soft)}
.sor-sla{
  flex:none; display:inline-flex; align-items:center; gap:6px;
  font-size:12px; padding:5px 10px; border-radius:999px; background:#fff; color:var(--ink-soft);
}
.sor-sla svg{
  width:13px; height:13px; fill:none; stroke:currentColor;
  stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round;
}

.sor-hints{margin-top:15px}
.sor-hints > small{display:block; font-size:12.5px; color:var(--ink-soft)}
.sor-hints > div{display:flex; gap:6px; flex-wrap:wrap; margin-top:9px}
.sor-h{
  font:inherit; font-size:12.5px; padding:7px 12px; cursor:pointer;
  border:1px solid var(--line); border-radius:999px; background:#fff; color:var(--ink-soft);
  transition:border-color .15s ease, color .15s ease;
}
.sor-h:hover{border-color:#d4d4ce; color:var(--ink)}

.sor-f{display:block; margin-top:15px}
.sor-f > span{display:flex; align-items:baseline; justify-content:space-between; gap:12px; font-size:12.5px; color:var(--ink-soft)}
.sor-f > span em{font-style:normal; font-size:12px; color:var(--ghost); font-variant-numeric:tabular-nums}
.sor-f textarea, .sor-f input{
  width:100%; margin-top:7px; font:inherit; font-size:14px; line-height:1.6; color:var(--ink);
  padding:12px 13px; border:1px solid var(--line); border-radius:12px; background:#fff;
}
.sor-f textarea{resize:vertical}
.sor-f textarea:focus, .sor-f input:focus{outline:none; border-color:#c9c9c2}
.sor-f > small{display:block; margin-top:6px; font-size:12px; color:var(--ghost)}
.sor-as{display:flex; align-items:center; gap:11px; margin-top:14px; font-size:13px; color:var(--ink-soft)}
.sor-as-av{
  width:32px; height:32px; flex:none; border-radius:10px;
  display:flex; align-items:center; justify-content:center;
  background:var(--soft); color:var(--ink-soft);
  font-family:'Archivo',sans-serif; font-size:11.5px; font-weight:700;
}
.sor-as b{font-weight:500; color:var(--ink)}
.sor-as small{display:block; margin-top:3px; font-size:12px; line-height:1.5; color:var(--ghost)}
.sor-as small b{font-weight:500; color:var(--ink-soft)}
.sor-note{
  display:flex; align-items:flex-start; gap:8px; margin-top:14px;
  font-size:12px; line-height:1.6; color:var(--ink-soft);
}
.sor-note svg{
  width:15px; height:15px; flex:none; margin-top:2px; fill:none; stroke:var(--ghost);
  stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round;
}

@media (max-width:600px){
  .ovl{padding:0; align-items:flex-end}
  .mdl{max-width:none; max-height:94vh; border-radius:20px 20px 0 0}
  .mdl-f .sd-btn{flex:1; text-align:center}
}


/* ---- sayfa kapsayıcı ve başlık (ortak) ---- */
.wrap{max-width:1180px; margin:0 auto; padding:0 24px}

.crumb{display:flex; align-items:center; gap:8px; font-size:13px; color:var(--ghost)}
.crumb a{color:var(--ink-soft); text-decoration:none}
.crumb a:hover{color:var(--ink)}
.crumb b{font-weight:400; color:var(--ink)}
.crumb span{color:var(--ghost)}

.phead{margin:18px 0 0}
.phead h1{
  font-size:clamp(28px,4vw,42px); letter-spacing:-0.032em; line-height:1.12;
}
.phead h1 em{
  font-style:normal; background:var(--grad);
  -webkit-background-clip:text; background-clip:text; color:transparent;
}
.phead > p{margin-top:14px; font-size:16px; line-height:1.7; color:var(--ink-soft); max-width:62ch}

/* ---- legal metinler ---- */
.lg{padding:0}
.lg .wrap{padding-top:36px; padding-bottom:64px}
.lg h1{font-size:clamp(28px,4vw,40px); letter-spacing:-0.03em; margin-top:14px}
.lg-lead{margin-top:10px; font-size:15px; line-height:1.7; color:var(--ink-soft); max-width:64ch}
.lg-wrap.is-notoc{grid-template-columns:248px minmax(0,1fr)}
.lg-wrap{display:grid; grid-template-columns:248px minmax(0,1fr) 210px; gap:36px; margin-top:32px; align-items:start}
.lg-side{position:sticky; top:88px; display:flex; flex-direction:column; gap:3px}
.lg-sidet{
  padding:0 12px 9px; font-size:11.5px; font-weight:500;
  letter-spacing:.07em; text-transform:uppercase; color:var(--ghost);
}
.lg-link{
  padding:10px 12px; border-radius:11px; font-size:13.5px; line-height:1.4;
  color:var(--ink-soft); text-decoration:none; transition:background .13s ease, color .13s ease;
}
.lg-link:hover{background:var(--soft); color:var(--ink)}
.lg-link.is-on{background:var(--soft); color:var(--ink); font-weight:500}

.lg-doc{min-width:0; font-size:15px; line-height:1.85; color:var(--ink-soft)}
.lg-date{display:block; font-size:12.5px; color:var(--ghost); margin-bottom:22px}
.lg-doc h2{
  margin:34px 0 12px; font-family:'Archivo',sans-serif; font-size:20px;
  font-weight:700; letter-spacing:-0.02em; color:var(--ink); scroll-margin-top:96px;
}
.lg-doc h2:first-of-type{margin-top:0}
.lg-doc h3{margin:24px 0 10px; font-size:16px; font-weight:600; color:var(--ink)}
.lg-doc p + p{margin-top:14px}
.lg-doc ul, .lg-doc ol{margin:14px 0 14px 20px}
.lg-doc li + li{margin-top:8px}
.lg-doc strong{color:var(--ink); font-weight:500}
.lg-doc table{width:100%; margin:18px 0; border-collapse:collapse; font-size:14px}
.lg-doc th, .lg-doc td{padding:11px 14px; border:1px solid var(--line); text-align:left; vertical-align:top}
.lg-doc th{background:var(--soft); font-weight:500; color:var(--ink)}

.lg-doc ol.lg-alpha{list-style:lower-alpha}
.lg-doc table th[scope="row"], .lg-doc tbody th{width:34%; white-space:nowrap}
.lg-doc .lg-ozet{
  margin:0 0 26px; padding:18px 22px; border:1px solid var(--line); border-radius:16px;
  background:#fcfcfa;
}
.lg-doc .lg-ozet b{
  display:block; margin-bottom:10px; font-family:'Archivo',sans-serif; font-size:13px;
  font-weight:700; letter-spacing:.05em; text-transform:uppercase; color:var(--ghost);
}
.lg-doc .lg-ozet ul{margin:0 0 0 18px}
.lg-doc .lg-ozet li{font-size:14px; line-height:1.7}
.lg-doc .lg-formula{
  margin:16px 0; padding:15px 18px; border-radius:13px; background:var(--soft);
  font-size:14px; line-height:1.7; color:var(--ink);
}
.lg-doc .lg-ornek{
  margin:16px 0; padding:15px 18px; border-left:2.5px solid var(--accent);
  border-radius:0 13px 13px 0; background:#fdf2e9; font-size:14px;
}
.lg-doc .lg-note{margin-top:10px; font-size:13px; color:var(--ghost)}
.lg-todo{padding:22px 24px; border:1px dashed var(--line); border-radius:16px}
.lg-todo b{display:block; font-size:15px; font-weight:500; color:var(--ink)}
.lg-todo p{margin-top:8px; font-size:14px; line-height:1.7}

.lg-toc{position:sticky; top:88px; display:flex; flex-direction:column; gap:9px}
.lg-toct{font-size:11.5px; font-weight:500; letter-spacing:.07em; text-transform:uppercase; color:var(--ghost)}
.lg-toc a{font-size:12.5px; line-height:1.5; color:var(--ink-soft); text-decoration:none}
.lg-toc a:hover{color:var(--ink)}
.lg-tocw{font-size:12px; line-height:1.5; color:var(--ghost)}

.crumb b{font-weight:400; color:var(--ink)}
.crumb span{color:var(--ghost)}
.lg .crumb{align-items:center; justify-content:flex-start; max-width:none; padding:0; margin-bottom:0; font-size:12.5px}

@media (max-width:1100px){
  .lg-wrap{grid-template-columns:220px minmax(0,1fr)}
  .lg-toc{display:none}
}
@media (max-width:760px){
  .lg-wrap{grid-template-columns:1fr; gap:24px}
  .lg-side{position:static; flex-direction:row; flex-wrap:wrap; gap:6px}
  .lg-sidet{width:100%; padding:0 0 4px}
  .lg-link{padding:8px 12px; border:1px solid var(--line); border-radius:999px; font-size:12.5px}
}

/* ---- amazon entegrasyonu ---- */
.ai .wrap{padding-top:36px; padding-bottom:80px}

.ai-hero{
  display:grid; grid-template-columns:1fr 300px; gap:44px; align-items:end;
  margin:22px 0 48px; padding-bottom:38px; border-bottom:1px solid var(--line);
}

.ai-facts{display:grid; grid-template-columns:1fr 1fr; gap:20px 24px}
.ai-facts dt{font-size:12px; color:var(--ghost); line-height:1.4}
.ai-facts dd{
  margin-top:5px; font-family:'Archivo',sans-serif; font-size:19px;
  font-weight:700; letter-spacing:-0.02em; line-height:1.2;
}

.ai-wrap{display:grid; grid-template-columns:214px minmax(0,1fr); gap:48px; align-items:start}
.ai-side{position:sticky; top:88px; display:flex; flex-direction:column; gap:2px}
.ai-sidet{padding:0 12px 10px; font-size:11.5px; font-weight:500; letter-spacing:.07em; text-transform:uppercase; color:var(--ghost)}
.ai-side a{
  padding:9px 12px; border-radius:10px; font-size:13.5px; line-height:1.4;
  color:var(--ink-soft); text-decoration:none; transition:background .13s ease, color .13s ease;
}
.ai-side a:hover{background:var(--soft); color:var(--ink)}

.ai-sec{margin-bottom:64px; scroll-margin-top:96px}
.ai-sec h2{font-size:clamp(22px,2.8vw,28px); letter-spacing:-0.03em}
.ai-lead{margin-top:12px; font-size:15px; line-height:1.75; color:var(--ink-soft); max-width:78ch}

.ai-cap{
  display:grid; grid-template-columns:58px minmax(0,1fr); gap:16px;
  padding:26px 0; border-top:1px solid var(--line); scroll-margin-top:96px;
}
.ai-sec > h2 + .ai-cap{margin-top:24px}
.ai-num{
  font-family:'Archivo',sans-serif; font-size:13px; font-weight:700;
  letter-spacing:.04em; color:var(--ghost); padding-top:10px;
}
.ai-caph{display:flex; align-items:center; gap:13px}
.ai-ico{
  width:38px; height:38px; flex:none; border-radius:12px;
  display:flex; align-items:center; justify-content:center;
  background:linear-gradient(#fff,#fff) padding-box, var(--grad) border-box;
  border:1.5px solid transparent;
}
.ai-ico svg{width:19px; height:19px; fill:none; stroke:var(--accent); stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round}
.ai-cap h3, .ai-fn h3{font-size:18px; font-weight:600; letter-spacing:-0.02em}
.ai-capb > p{margin-top:13px; font-size:15px; line-height:1.75; color:var(--ink-soft); max-width:74ch}
.ai-note{
  margin-top:14px; padding:12px 15px; border-radius:12px; background:var(--soft);
  font-size:13px; line-height:1.65; color:var(--ink-soft); max-width:74ch;
}

.ai-tblwrap{margin-top:24px; overflow-x:auto; scrollbar-width:thin}
.ai-tbl{width:100%; min-width:620px; border-collapse:collapse}
.ai-tbl thead th{
  padding:0 24px 12px 0; text-align:left; white-space:nowrap;
  font-size:11.5px; font-weight:500; letter-spacing:.08em; text-transform:uppercase;
  color:var(--ghost); border-bottom:1px solid var(--line);
}
.ai-tbl tbody th{
  width:200px; padding:16px 24px 16px 0; text-align:left; vertical-align:top;
  border-bottom:1px solid var(--line); font-weight:400;
}
.ai-tbl tbody th code{
  font-family:'Archivo',sans-serif; font-size:13.5px; font-weight:600;
  letter-spacing:-0.01em; color:var(--ink); white-space:nowrap;
}
.ai-tbl td{
  padding:16px 0; font-size:14.5px; line-height:1.7; color:var(--ink-soft);
  border-bottom:1px solid var(--line); vertical-align:top;
}
.ai-tbl tbody tr:last-child th, .ai-tbl tbody tr:last-child td{border-bottom:0}

.ai-fns{display:grid; grid-template-columns:repeat(auto-fit,minmax(340px,1fr)); gap:20px; margin-top:24px}
.ai-fn{display:flex; flex-direction:column; padding:26px 28px; border:1px solid var(--line); border-radius:20px; background:#fff}
.ai-fnh{display:flex; align-items:center; gap:13px; margin-bottom:15px}
.ai-tag{
  display:inline-block; margin-top:6px; padding:3px 9px; border-radius:999px;
  background:var(--soft); color:var(--ink-soft); font-size:11.5px;
}
.ai-fn > p{font-size:14.5px; line-height:1.7; color:var(--ink-soft)}
.ai-fn .ai-note{margin-top:auto}

.ai-chips{display:flex; flex-wrap:wrap; gap:8px; margin-top:16px}
.ai-chip{
  padding:8px 14px; border-radius:999px; border:1px dashed var(--line);
  font-size:13px; color:var(--ghost);
}

.ai-data{
  position:relative; padding:38px 40px; border-radius:24px; overflow:hidden;
  background:var(--ink); color:#fff; scroll-margin-top:96px;
}
.ai-data::before{
  content:""; position:absolute; left:0; right:0; top:0; height:3px; background:var(--grad);
}
.ai-dico{display:inline-flex; margin-bottom:16px}
.ai-dico svg{width:26px; height:26px; fill:none; stroke:#F4611A; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round}
.ai-data h2{font-size:24px; letter-spacing:-0.025em; color:#fff}
.ai-data p{margin-top:16px; font-size:15px; line-height:1.8; color:rgba(255,255,255,.78); max-width:80ch}
.ai-link{
  display:inline-block; margin-top:22px; font-size:14.5px; font-weight:500; color:#fff;
  text-decoration:underline; text-underline-offset:4px; text-decoration-color:rgba(255,255,255,.4);
}
.ai-link:hover{text-decoration-color:#fff}

@media (max-width:1080px){
  .ai-hero{grid-template-columns:1fr; gap:32px; align-items:start}
  .ai-facts{grid-template-columns:repeat(4,1fr)}
  .ai-wrap{grid-template-columns:1fr; gap:0}
  .ai-side{display:none}
}
@media (max-width:760px){
  .ai-facts{grid-template-columns:1fr 1fr}
  .ai-cap{grid-template-columns:1fr; gap:0; padding:22px 0}
  .ai-num{display:none}
  .ai-fn{padding:22px}
  .ai-data{padding:28px 24px; border-radius:20px}
}

/* ---- ücretsiz araçlar ---- */
.tl .wrap{padding-top:36px; padding-bottom:80px}
.tl-wrap{display:grid; grid-template-columns:296px minmax(0,1fr); gap:28px; align-items:start; margin-top:40px}

.tl-side{display:flex; flex-direction:column; gap:8px; position:sticky; top:88px}
.tl-nav{
  display:flex; align-items:flex-start; gap:13px; width:100%; text-align:left;
  padding:15px 16px; border:1px solid var(--line); border-radius:16px; background:#fff;
  cursor:pointer; transition:border-color .15s ease, background .15s ease;
}
.tl-nav:hover:not(:disabled){border-color:#d4d4ce}
.tl-nav.is-on{
  border-color:transparent; border:1.5px solid transparent; padding:14.5px 15.5px;
  background:linear-gradient(#fff,#fff) padding-box, var(--grad) border-box;
}
.tl-nav:disabled{cursor:not-allowed; background:#fcfcfa}
.tl-nav:disabled .tl-navt b, .tl-nav:disabled .tl-navt small{color:var(--ghost)}
.tl-nav:disabled .tl-ico svg{stroke:var(--ghost)}
.tl-ico{
  width:38px; height:38px; flex:none; border-radius:12px; margin-top:1px;
  display:flex; align-items:center; justify-content:center; background:var(--soft);
}
.tl-ico svg{width:19px; height:19px; fill:none; stroke:var(--ink-soft); stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round}
.tl-nav.is-on .tl-ico{background:#fdece2}
.tl-nav.is-on .tl-ico svg{stroke:var(--accent)}
.tl-navt{min-width:0}
.tl-navt b{display:block; font-size:14.5px; font-weight:500}
.tl-navt small{display:block; margin-top:4px; font-size:12.5px; line-height:1.55; color:var(--ink-soft)}
.tl-soon{
  margin-left:8px; padding:2px 8px; border-radius:999px;
  background:var(--soft); color:var(--ghost); font-size:11px; font-weight:400;
}

.tl-panel{border:1px solid var(--line); border-radius:22px; background:#fff; overflow:hidden}
.tl-panel[hidden]{display:none}
.tl-ph{padding:26px 30px 22px; border-bottom:1px solid var(--line)}
.tl-ph h2{font-size:22px; letter-spacing:-0.025em}
.tl-ph p{margin-top:9px; font-size:14.5px; line-height:1.7; color:var(--ink-soft); max-width:70ch}
.tl-body{display:grid; grid-template-columns:1fr 320px}
.tl-form{padding:26px 30px; display:flex; flex-direction:column; gap:18px}
.tl-f > span:first-child{display:block; font-size:13px; color:var(--ink-soft)}
.tl-f .sel{margin-top:7px}
.tl-f .sel-btn{padding:12px 14px; border-radius:12px; font-size:15px}
.tl-in{display:flex; align-items:center; margin-top:7px; border:1px solid var(--line); border-radius:12px; background:#fff; overflow:hidden}
.tl-in:focus-within{border-color:#c9c9c2}
.tl-in input{
  flex:1; min-width:0; border:0; outline:none; background:transparent;
  font:inherit; font-size:15px; color:var(--ink); padding:12px 14px;
  font-variant-numeric:tabular-nums;
}
.tl-in input::-webkit-outer-spin-button, .tl-in input::-webkit-inner-spin-button{-webkit-appearance:none; margin:0}
.tl-in input[type=number]{-moz-appearance:textfield}
.tl-unit{flex:none; padding:0 14px; font-size:13.5px; color:var(--ghost); border-left:1px solid var(--line); align-self:stretch; display:flex; align-items:center}
.tl-hint{display:block; margin-top:6px; font-size:12px; line-height:1.5; color:var(--ghost)}

.tl-out{padding:26px 28px; background:var(--soft); border-left:1px solid var(--line)}
.tl-outt{display:block; font-size:11.5px; font-weight:500; letter-spacing:.07em; text-transform:uppercase; color:var(--ghost)}
.tl-r{display:flex; align-items:baseline; justify-content:space-between; gap:14px; padding:11px 0; border-bottom:1px solid #e6e4dd}
.tl-r:first-of-type{margin-top:10px}
.tl-r span{font-size:13px; color:var(--ink-soft)}
.tl-r b{font-size:14.5px; font-weight:500; font-variant-numeric:tabular-nums; white-space:nowrap}
.tl-r.is-big{padding:15px 0; border-bottom:0}
.tl-r.is-big span{font-size:13.5px; color:var(--ink)}
.tl-r.is-big b{font-family:'Archivo',sans-serif; font-size:24px; font-weight:700; letter-spacing:-0.03em}
.tl-r.is-neg b{color:#b3261e}
.tl-r.is-pos b{color:#2f7d53}
.tl-note{
  display:flex; align-items:flex-start; gap:8px; margin-top:18px; padding-top:16px;
  border-top:1px solid #e6e4dd; font-size:12px; line-height:1.6; color:var(--ghost);
}
.tl-note svg{width:15px; height:15px; flex:none; margin-top:1px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round}

.tl-soonp{border-style:dashed}
.tl-soonp .pn-empty{border:0; padding:56px 24px}
.tl-soonp .pn-empty svg{width:26px; height:26px; margin-bottom:6px; fill:none; stroke:var(--ghost); stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round}
.tl-soonp .pn-empty b{display:block; font-size:16px; font-weight:500}
.tl-soonp .pn-empty small{display:block; margin-top:8px; font-size:13.5px; line-height:1.65; color:var(--ink-soft); max-width:48ch; margin-left:auto; margin-right:auto}
.pn-empty{display:flex; flex-direction:column; align-items:center; text-align:center; gap:4px}

@media (max-width:1080px){
  .tl-wrap{grid-template-columns:1fr; gap:20px}
  .tl-side{position:static; flex-direction:row; overflow-x:auto; padding-bottom:4px; scrollbar-width:none}
  .tl-side::-webkit-scrollbar{display:none}
  .tl-nav{width:auto; min-width:250px; flex:none}
  .tl-body{grid-template-columns:1fr}
  .tl-out{border-left:0; border-top:1px solid var(--line)}
}
@media (max-width:600px){
  .tl-ph{padding:22px}
  .tl-form, .tl-out{padding:22px}
}

/* ---- ai gelir hesaplayıcı ---- */
.rv{display:flex; flex-direction:column; gap:var(--gap, 16px)}
.rv-card{border:1px solid var(--line); border-radius:20px; background:#fff; overflow:hidden}

.rv-token{flex:none; min-width:210px; text-align:right}
.rv-token span{font-size:12.5px; color:var(--ink-soft)}
.rv-token b{font-weight:500; color:var(--ink)}
.rv-token i{display:block; height:4px; margin-top:8px; border-radius:999px; background:#eceae4; overflow:hidden}
.rv-token i b{display:block; height:100%; border-radius:999px; background:var(--grad)}

.rv-form{display:flex; align-items:flex-end; gap:12px; padding:24px 28px 0; flex-wrap:wrap}
.rv-f{flex:none; min-width:200px}
.rv-f.is-grow{flex:1; min-width:260px}
.rv-f > span:first-child{display:block; font-size:13px; color:var(--ink-soft); margin-bottom:7px}
.rv-in{display:flex; border:1px solid var(--line); border-radius:12px; background:#fff; overflow:hidden}
.rv-in:focus-within{border-color:#c9c9c2}
.rv-in input{
  flex:1; min-width:0; border:0; outline:none; background:transparent; font:inherit;
  font-size:14.5px; color:var(--ink); padding:12px 14px;
}
.rv-f .sel-btn{padding:12px 14px; border-radius:12px; font-size:14.5px}
.rv-go{
  flex:none; display:inline-flex; align-items:center; gap:8px; font:inherit; font-size:14.5px;
  font-weight:500; padding:12px 20px; border:0; border-radius:12px; cursor:pointer;
  background:var(--grad); color:#fff;
}
.rv-go svg{width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round}

.rv-sup{display:flex; align-items:center; gap:18px; flex-wrap:wrap; padding:18px 28px}
.rv-sw{display:inline-flex; align-items:center; gap:10px; cursor:pointer}
.rv-sw input{position:absolute; opacity:0; width:0; height:0}
.rv-swt{
  width:40px; height:22px; border-radius:999px; background:#d9d9d3; position:relative;
  transition:background .15s ease;
}
.rv-swt::after{
  content:""; position:absolute; top:3px; left:3px; width:16px; height:16px; border-radius:50%;
  background:#fff; transition:transform .15s ease;
}
.rv-sw input:checked + .rv-swt{background:var(--ink)}
.rv-sw input:checked + .rv-swt::after{transform:translateX(18px)}
.rv-sw b{font-size:14px; font-weight:500}
.rv-dl{margin-left:auto}

.rv-sup.is-locked{
  align-items:flex-start; gap:14px; margin:18px 28px; padding:16px 18px;
  border:1px dashed var(--line); border-radius:14px; background:#fcfcfa;
}
.rv-suplock svg{width:19px; height:19px; margin-top:2px; fill:none; stroke:var(--ghost); stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round}
.rv-supt{flex:1; min-width:200px}
.rv-supt b{display:block; font-size:14px; font-weight:500}
.rv-supt small{display:block; margin-top:5px; font-size:12.5px; line-height:1.6; color:var(--ink-soft)}
.rv-supbtn{
  flex:none; padding:9px 16px; border-radius:11px; background:var(--ink); color:#fff;
  font-size:13.5px; text-decoration:none;
}

.rv-prod{display:flex; align-items:flex-start; gap:18px; padding:20px 28px 26px; border-top:1px solid var(--line)}
.rv-img{
  width:64px; height:64px; flex:none; border-radius:13px; background:var(--soft);
  display:flex; align-items:center; justify-content:center;
}
.rv-img svg{width:24px; height:24px; fill:none; stroke:var(--ghost); stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round}
.rv-pb{min-width:0}
.rv-pb > b{display:block; font-size:17px; font-weight:600; letter-spacing:-0.015em}
.rv-pb > p{margin-top:6px; font-size:14px; line-height:1.6; color:var(--ink-soft)}
.rv-meta{display:flex; gap:20px; flex-wrap:wrap; margin-top:11px; font-size:12.5px; color:var(--ghost)}
.rv-meta > span{display:inline-flex; align-items:center; gap:7px}
.rv-meta svg{width:15px; height:15px; fill:none; stroke:currentColor; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round}

.rv-ch{display:flex; align-items:center; justify-content:space-between; gap:16px; padding:24px 28px 20px; border-bottom:1px solid var(--line)}
.rv-ch h3{font-family:'Archivo',sans-serif; font-size:22px; font-weight:700; letter-spacing:-0.025em}
.rv-cm{font-size:12.5px; color:var(--ghost)}
.rv-body{padding:8px 28px 26px}

.rv-row{display:flex; align-items:center; gap:12px; padding:11px 0; flex-wrap:wrap}
.rv-lbl{flex:1; min-width:190px; font-size:14px; color:var(--ink-soft)}
.rv-hint{font-style:normal; color:var(--ghost); font-size:12.5px}
.rv-find{
  display:inline-flex; align-items:center; gap:6px; margin-left:10px; font:inherit;
  font-size:12.5px; font-weight:500; padding:4px 11px; border-radius:999px; cursor:pointer;
  border:1px solid #f5c9a8; background:#fdece2; color:var(--accent-ink);
  transition:background .15s ease, border-color .15s ease;
}
.rv-find:hover{background:#fbdfcc; border-color:#f0b98d}
.rv-find[hidden]{display:none}
.rv-find::before{
  content:""; width:6px; height:6px; border-radius:50%; background:var(--accent);
}
.rv-row.is-head{
  margin-top:14px; padding:16px 0 14px; border-top:1px solid var(--line);
}
.rv-row.is-head .rv-lbl{font-family:'Archivo',sans-serif; font-size:17px; font-weight:700; letter-spacing:-0.02em; color:var(--ink)}
.rv-row.is-price{padding:18px 0 20px; border-bottom:1px solid var(--line)}
.rv-row.is-price + .rv-row.is-head{margin-top:0; border-top:0}
.rv-row.is-price .rv-lbl{font-family:'Archivo',sans-serif; font-size:19px; font-weight:700; letter-spacing:-0.025em; color:var(--ink)}

.rv-kpis{display:flex; gap:8px; flex:none}
.rv-kpi{
  min-width:82px; padding:8px 12px; border-radius:11px; background:var(--soft); text-align:center;
}
.rv-kpi small{display:block; font-size:11px; color:var(--ghost)}
.rv-kpi b{display:block; margin-top:3px; font-size:15px; font-weight:600; font-variant-numeric:tabular-nums}
.rv-kpi.is-neg b{color:#b3261e}
.rv-kpi.is-pos b{color:#2f7d53}

.rv-amt, .rv-pct, .rv-desi{
  flex:none; display:inline-flex; align-items:center; border:1px solid var(--line);
  border-radius:11px; background:#fff; overflow:hidden;
}
.rv-amt{width:150px}
.rv-pct{width:112px}
.rv-desi{width:120px}
.rv-amt i, .rv-pct i, .rv-desi i{
  flex:none; padding:0 11px; font-style:normal; font-size:13px; color:var(--ghost);
}
.rv-amt input, .rv-pct input, .rv-desi input{
  flex:1; min-width:0; border:0; outline:none; background:transparent; font:inherit;
  font-size:14.5px; color:var(--ink); padding:10px 12px 10px 0; text-align:right;
  font-variant-numeric:tabular-nums;
}
.rv-amt.is-ro{background:var(--soft); border-color:transparent}
.rv-amt.is-ro input{color:var(--ink-soft); cursor:default}
.rv-amt input::-webkit-outer-spin-button, .rv-amt input::-webkit-inner-spin-button,
.rv-pct input::-webkit-outer-spin-button, .rv-pct input::-webkit-inner-spin-button,
.rv-desi input::-webkit-outer-spin-button, .rv-desi input::-webkit-inner-spin-button{-webkit-appearance:none; margin:0}
.rv-amt input[type=number], .rv-pct input[type=number], .rv-desi input[type=number]{-moz-appearance:textfield}

.rv-note{flex-basis:100%; margin:-4px 0 8px; font-size:12px; line-height:1.6; color:var(--ghost)}
.rv-modes{display:inline-flex; gap:14px; margin-left:14px}
.rv-radio{display:inline-flex; align-items:center; gap:6px; cursor:pointer; font-size:13px; color:var(--ink-soft)}
.rv-radio input{accent-color:var(--ink); width:15px; height:15px}

.rv-hs{padding:6px 0 14px}
.rv-hsl{display:inline-flex; align-items:center; gap:8px; font-size:14px; color:var(--ink-soft)}
.rv-hsl em{font-style:normal; color:var(--ghost); font-size:12.5px}
.rv-hsl b{font-weight:500; color:var(--ink); font-variant-numeric:tabular-nums}
.rv-hs small{display:block; margin-top:7px; font-size:12px; line-height:1.6; color:var(--ghost); max-width:88ch}
.rv-ico{
  display:inline-flex; align-items:center; justify-content:center; width:26px; height:26px;
  border:0; border-radius:8px; background:transparent; cursor:pointer;
}
.rv-ico:hover{background:var(--soft)}
.rv-ico svg{width:15px; height:15px; fill:none; stroke:var(--ink-soft); stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round}
.rv-ico.is-ai svg{stroke:var(--accent)}

.rv-disc{
  display:flex; align-items:flex-start; gap:11px; margin-top:22px; padding:16px 18px;
  border-radius:14px; background:#fdf2e9; font-size:12.5px; line-height:1.7; color:var(--accent-ink);
}
.rv-disc svg{width:18px; height:18px; flex:none; margin-top:1px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round}
.rv-disc b{font-weight:600}

.rv-prod.is-empty .rv-pb > b{color:var(--ghost); font-size:14.5px; font-weight:500}
.rv-prod.is-empty .rv-pb > p{color:var(--ghost)}
.rv-prod.is-empty .rv-pb > p em{font-style:normal; color:var(--ink-soft)}
.rv-prod.is-empty .rv-img{border:1px dashed var(--line); background:transparent}
.rv-meta b{font-weight:500; color:var(--ink-soft)}

.rv-supgo{
  margin-left:auto; display:inline-flex; align-items:center; gap:8px; font:inherit;
  font-size:13.5px; font-weight:500; padding:9px 15px; border:1px solid var(--line);
  border-radius:11px; background:#fff; color:var(--ink); cursor:pointer;
}
.rv-supgo:hover:not(:disabled){border-color:#d4d4ce}
.rv-supgo:disabled{color:var(--ghost); cursor:not-allowed; background:#fcfcfa}
.rv-supgo svg{width:15px; height:15px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round}
.rv-supgo em{font-style:normal; color:var(--ghost); font-variant-numeric:tabular-nums}
.rv-supgo:disabled svg{stroke:var(--ghost)}
.rv-dl{margin-left:0}

.rv-card.is-idle .rv-body, .rv-plain.is-idle .rv-body{opacity:.45; pointer-events:none}
.rv-card.is-idle .rv-ch::after, .rv-plain.is-idle .rv-ch::after{
  content:"Analiz bekleniyor"; margin-left:auto; font-size:12px; color:var(--ghost);
}
.rv-card.is-idle .rv-cm, .rv-plain.is-idle .rv-cm{display:none}

/* tedarikçi çekmecesi */
.rv-drawer{max-width:560px}
.td-bar{display:flex; gap:10px; align-items:stretch}
.td-search{
  flex:1; min-width:0; display:flex; align-items:center; height:42px;
  border:1px solid var(--line); border-radius:12px; background:#fff;
}
.td-search:focus-within{border-color:#c9c9c2}
.td-search svg{width:17px; height:17px; margin-left:13px; flex:none; fill:none; stroke:var(--ghost); stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round}
.td-search input{flex:1; min-width:0; border:0; outline:none; background:transparent; font:inherit; font-size:14px; padding:0 13px; color:var(--ink)}
.td-go{
  flex:none; height:42px; padding:0 20px; font:inherit; font-size:14px; font-weight:500;
  border:0; border-radius:12px; background:var(--ink); color:#fff; cursor:pointer;
}
.td-go:hover{background:#2e2e34}
.td-sub{display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:16px}
.td-count{font-size:12.5px; color:var(--ghost)}
.td-sub .sel{flex:none; min-width:170px}
.sel.is-sm .sel-btn{padding:8px 12px; font-size:13.5px; border-radius:10px}

.td-pg{display:flex; align-items:center; justify-content:center; gap:6px; flex-wrap:wrap; margin-top:22px}
.td-pgb{
  min-width:34px; height:34px; padding:0 9px; font:inherit; font-size:13.5px;
  display:inline-flex; align-items:center; justify-content:center;
  border:1px solid var(--line); border-radius:10px; background:#fff; color:var(--ink-soft); cursor:pointer;
}
.td-pgb:hover:not(:disabled):not(.is-on){border-color:#d4d4ce; color:var(--ink)}
.td-pgb.is-on{background:var(--ink); border-color:var(--ink); color:#fff}
.td-pgb:disabled{color:var(--ghost); cursor:not-allowed}
.td-pgb svg{width:15px; height:15px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round}
.td-list{margin-top:4px}
.td-item{display:flex; align-items:flex-start; gap:14px; padding:16px 0; border-bottom:1px solid var(--line)}
.td-item:last-child{border-bottom:0}
.td-img{width:52px; height:52px; flex:none; border-radius:11px; background:var(--soft); display:flex; align-items:center; justify-content:center}
.td-img svg{width:20px; height:20px; fill:none; stroke:var(--ghost); stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round}
.td-ib{flex:1; min-width:0}
.td-ib > b{display:block; font-size:13.5px; font-weight:500; line-height:1.5}
.td-src{display:block; margin-top:6px; font-size:12.5px; color:var(--ink-soft)}
.td-src em{font-style:normal; color:var(--ghost)}
.td-rl{display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-top:7px}
.td-rate{display:inline-flex; align-items:center; gap:5px; font-size:12px; color:var(--ink-soft)}
.td-rate svg{width:13px; height:13px; color:#e0a340}
.td-rate em{font-style:normal; color:var(--ghost)}
.td-badge{padding:3px 9px; border-radius:999px; background:#fdf2e9; color:var(--accent-ink); font-size:11px}
.td-ir{flex:none; text-align:right}
.td-ir > b{display:block; font-size:15px; font-weight:600; color:var(--accent-ink); font-variant-numeric:tabular-nums}
.td-ir a{display:inline-flex; align-items:center; gap:5px; margin-top:6px; font-size:12.5px; color:var(--ink-soft); text-decoration:none}
.td-ir a:hover{color:var(--ink)}
.td-ir svg{width:13px; height:13px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round}
.td-foot{margin-top:18px; padding-top:16px; border-top:1px solid var(--line); font-size:12px; line-height:1.6; color:var(--ghost)}

@media (max-width:900px){
  .rv-form, .rv-sup, .rv-prod, .rv-ch, .rv-body{padding-left:20px; padding-right:20px}
  .rv-token{min-width:0; text-align:left; width:100%}
  .rv-row.is-price{align-items:flex-start}
  .rv-kpis{order:3; width:100%}
  .rv-kpi{flex:1}
  .rv-amt{width:140px}
}
@media (max-width:600px){
  .rv-lbl{min-width:100%}
  .rv-amt, .rv-pct, .rv-desi{width:auto; flex:1}
  .rv-modes{display:flex; margin:9px 0 0}
}





/* Blog yazısı: CMS'ten gelen içerik ve etiketler için küçük eklemeler. */
.art-body h2{margin:34px 0 12px; font-family:'Archivo',sans-serif; font-size:22px; font-weight:700; letter-spacing:-0.03em}
.art-body img{max-width:100%; height:auto; border-radius:14px; margin:8px 0 18px}
.art-body blockquote{margin:18px 0; padding:14px 18px; border-left:3px solid var(--line); color:var(--ink-soft)}

/* Liste: global `*{padding:0}` reset'i ul'un girintisini siliyor, madde işaretleri
   metin sütununun dışına taşıyordu. Tipografi .art-body p ile birebir aynı. */
.art-body ul, .art-body ol{margin:12px 0 0; padding-left:22px}
.art-body li{
  margin-top:6px; font-size:15.5px; line-height:1.8;
  color:var(--ink-soft); text-wrap:pretty;
}
.art-body li::marker{color:var(--ghost)}
.art-body li b, .art-body li strong{color:var(--ink); font-weight:600}
/* CMS bazen madde metnini <p> ile sarıyor — paragraf boşluğu iki kez binmesin. */
.art-body li > p{margin-top:0; font-size:inherit; line-height:inherit}
.art-body li > ul, .art-body li > ol{margin-top:6px}

/* Kırıntı ile kategori rozeti arasındaki boşluk (tasarımdaki .crumb margin'i
   ortak kurala taşınırken düşmüştü; yalnız yazı başlığında geri veriliyor). */
.art-top .crumb{margin-bottom:18px}


/* ---- ipucu (tooltip) ----
   Tasarım paketinde panel önizlemelerinde tanımlıydı (dashboard.html vb.) ama
   site CSS'ine hiç alınmamıştı; bu yüzden `title` özniteliği kullanılan yerlerde
   işletim sisteminin kendi balonu çıkıyordu. Metin `data-tip` özniteliğinden
   okunur. Ekran okuyucular için görünür metni olmayan öğelerde `aria-label`
   ayrıca verilmeli — `data-tip` yalnızca görseldir. */
[data-tip]{position:relative}
[data-tip]::after,[data-tip]::before{
  opacity:0; pointer-events:none; z-index:60;
  transition:opacity .16s ease, transform .16s ease;
}
[data-tip]::after{
  content:attr(data-tip);
  position:absolute; top:calc(100% + 10px); left:50%;
  transform:translateX(-50%) translateY(-5px);
  white-space:nowrap; font-size:12px; font-weight:400; line-height:1.3;
  padding:8px 12px; border-radius:10px;
  background:var(--ink); color:#fff; letter-spacing:0;
  box-shadow:0 10px 26px rgba(20,20,25,.18);
}
[data-tip]::before{
  content:""; position:absolute; top:calc(100% + 4px); left:50%;
  transform:translateX(-50%) translateY(-5px);
  border:5px solid transparent; border-bottom-color:var(--ink);
}
[data-tip]:hover::after,[data-tip]:hover::before,
[data-tip]:focus-visible::after,[data-tip]:focus-visible::before{
  opacity:1; transform:translateX(-50%) translateY(0);
}
/* Sağ kenardaki balon sayfa dışına taşmasın */
[data-tip].tip-end::after{left:auto; right:0; transform:translateX(0) translateY(-5px)}
[data-tip].tip-end:hover::after,
[data-tip].tip-end:focus-visible::after{transform:translateX(0) translateY(0)}
/* Dar sütunlarda (filtre paneli gibi) uzun metin taşmasın, sarsın */
[data-tip].tip-wrap::after{white-space:normal; width:max-content; max-width:220px}