/* Blue chrome slider — scoped exclusively to the Hizmet Yaklaşımımız section.
   Original site stylesheets and JS files remain untouched. */
#ys-blue-approach,
#ys-blue-approach *{box-sizing:border-box}
#ys-blue-approach{
  margin:0 0 90px; padding:clamp(14px,2.4vw,30px) clamp(12px,2.1vw,34px);
  position:relative; isolation:isolate; overflow:hidden;
  background:linear-gradient(135deg,#6f8fae 0%,#517190 46%,#304456 100%);
  font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif!important;
  color:#fbfcfc;
}
#ys-blue-approach .ys-blue-frame{
  max-width:1620px; margin:0 auto; min-height:720px; position:relative;
  isolation:isolate; overflow:hidden; padding:54px 65px 30px;
  border:11px solid transparent; border-radius:clamp(38px,5vw,88px);
  background:
    radial-gradient(ellipse 19% 49% at 16% 17%,rgba(243,245,246,.43),transparent 100%) padding-box,
    radial-gradient(ellipse 18% 49% at 83% 85%,rgba(240,243,244,.37),transparent 100%) padding-box,
    repeating-linear-gradient(112deg,rgba(255,255,255,.015) 0,rgba(255,255,255,.015) 1px,transparent 1px,transparent 4px) padding-box,
    linear-gradient(109deg,#2c3e4e 0%,#243749 23%,#14283b 46%,#1e364d 67%,#304456 100%) padding-box,
    linear-gradient(145deg,#324759 0%,#f7ffff 7%,#5a7fa1 17%,#f7f8f9 29%,#3a5167 43%,#f9fafb 57%,#496682 69%,#f9ffff 86%,#2d3f50 100%) border-box;
  box-shadow:inset 0 0 0 2px rgba(6,14,21,.94),inset 0 0 0 6px rgba(236,239,242,.52),inset 0 0 0 9px #2a557d,
    inset 0 0 28px 9px rgba(49,100,147,.49),0 12px 1px rgba(18,35,50,.38),0 24px 40px rgba(9,21,31,.42),0 0 0 2px #5e88ae;
}
#ys-blue-approach .ys-blue-frame:before,
#ys-blue-approach .ys-blue-frame:after{
  content:"";position:absolute;left:20%;right:20%;height:5px;z-index:1;pointer-events:none;
  background:linear-gradient(90deg,transparent,#4585c1 31%,#316493 50%,#4d8ac4 69%,transparent);
  filter:drop-shadow(0 0 8px #316493) drop-shadow(0 0 11px #316493);
}
#ys-blue-approach .ys-blue-frame:before{top:22px}
#ys-blue-approach .ys-blue-frame:after{bottom:22px}
#ys-blue-approach .ys-blue-heading{position:relative;z-index:5;text-align:center;margin:0 auto 10px;max-width:1200px}
#ys-blue-approach .ys-blue-eyebrow{
  font:800 clamp(14px,1.35vw,18px)/1.35 Inter,Arial,sans-serif!important;
  color:#3d7cb7!important;letter-spacing:-.02em;margin:0 0 17px!important;
  text-shadow:0 0 10px rgba(49,100,147,.35);
}
#ys-blue-approach h2{
  font-family:Inter,Arial,sans-serif!important;
  font-size:clamp(31px,3.25vw,51px)!important;font-weight:900!important;
  line-height:1.14!important;letter-spacing:-.04em!important;
  color:#fdfdfd!important;text-align:center!important;
  text-shadow:0 2px 4px rgba(6,14,20,.32)!important;margin:0!important;
}
#ys-blue-approach .ys-blue-carousel{
  position:relative;z-index:4; outline-offset:4px; margin-top:14px;min-height:508px;
}
#ys-blue-approach .ys-blue-slides{position:relative;height:505px;}
#ys-blue-approach .ys-blue-slide{
  position:absolute;inset:0;display:block;margin:0!important;padding:0;
  opacity:0;visibility:hidden;pointer-events:none;
  transform:translateY(7px);transition:opacity .52s ease,transform .52s ease,visibility 0s .52s;
}
#ys-blue-approach .ys-blue-slide.is-active{opacity:1;visibility:visible;transform:none;pointer-events:auto;transition:opacity .52s ease,transform .52s ease,visibility 0s;}
#ys-blue-approach .ys-blue-track{
  position:absolute;top:125px;left:6.5%;right:6.5%;height:106px;z-index:0;
  border-top:2px solid rgba(192,201,210,.78);border-bottom:2px solid rgba(192,201,210,.78);
  background:linear-gradient(180deg,rgba(211,217,223,.085),rgba(10,22,33,.18) 47%,rgba(15,33,49,.16));
  box-shadow:0 -6px 13px -12px #316493,0 6px 13px -12px #316493,
    inset 0 1px 0 rgba(255,255,255,.20),inset 0 0 30px rgba(50,101,149,.08);
}
#ys-blue-approach .ys-blue-mark{
  position:absolute;top:15px;left:24%;font:900 83px/1 Georgia,serif;color:#dcdfe2;
  text-shadow:0 1px #ffffff,0 3px 4px #0a1622;opacity:.95;
}
#ys-blue-approach .ys-blue-photo-frame{
  position:absolute;z-index:2;top:10px;left:50%;transform:translateX(-50%);
  width:205px;height:270px;padding:11px;
  border:5px solid transparent;border-radius:45px;
  background:linear-gradient(#1a2f42,#273746) padding-box,
    linear-gradient(130deg,#faffff,#637788 20%,#f9fafa 42%,#394f65 57%,#eff1f3 81%,#768795 94%) border-box;
  box-shadow:inset 0 0 0 2px #56799b,inset 0 0 0 5px #2b5881,
    inset 0 0 11px 6px rgba(48,98,145,.31),0 7px 17px rgba(8,18,27,.60),0 0 15px rgba(49,100,147,.44);
}
#ys-blue-approach .ys-blue-photo-frame:before,
#ys-blue-approach .ys-blue-photo-frame:after{
  content:"✧";position:absolute;left:50%;transform:translateX(-50%);z-index:3;
  font-size:15px;line-height:15px;color:#f5f7f8;
  text-shadow:0 1px 2px #112436;
}
#ys-blue-approach .ys-blue-photo-frame:before{top:-12px}
#ys-blue-approach .ys-blue-photo-frame:after{bottom:-11px}
#ys-blue-approach .ys-blue-photo-frame img{
  display:block;width:100%;height:100%;object-fit:cover;object-position:center;
  border-radius:30px;border:2px solid #336799;box-shadow:0 0 0 2px #0e1e2d,inset 0 0 8px #316493;
}
#ys-blue-approach .ys-blue-arrow{
  position:absolute;z-index:9;top:139px;width:112px;height:112px;
  display:grid;place-items:center;background:transparent!important;border:0!important;
  padding:0!important;color:#1e3c59!important;cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
