/* ===== Clinall ana sayfa — hero arka planı ===== */
.home-s1 .img-wrapper picture{display:none!important}
.home-s1 .img-wrapper{
  height:100%!important;overflow:hidden;
  background:
    radial-gradient(700px 420px at 12% 18%,rgba(59,181,230,.55),transparent 62%),
    radial-gradient(760px 520px at 90% 85%,rgba(0,147,215,.55),transparent 60%),
    radial-gradient(600px 300px at 50% 50%,rgba(255,255,255,.06),transparent 70%),
    linear-gradient(135deg,#0B2545 0%,#134B7F 50%,#1F7DBF 100%)!important;
}
.home-s1 .img-wrapper::after{background:linear-gradient(to bottom,transparent 70%,rgba(11,37,69,.35) 100%)!important}
.home-s1 .img-wrapper::before{
  content:'';position:absolute;inset:0;z-index:1;pointer-events:none;
  background-image:radial-gradient(rgba(255,255,255,.18) 1px,transparent 1.2px);
  background-size:26px 26px;
  -webkit-mask-image:radial-gradient(ellipse at 50% 40%,#000 0%,transparent 75%);
          mask-image:radial-gradient(ellipse at 50% 40%,#000 0%,transparent 75%);
}

/* ===== Hero yüksekliği (sadece masaüstü) ===== */
@media (min-width:992px){
  .home-s1{height:clamp(560px,70vh,780px)!important}
  .home-s1 .clinic-filter-container{top:52%!important}
}

/* ===== Popüler Tedaviler ===== */
.cl-pop{margin-top:26px;text-align:center;color:#fff}
.cl-pop-t{font-size:13px;font-weight:600;letter-spacing:.04em;text-transform:uppercase;opacity:.75;margin-bottom:12px}
.cl-pop-list{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;max-width:760px;margin:0 auto}
.cl-pop-list a{color:#fff;text-decoration:none;font-size:14px;padding:7px 14px;border-radius:999px;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.22);backdrop-filter:blur(4px);transition:.2s}
.cl-pop-list a:hover{background:#fff;color:#0B4F8A}
.cl-pop-list a.all{background:none;border-color:transparent;text-decoration:underline;text-underline-offset:3px}

/* ===== Nasıl Çalışır ===== */
.cl-how{padding:72px 0 24px;background:#F7F7F6}
.cl-how-box{background:#fff;border-radius:24px;padding:48px 40px;box-shadow:0 10px 40px rgba(11,37,69,.06)}
.cl-how-head{text-align:center;margin-bottom:40px}
.cl-how-head span{display:inline-block;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#0093D7;background:rgba(0,147,215,.08);padding:6px 12px;border-radius:999px}
.cl-how-head h2{font-size:30px;font-weight:700;color:#0B2545;margin:14px 0 8px}
.cl-how-head p{color:#667085;font-size:15px;margin:0}
.cl-how-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;position:relative}
.cl-how-grid:before{content:'';position:absolute;top:34px;left:16%;right:16%;border-top:2px dashed rgba(0,147,215,.25)}
.cl-step{position:relative;text-align:center;padding:0 12px}
.cl-step-ic{width:68px;height:68px;border-radius:20px;margin:0 auto 18px;display:grid;place-items:center;background:linear-gradient(135deg,#3BB5E6,#2F5AA6);color:#fff;box-shadow:0 10px 24px rgba(47,90,166,.25);position:relative}
.cl-step-ic svg{width:30px;height:30px}
.cl-step-n{position:absolute;top:-8px;right:-8px;width:26px;height:26px;border-radius:50%;background:#fff;color:#2F5AA6;font-size:12px;font-weight:800;display:grid;place-items:center;box-shadow:0 2px 8px rgba(0,0,0,.12)}
.cl-step h3{font-size:18px;font-weight:700;color:#0B2545;margin-bottom:8px}
.cl-step p{font-size:14.5px;color:#667085;line-height:1.6;margin:0}

@media (max-width:767.98px){
  .cl-how{padding:40px 0 8px}
  .cl-how-box{padding:32px 20px}
  .cl-how-grid{grid-template-columns:1fr;gap:28px}
  .cl-how-grid:before{display:none}
  .cl-how-head h2{font-size:24px}
  .cl-pop-list a{font-size:13px;padding:6px 12px}
}