#ys-blue-approach .ys-blue-prev{left:0}
#ys-blue-approach .ys-blue-next{right:0}
#ys-blue-approach .ys-blue-arrow-disc{
  display:grid;place-items:center;width:103px;height:103px;border-radius:50%;border:9px solid transparent;
  background:linear-gradient(140deg,#fbffff,#547595 33%,#f0f3f4 54%,#4d6c88 82%,#f3ffff) padding-box,
    linear-gradient(140deg,#faffff,#3b5268 25%,#edf0f2 50%,#253544 80%,#faffff) border-box;
  box-shadow:inset 0 1px 7px #517190,inset 0 0 0 2px #3d556c,0 0 0 3px #326696,
    0 0 0 6px rgba(50,101,149,.25),0 0 17px 5px rgba(48,98,144,.70),0 8px 15px rgba(8,16,25,.63);
  transition:transform .22s ease,filter .22s ease;
}
#ys-blue-approach .ys-blue-arrow-disc i{color:#1f3e5c!important;font-size:37px!important;filter:drop-shadow(0 1px rgba(255,255,255,.8));}
#ys-blue-approach .ys-blue-arrow:hover .ys-blue-arrow-disc{transform:scale(1.06);filter:brightness(1.10)}
#ys-blue-approach .ys-blue-arrow:focus-visible{outline:3px solid #ffffff;outline-offset:8px;border-radius:50%}
#ys-blue-approach .ys-blue-slide-body{
  position:absolute;top:288px;left:8%;right:8%;display:flex;flex-direction:column;align-items:center;text-align:center;
}
#ys-blue-approach .ys-blue-description{
  max-width:965px;min-height:65px;margin:0 0 14px!important;
  font:600 clamp(15px,1.35vw,19px)/1.52 Inter,Arial,sans-serif!important;
  letter-spacing:-.018em;color:#f9fafb!important;text-shadow:0 2px 4px rgba(7,14,22,.32);
}
#ys-blue-approach .ys-blue-slide-body h3{
  margin:0 0 3px!important;color:#fff!important;
  font:900 clamp(20px,1.65vw,25px)/1.30 Inter,Arial,sans-serif!important;
  letter-spacing:-.032em;text-shadow:0 2px 4px rgba(6,13,20,.34);
}
#ys-blue-approach .ys-blue-subtitle{
  margin:0 0 8px!important;color:#6c8dad!important;
  font:500 clamp(15px,1.18vw,18px)/1.35 Inter,Arial,sans-serif!important;
}
#ys-blue-approach .ys-blue-rating{display:flex;justify-content:center;gap:0;font-size:26px;letter-spacing:3px;line-height:1.2;color:#356c9f;text-shadow:0 0 8px rgba(49,100,147,.40)}
#ys-blue-approach .ys-blue-muted-star{color:#ccd1d6;text-shadow:none}
#ys-blue-approach .ys-blue-dots{position:relative;z-index:9;display:flex;justify-content:center;gap:9px;margin-top:5px}
#ys-blue-approach .ys-blue-dot{
  width:29px;height:7px;padding:0;border-radius:8px;border:1px solid rgba(214,220,225,.48);background:linear-gradient(#7191af,#405971);box-shadow:inset 0 1px 2px rgba(255,255,255,.2);cursor:pointer;
}
#ys-blue-approach .ys-blue-dot.is-active{width:36px;background:#316493;border-color:#cfd6dd;box-shadow:0 0 9px 2px #30618f}
#ys-blue-approach .ys-blue-dot:focus-visible{outline:3px solid #fff;outline-offset:4px}
@media(max-width:991.98px){
 #ys-blue-approach .ys-blue-frame{padding:42px 24px 28px;min-height:686px}
 #ys-blue-approach .ys-blue-mark{left:18%}
 #ys-blue-approach .ys-blue-carousel{min-height:508px}
 #ys-blue-approach .ys-blue-arrow{width:73px;height:73px;top:146px}
 #ys-blue-approach .ys-blue-arrow-disc{width:66px;height:66px;border-width:5px}
 #ys-blue-approach .ys-blue-arrow-disc i{font-size:24px!important}
 #ys-blue-approach .ys-blue-track{left:4%;right:4%}
 #ys-blue-approach .ys-blue-slide-body{left:4%;right:4%}
}
@media(max-width:575.98px){
 #ys-blue-approach{padding:12px 10px;margin-bottom:55px}
 #ys-blue-approach .ys-blue-frame{padding:33px 12px 30px;min-height:730px;border-width:6px;border-radius:36px;box-shadow:inset 0 0 0 2px rgba(9,21,31,.9),inset 0 0 0 4px #2d5b87,inset 0 0 19px 4px rgba(49,100,147,.29),0 12px 20px rgba(11,24,37,.25)}
 #ys-blue-approach .ys-blue-frame:before{top:12px}
 #ys-blue-approach .ys-blue-frame:after{bottom:12px}
 #ys-blue-approach .ys-blue-heading{margin-bottom:4px}
 #ys-blue-approach .ys-blue-eyebrow{font-size:13px!important;margin-bottom:12px!important}
 #ys-blue-approach h2{font-size:clamp(23px,6.5vw,32px)!important;line-height:1.19!important}
 #ys-blue-approach .ys-blue-break{display:none}
 #ys-blue-approach .ys-blue-carousel{min-height:515px;margin-top:5px}
 #ys-blue-approach .ys-blue-slides{height:513px}
 #ys-blue-approach .ys-blue-track{top:116px;height:90px;left:0;right:0}
 #ys-blue-approach .ys-blue-mark{top:12px;left:21%;font-size:60px}
 #ys-blue-approach .ys-blue-photo-frame{top:10px;width:154px;height:222px;padding:7px;border-width:3px;border-radius:33px}
 #ys-blue-approach .ys-blue-photo-frame img{border-radius:23px}
 #ys-blue-approach .ys-blue-arrow{top:127px;width:48px;height:48px}
 #ys-blue-approach .ys-blue-arrow-disc{width:44px;height:44px;border-width:3px;box-shadow:inset 0 1px 3px #51718f,0 0 0 2px #2e5e8a,0 0 10px 2px #2f618e}
 #ys-blue-approach .ys-blue-arrow-disc i{font-size:16px!important}
 #ys-blue-approach .ys-blue-slide-body{top:246px;left:2%;right:2%}
 #ys-blue-approach .ys-blue-description{font-size:14px!important;line-height:1.52!important;min-height:104px;margin-bottom:13px!important}
 #ys-blue-approach .ys-blue-slide-body h3{font-size:20px!important}
 #ys-blue-approach .ys-blue-subtitle{font-size:14px!important}
 #ys-blue-approach .ys-blue-rating{font-size:24px}
 #ys-blue-approach .ys-blue-dots{margin-top:0}
}
@media(prefers-reduced-motion:reduce){#ys-blue-approach .ys-blue-slide{transition:none!important}#ys-blue-approach .ys-blue-arrow-disc{transition:none!important}}
