
@media (max-width: 768px){
  .mobile-app .wrap > .section-head,
  .mobile-app .wrap > .mgrid,
  .mobile-app .wrap > .m-cities,
  .mobile-app .wrap > .m-faq,
  .mobile-app .wrap > .m-reviews,
  .mobile-app .wrap > .m-pros,
  .mobile-app .wrap > .m-grow{
  }

  .mobile-app .wrap > .section-head + .mgrid{
    margin-top:14px !important;
  }

  .mobile-app .wrap > .mgrid + .section-head{
    margin-top:24px !important;
  }
}

main.home[data-home-mode="desktop"] > .desktop-app{display:block !important}
main.home[data-home-mode="desktop"] > .mobile-app{display:none !important}
main.home[data-home-mode="mobile"] > .desktop-app{display:none !important}
main.home[data-home-mode="mobile"] > .mobile-app{display:block !important}

main.home[data-home-entering="1"]{opacity:1}

:root{
  --green:#1dbf71;
  --navy:#1a2a33;

  --bg:#f7f8fa;
  --card:#ffffff;

  --muted:#6b7280;
  --line:rgba(15,23,42,.08);

  --shadow:0 8px 22px rgba(15,23,42,.08);
  --shadow-soft:0 4px 12px rgba(15,23,42,.06);

  --radius:16px;
  --radius-sm:14px;
  --radius-lg:18px;

  --focus:0 0 0 4px rgba(29,191,113,.16);
}

*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
@media (min-width: 769px){
  html{scrollbar-gutter:stable}
}
body{

  font-family:'Poppins',sans-serif;
  background:var(--bg);
  color:#0f172a;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  overflow-x:clip;
}

main.home,.desktop-app,.mobile-app{overflow-x:clip}
a{text-decoration:none;color:inherit}
img{display:block;max-width:100%}

.container{max-width:1200px;margin:0 auto;padding:0 20px}
.section{padding:72px 0}
.section.alt{background:#f7f8fa}
@supports (content-visibility: auto){
  main.home .section[data-defer-render="1"]{
    content-visibility:auto;
    contain-intrinsic-size:900px 680px;
  }
  .mobile-app [data-defer-render="1"]{
    content-visibility:auto;
    contain-intrinsic-size:620px 480px;
  }
}
@media (max-width:768px){
  @supports (content-visibility: auto){
    main.home .section[data-defer-render="1"]{
      contain-intrinsic-size:640px 520px;
    }
  }
}
.h2{font-size:20px;font-weight:700;color:var(--navy)}
.p{color:#475467;font-size:13px;margin-top:8px;line-height:1.7}

/* ===== HEADER ===== */
header{
  position:sticky;top:0;z-index:200;
  background:rgba(255,255,255,.96);
  backdrop-filter:none;
  border-bottom:1px solid rgba(15,23,42,.06);
}
.header-inner{
  max-width:1200px;margin:0 auto;
  display:flex;align-items:center;justify-content:space-between;
  padding:14px 20px;
  gap:16px;
}
.logo{
  font-size:22px;font-weight:700;color:#0f172a;
  letter-spacing:-.2px;
  white-space:nowrap;
}
.logo span{color:var(--green)}
.nav-links{display:flex;align-items:center;gap:22px}
.nav-links a{font-weight:600;color:#0f172a;font-size:14px;opacity:.9}
.nav-links a:hover{color:var(--green);opacity:1}

.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  border:1px solid transparent;
  padding:10px 16px;border-radius:12px;
  font-weight:600;font-size:14px;cursor:pointer;
  transition:transform .18s ease, box-shadow .18s ease, filter .18s ease, border-color .18s ease;
  will-change:transform;
  white-space:nowrap;
}
.btn:focus{outline:none;box-shadow:var(--focus)}
.btn-primary{
  background:var(--green);color:#fff;
  box-shadow:0 10px 22px rgba(29,191,113,.22);
}
.btn-primary:hover{transform:translateY(-1px);filter:brightness(.98)}
.btn-ghost{
  background:#fff;color:#0f172a;border-color:rgba(15,23,42,.10);
  box-shadow:0 2px 10px rgba(15,23,42,.04);
}
.btn-ghost:hover{
  border-color:rgba(29,191,113,.30);
  color:var(--green);
  transform:translateY(-1px);
  box-shadow:0 8px 18px rgba(15,23,42,.08);
}

/* ===== HERO ===== */
.hero{
  background:linear-gradient(135deg, #1a2a33 0%, #243743 55%, #1c313d 100%);
  color:#fff;
  padding:64px 0 34px;
}
.hero-grid{
  display:grid;
  grid-template-columns: 1.15fr .85fr;
  gap:26px;
  align-items:stretch;
}
.hero h1{
  font-size:34px;line-height:1.18;font-weight:800;
  letter-spacing:-.35px;
}
.hero .sub{
  margin-top:14px;
  color:rgba(255,255,255,.86);
  font-size:15px;line-height:1.68;
  max-width:560px;
}
.hero-badges{
  margin-top:18px;
  display:flex;flex-wrap:wrap;gap:10px;
}
.badge{
  display:inline-flex;align-items:center;gap:8px;
  padding:8px 12px;border-radius:999px;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.12);
  font-weight:700;font-size:12.5px;
}
.badge i{color:var(--green)}
.hero-card{
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.12);
  border-radius:18px;
  padding:16px;
  backdrop-filter:none;
  box-shadow:0 12px 28px rgba(0,0,0,.14);
  position:relative;
}

.search-box{
  background:#fff;border-radius:16px;
  display:flex;gap:10px;align-items:center;
  padding:10px 10px 10px 12px;
  position:relative;
  z-index:5;
  border:1px solid rgba(15,23,42,.06);
  box-shadow:0 6px 16px rgba(15,23,42,.08);
}
.search-box:focus-within{
  box-shadow:0 12px 26px rgba(15,23,42,.12), var(--focus);
  border-color:rgba(29,191,113,.28);
}
.search-box .ts-search-icon{
  width:20px;
  height:20px;
  color:#94a3b8;
  margin-left:5px;
  flex:0 0 auto;
}
.search-box input{
  flex:1;border:none;outline:none;
  font-family:'Poppins',sans-serif;
  font-size:13px;color:#0f172a;
  padding:10px 6px;
}
.search-box button{
  border:none;cursor:pointer;
  background:var(--green);color:#fff;
  padding:11px 14px;border-radius:12px;
  font-weight:700;font-size:13.5px;
  display:inline-flex;align-items:center;gap:8px;
  transition:.18s ease;
  box-shadow:0 8px 18px rgba(29,191,113,.16);
}
.search-box button:hover{filter:brightness(.98);transform:translateY(-1px)}

.mobile-app .searchbox .m-ai-mini-btn{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:40px;
  height:34px;
  padding:0 10px;
  border-radius:11px;
  border:1px solid var(--border2);
  background:#fff;
  color:#5d6570;
  text-decoration:none;
  font-size:12px;
  font-weight:600;
  line-height:1;
  box-shadow:0 3px 10px rgba(15,23,42,.04);
  transition:.15s ease;
}
.mobile-app .searchbox .m-ai-mini-btn:hover{
  border-color:#bfe9d1;
  background:#f4fdf8;
}
.mobile-app .searchbox .m-ai-mini-btn:active{transform:scale(.98)}

.hero-helper{
  margin-top:10px;
  display:flex;gap:10px;flex-wrap:wrap;
}
.helper-chip{
  background:#fff;
  border:1px solid rgba(15,23,42,.08);
  color:#0f172a;
  padding:8px 12px;border-radius:999px;
  font-weight:500;
  font-size:12.5px;
  cursor:pointer;
  transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease, color .16s ease, background .16s ease;
  box-shadow:0 2px 10px rgba(15,23,42,.04);
}
.helper-chip:hover{
  border-color:rgba(29,191,113,.28);
  color:var(--green);
  transform:translateY(-1px);
  box-shadow:0 8px 18px rgba(15,23,42,.08);
}

.hero-cta-row{
  margin-top:14px;
  display:flex;gap:10px;flex-wrap:wrap;
}
.hero-cta-row .btn{padding:11px 14px;border-radius:12px}

.trust-strip{
  margin-top:18px;
  display:grid;
  grid-template-columns: repeat(3,1fr);
  gap:12px;
}
.kpi{
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.12);
  border-radius:14px;
  padding:12px 12px;
}
.kpi .t{font-weight:700;font-size:16px}
.kpi .d{margin-top:2px;color:rgba(255,255,255,.82);font-size:12.5px}

.suggest{
  margin-top:10px;
  background:#fff;
  border:1px solid rgba(15,23,42,.08);
  border-radius:14px;
  box-shadow:0 16px 36px rgba(15,23,42,.14);
  overflow:hidden;
  display:none;
}
.suggest.active{display:block}
.suggest .head{
  padding:10px 14px;
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  border-bottom:1px solid rgba(15,23,42,.06);
}
.suggest .head .t{
  font-weight:800;color:#0f172a;font-size:12.5px;
}
.suggest .head .clear{
  border:none;background:transparent;cursor:pointer;
  font-weight:800;color:#94a3b8;font-size:12.5px;
}
.suggest .head .clear:hover{color:var(--green)}
.suggest .item{
  padding:12px 14px;
  display:flex;align-items:center;gap:10px;
  cursor:pointer;
  font-weight:600;font-size:13.5px;color:#0f172a;
  border-bottom:1px solid rgba(15,23,42,.06);
}
.suggest .item:last-child{border-bottom:none}
.suggest .item i{color:#94a3b8}
.suggest .item:hover{background:rgba(29,191,113,.06)}
.suggest .muted{color:#667085;font-weight:600;font-size:12.5px}
.suggest .kbd{
  margin-left:auto;
  font-size:11px;
  color:#98a2b3;
  border:1px solid rgba(15,23,42,.08);
  background:#f8fafc;
  padding:3px 8px;
  border-radius:999px;
  font-weight:800;
}

.popular-head{
  display:flex;align-items:flex-end;justify-content:space-between;
  gap:14px;margin-bottom:18px;flex-wrap:wrap;
}
.link{color:#0f172a;font-weight:600;font-size:13.5px;opacity:.85;transition:.16s}
.link:hover{color:var(--green);opacity:1}

.grid{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:14px;
}
.card{
  background:var(--card);
  border:1px solid rgba(15,23,42,.07);
  border-radius:var(--radius);
  overflow:hidden;
  box-shadow:var(--shadow-soft);
  transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}
.card:hover{
  transform:translateY(-2px);
  box-shadow:var(--shadow);
  border-color:rgba(29,191,113,.18);
}
.card img{width:100%;height:118px;object-fit:cover;background:#eef2f7}
.card-body{padding:10px 10px 12px}
.card-body h3{
  font-size:12.5px;font-weight:500;color:#0f172a;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.card-body p{
  margin-top:6px;font-size:11.5px;color:#667085;
  display:flex;align-items:center;gap:6px;
}
.card-body p i{color:var(--green)}

.how-wrap{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:26px;
  align-items:center;
}
.steps{display:grid;gap:12px;margin-top:14px}
.step{
  background:#fff;
  border:1px solid rgba(15,23,42,.07);
  border-radius:var(--radius);
  padding:14px 14px;
  box-shadow:var(--shadow-soft);
  display:flex;gap:12px;align-items:flex-start;
  transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}
.step:hover{
  transform:translateY(-2px);
  box-shadow:var(--shadow);
  border-color:rgba(29,191,113,.16);
}
.step i{
  width:42px;height:42px;border-radius:14px;
  display:flex;align-items:center;justify-content:center;
  background:rgba(29,191,113,.10);
  color:var(--green);font-size:18px;
  flex:0 0 42px;
}
.step strong{display:block;font-weight:600;color:#0f172a}
.step span{display:block;margin-top:4px;color:#667085;font-size:13px;line-height:1.55}
.how-img img{border-radius:var(--radius-lg);box-shadow:var(--shadow)}

.cities-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:16px}
.city-search{
  display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-start;
  margin:14px 0 18px;
}
.city-search .input{
  flex:1;min-width:260px;
  display:flex;align-items:center;gap:10px;
  background:#fff;
  border:1px solid rgba(15,23,42,.07);
  border-radius:999px;
  padding:10px 14px;
  box-shadow:var(--shadow-soft);
}
.city-search .input:focus-within{
  border-color:rgba(29,191,113,.26);
  box-shadow:0 12px 26px rgba(15,23,42,.10), var(--focus);
}
.city-search .input .ts-search-icon{
  width:16px;
  height:16px;
  color:#94a3b8;
  flex:0 0 auto;
}
.city-search input{
  border:none;outline:none;background:transparent;
  font-family:'Poppins',sans-serif;font-size:13px;
  width:100%;
}
.city-search button{
  border:none;border-radius:12px;
  background:var(--green);color:#fff;
  padding:10px 16px;font-weight:900;cursor:pointer;
  box-shadow:0 10px 22px rgba(29,191,113,.18);
  transition:.18s ease;
}
.city-search button:hover{transform:translateY(-1px)}

.city-grid{
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:10px;
}
.city{
  background:#fff;
  border:1px solid rgba(15,23,42,.07);
  border-radius:14px;
  padding:10px 12px;text-align:center;
  box-shadow:0 2px 10px rgba(15,23,42,.04);
  font-weight:500;font-size:13px;color:#0f172a;
  transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease, color .16s ease, background .16s ease;
  cursor:pointer;
}
.city:hover{
  transform:translateY(-2px);
  border-color:rgba(29,191,113,.18);
  color:var(--green);
  box-shadow:0 10px 22px rgba(15,23,42,.10);
  background:rgba(29,191,113,.04);
}
.city-empty{
  display:none;
  margin-top:12px;
  background:#fff7e6;color:#7a5b1a;border:1px solid #ffe4b8;
  padding:10px 12px;border-radius:14px;font-size:13px;
  align-items:center;gap:10px;
}
.city-empty i{color:#b7791f}

/* ===== FEATURED PROS ===== */
.pro-head-row{
  display:flex;align-items:flex-end;justify-content:space-between;
  gap:12px;flex-wrap:wrap;margin-bottom:16px;
  position:relative;
  padding-right:110px;
}
.pro-actions{
  display:flex;gap:10px;
  position:absolute;right:0;bottom:0;
}
.icon-btn{
  width:42px;height:42px;border-radius:14px;
  border:1px solid rgba(15,23,42,.08);
  background:#fff;
  box-shadow:0 2px 10px rgba(15,23,42,.04);
  display:inline-flex;align-items:center;justify-content:center;
  cursor:pointer;
  transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease, color .16s ease;
  color:#0f172a;
}
.icon-btn:hover{
  transform:translateY(-1px);
  border-color:rgba(29,191,113,.20);
  color:var(--green);
  box-shadow:0 10px 22px rgba(15,23,42,.10);
}
.icon-btn:focus{outline:none;box-shadow:var(--focus)}

.pro-track{
  display:flex;gap:14px;
  overflow-x:auto;scroll-behavior:smooth;
  padding-bottom:10px;
  scrollbar-width:none;
  scroll-snap-type:x mandatory;
}
.pro-track::-webkit-scrollbar{display:none}
.pro-card{
  flex:0 0 calc((100% - 28px)/3);
  background:#fff;
  border:1px solid rgba(15,23,42,.07);
  border-radius:var(--radius-lg);
  box-shadow:var(--shadow-soft);
  padding:16px;
  scroll-snap-align:start;
  transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}
.pro-card:hover{
  transform:translateY(-2px);
  box-shadow:var(--shadow);
  border-color:rgba(29,191,113,.16);
}
.pro-top{display:flex;gap:12px;align-items:center}
.avatar{
  width:52px;height:52px;border-radius:50%;
  overflow:hidden;border:2px solid rgba(29,191,113,.16);
  flex:0 0 52px;background:#eef2f7;
}
.avatar img{width:100%;height:100%;object-fit:cover}
.pro-name{font-weight:600;color:#0f172a;font-size:14px}
.pro-rating{margin-top:4px;display:flex;align-items:center;gap:8px;font-weight:600;color:#0f172a;font-size:12.5px}
.stars{display:inline-flex;gap:2px}
.stars i{color:#f5b301;font-size:12px}
.pro-meta{margin-top:10px;display:flex;flex-wrap:wrap;gap:10px;font-size:12px;color:#667085}
.pro-meta i{color:#98a2b3;margin-right:6px}
.pro-tags{margin-top:10px;display:flex;flex-wrap:wrap;gap:8px}
.pro-tags span{
  background:rgba(15,23,42,.04);
  border:1px solid rgba(15,23,42,.08);
  border-radius:999px;
  padding:5px 10px;
  font-size:12px;font-weight:600;color:#0f172a;
}
.pro-desc{
  margin-top:10px;font-size:13px;color:#475467;line-height:1.6;
  overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;
}

/* ===== GROW ===== */
.grow-boxes{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:18px}
.grow{
  background:#fff;
  border:1px solid rgba(15,23,42,.07);
  border-radius:var(--radius-lg);
  box-shadow:var(--shadow-soft);
  padding:18px;
  transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease;
  text-align:left;
}
.grow:hover{
  transform:translateY(-2px);
  box-shadow:var(--shadow);
  border-color:rgba(29,191,113,.16);
}
.grow i{
  width:44px;height:44px;border-radius:14px;
  background:rgba(29,191,113,.10);
  color:var(--green);
  display:flex;align-items:center;justify-content:center;
  font-size:20px;
}
.grow h3{margin-top:10px;font-size:14px;font-weight:600;color:#0f172a}
.grow p{margin-top:6px;color:#667085;font-size:13px;line-height:1.6}

/* ===== REVIEWS ===== */
.reviews-head{margin-bottom:16px}
.reviews-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.review{
  background:#fff;
  border:1px solid rgba(15,23,42,.07);
  border-radius:var(--radius-lg);
  padding:16px;
  transition:transform .16s ease, box-shadow .16s ease, border-color .16s ease;
}

.review-top{display:flex;gap:12px;align-items:center}
.review-top img{
  width:52px;height:52px;border-radius:50%;
  object-fit:cover;
  border:2px solid rgba(29,191,113,.16);
  background:#eef2f7;
}
.review h4{font-size:14px;font-weight:600;color:#0f172a}
.review p{margin-top:10px;color:#475467;font-size:13px;line-height:1.7}

/* ===== FAQ ===== */
.faq{max-width:1000px}
.faq-list{margin-top:16px;border-top:1px solid rgba(15,23,42,.06)}
.faq-item{border-bottom:1px solid rgba(15,23,42,.06)}
.faq-q{
  width:100%;text-align:left;background:none;border:none;cursor:pointer;
  padding:16px 0;font-family:'Poppins',sans-serif;
  display:flex;align-items:center;justify-content:space-between;gap:14px;
  font-weight:500;color:#0f172a;font-size:14.5px;
}
.faq-q i{color:#94a3b8;transition:.18s}
.faq-a{max-height:0;overflow:hidden;opacity:0;transition:.26s}
.faq-a p{padding:0 0 16px;color:#475467;font-size:13.5px;line-height:1.75}
.faq-item.active .faq-a{max-height:220px;opacity:1}
.faq-item.active .faq-q i{transform:rotate(180deg);color:var(--green)}

/* ===== FOOTER ===== */
footer{
  background:var(--navy);color:#cbd5e1;
  padding:52px 0 22px;
}
.footer-top{
  display:grid;grid-template-columns:1.35fr 1fr 1fr;
  gap:26px;
  padding-bottom:22px;
}
.footer-logo{font-size:22px;font-weight:700;color:#fff}
.footer-logo span{color:var(--green)}
.footer p{color:#b6c0cc;font-size:13.5px;line-height:1.7;margin-top:10px;max-width:520px}
.footer h4{color:#fff;font-size:14px;font-weight:900;margin-bottom:10px}
.footer ul{list-style:none;display:grid;gap:8px}
.footer a{color:#cbd5e1;font-weight:600;font-size:13.5px;opacity:.9}
.footer a:hover{color:#fff;opacity:1}
.store-badge{
  display:inline-flex;align-items:center;gap:8px;
  padding:10px 14px;border-radius:12px;
  border:1px solid rgba(255,255,255,.16);
  background:rgba(255,255,255,.06);
  color:#fff;font-weight:900;font-size:13px;
  transition:transform .16s ease, background .16s ease, border-color .16s ease;
}
.store-badge:hover{background:var(--green);border-color:var(--green);transform:translateY(-1px)}
.footer-bottom{
  text-align:center;color:#94a3b8;font-size:12.5px;
  padding-top:16px;margin-top:12px;
}

/* =========================================================
   GLOBAL: seçim kapalı (formlar hariç)
   ========================================================= */
html, body{
  -webkit-touch-callout:none;
  -webkit-user-select:none;
  user-select:none;
}
*, *::before, *::after{
  -webkit-user-select:none;
  user-select:none;
}
::selection{ background: transparent; }
::-moz-selection{ background: transparent; }
input, textarea, select, option{
  -webkit-user-select:text;
  user-select:text;
}
[contenteditable="true"]{
  -webkit-user-select:text;
  user-select:text;
}
a, button{
  -webkit-tap-highlight-color: transparent;
}

/* =========================================================
   MOBILE TASKRABBIT (scoped)
   ========================================================= */
.mobile-app{ user-select:none; -webkit-user-select:none; -webkit-touch-callout:none; }
.mobile-app input, .mobile-app textarea{ user-select:text; -webkit-user-select:text; }

.mobile-app{display:none;} /* default: mobil gizli */

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

.mobile-app{
  font-family:'Poppins',sans-serif;
  background:#f7f8fa;
  color:#0f172a;
  -webkit-font-smoothing:antialiased;
  padding-bottom:74px;
  --green:#1dbf71;
  --ink:#0f172a;
  --muted:#667085;
  --bg:#f7f8fa;
  --card:#ffffff;
  --border:#e6e7eb;
  --border2:#eef0f3;
  --r:14px;
  --r2:16px;
  --shadow-soft:0 2px 8px rgba(15,23,42,.05);
  --shadow-tiny:0 1px 4px rgba(15,23,42,.04);
}
.mobile-app a{color:inherit;text-decoration:none}
.mobile-app button{font-family:inherit}
.mobile-app .wrap{max-width:420px;margin:0 auto}

/* Topbar / drawer / bottom nav stilleri include’larda da lazım olabilir */
.mobile-app .topbar{
  position:sticky;top:0;z-index:60;
  background:#fff;
  backdrop-filter:none;
  border-bottom:1px solid var(--border2);
}
.mobile-app .topbar-inner{
  padding:14px 14px 12px;
  display:flex;align-items:center;
  justify-content:space-between;
  gap:10px;
}
.mobile-app .loc{
  display:flex;align-items:center;gap:8px;
  padding:10px 12px;
  background:#fff;
  border:1px solid var(--border);
  border-radius:13px;
  font-weight:600;
  font-size:13px;
  max-width:240px;
  box-shadow:var(--shadow-tiny);
  cursor:pointer;
  transition:.15s ease;
}
.mobile-app .loc:hover{border-color:#d7dbe2}
.mobile-app .loc:active{transform:scale(.99)}
.mobile-app .loc .pin{width:18px;height:18px;display:inline-flex;align-items:center;justify-content:center;color:var(--green);font-size:14px}
.mobile-app .loc span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mobile-app .iconbtn{
  width:40px;height:40px;border-radius:13px;
  border:1px solid var(--border);
  background:#fff;
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;
  transition:.15s ease;
  box-shadow:var(--shadow-tiny);
}
.mobile-app .iconbtn:hover{border-color:#d7dbe2}
.mobile-app .iconbtn:active{transform:scale(.98)}
.mobile-app .iconbtn svg{width:18px;height:18px;opacity:.86}

/* Drawer */
.mobile-app .drawer-overlay{
  position:fixed;inset:0;
  background:rgba(15,23,42,.40);
  z-index:85;
  opacity:0;pointer-events:none;
  transition:opacity .18s ease;
}
.mobile-app .drawer-overlay.active{opacity:1;pointer-events:auto}
.mobile-app .drawer{
  position:fixed;top:0;left:0;bottom:0;
  width:min(320px, 86vw);
  background:#fff;
  z-index:90;
  transform:translateX(-104%);
  transition:transform .22s ease;
  border-right:1px solid var(--border2);
  display:flex;flex-direction:column;
}
.mobile-app .drawer.active{transform:translateX(0)}
.mobile-app .drawer-head{
  padding:14px 14px 12px;
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  border-bottom:1px solid var(--border2);
}
.mobile-app .drawer-logo{
  font-weight:900;font-size:16px;letter-spacing:-.2px;color:#0f172a;
}
.mobile-app .drawer-logo b{color:var(--green);font-weight:900}
.mobile-app .drawer-close{
  width:38px;height:38px;border-radius:13px;
  border:1px solid var(--border);
  background:#fff;
  box-shadow:var(--shadow-tiny);
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;transition:.15s ease;
  color:#0f172a;
}
.mobile-app .drawer-close:active{transform:scale(.98)}
.mobile-app .drawer-body{
  padding:10px 10px 14px;
  overflow:auto;
}
.mobile-app .drawer-section{
  margin-top:5px;
  padding:8px 10px;
  font-size:11.5px;
  font-weight:900;
  color:#98a2b3;
  text-transform:uppercase;
  letter-spacing:.7px;
}
.mobile-app .ditem{
  display:flex;align-items:center;gap:10px;
  padding:12px 10px;
  border-radius:14px;
  border:1px solid transparent;
  cursor:pointer;
  transition:.15s ease;
  color:#111827;
  font-weight:700;
  font-size:13px;
}
.mobile-app .ditem:hover{background:#f7faf9;border-color:#e6eaee}
.mobile-app .ditem:active{transform:scale(.995)}
.mobile-app .dicon{
  width:30px;height:30px;border-radius:12px;
  border:1px solid #e6eaee;
  background:#f8fafc;
  display:flex;align-items:center;justify-content:center;
  flex:0 0 30px;
  color:#64748b;
  font-size:14px;
}
.mobile-app .ditem.primary{
  background:#f4fef8;border-color:#cfeedd;color:#0f172a;
}
.mobile-app .ditem.primary .dicon{
  background:#eafaf2;border-color:#cfeedd;color:var(--green);
}
.mobile-app .drawer-foot{
  margin-top:auto;
  padding:12px 12px 14px;
  border-top:1px solid var(--border2);
  display:grid;gap:10px;
}
.mobile-app .drawer-cta{
  width:100%;
  border:none;
  border-radius:14px;
  padding:12px 12px;
  font-weight:900;
  cursor:pointer;
  transition:.15s ease;
}
.mobile-app .drawer-cta:active{transform:scale(.99)}
.mobile-app .drawer-cta.green{background:var(--green);color:#fff}
.mobile-app .drawer-cta.ghost{background:#fff;color:#111827;border:1px solid var(--border)}
.mobile-app .drawer-muted{
  font-size:11.5px;color:#94a3b8;font-weight:700;text-align:center;
  padding-top:2px;
}

/* Mobile content */
.mobile-app .hero{padding:14px 14px 8px;background:#f7f8fa}
.mobile-app .hero small{display:block;color:var(--muted);font-size:12.5px;margin-bottom:6px}
.mobile-app .hero h1{font-size:18px;font-weight:700;letter-spacing:-.2px;line-height:1.25;color:#0f172a}

.mobile-app .search{padding:10px 14px 10px;position:relative}
.mobile-app .searchbox{
  display:flex;align-items:center;gap:10px;
  background:#fff;border:1px solid #eef0f3;
  border-radius:14px;
  padding:8px 12px;
  box-shadow:var(--shadow-soft);
  transition:.15s ease;
}
.mobile-app .searchbox.focus{
  border-color:#cfeedd;
  box-shadow:0 0 0 3px rgba(29,191,113,.10), var(--shadow-soft);
}
.mobile-app .searchbox .sicon{width:18px;height:18px;color:#98a2b3;display:inline-flex;align-items:center;justify-content:center;user-select:none}
.mobile-app .searchbox .sicon .ts-search-icon{width:18px;height:18px;display:block}
.mobile-app .searchbox input{border:none;outline:none;background:transparent;flex:1 1 auto;min-width:0;font-size:14px;color:var(--ink);padding:6px 0}
.mobile-app .clear{
  width:34px;height:34px;border-radius:12px;
  border:1px solid var(--border2);
  background:#fff;
  display:none;align-items:center;justify-content:center;
  cursor:pointer;color:#667085;transition:.15s ease;
}
.mobile-app .clear.show{display:flex}
.mobile-app .clear:hover{border-color:var(--border)}
.mobile-app .clear:active{transform:scale(.98)}

.mobile-app .search-actions{display:flex;gap:10px;margin-top:10px;flex-wrap:wrap}
.mobile-app .chip{
  padding:9px 12px;border-radius:999px;background:#fff;border:1px solid #eef0f3;
  font-weight:600;font-size:12.5px;color:#1f2937;cursor:pointer;transition:.15s ease;
  box-shadow:0 6px 16px rgba(15,23,42,.06);
}
.mobile-app .chip:hover{border-color:#d7dbe2}
.mobile-app .chip:active{transform:scale(.99)}
.mobile-app .chip b{color:var(--green)}
.mobile-app .chip.chip-ai{
  display:inline-flex;
  align-items:center;
  gap:4px;
  text-decoration:none;
}
.mobile-app .chip.chip-ai .chip-ai-mark{
  color:var(--green);
  font-weight:800;
}

.mobile-app .suggest{
  margin-top:10px;background:#fff;border:1px solid var(--border);
  border-radius:14px;overflow:hidden;box-shadow:var(--shadow-soft);display:none;
}
.mobile-app .suggest.active{display:block}
.mobile-app .suggest .head{
  padding:10px 12px;display:flex;align-items:center;justify-content:space-between;gap:10px;
  border-bottom:1px solid var(--border2);
}
.mobile-app .suggest .head .t{font-size:12px;font-weight:700;color:#111827}
.mobile-app .suggest .head .clear2{
  border:none;background:transparent;cursor:pointer;font-weight:800;color:#98a2b3;font-size:12.5px;
  padding:6px 8px;border-radius:10px;transition:.15s ease;
}
.mobile-app .suggest .head .clear2:hover{color:var(--green);background:#f4fef8}
.mobile-app .sitem{
  padding:12px 12px;display:flex;align-items:center;gap:10px;
  cursor:pointer;border-bottom:1px solid var(--border2);transition:.12s ease;
}
.mobile-app .sitem:last-child{border-bottom:none}
.mobile-app .sitem:hover{background:#f7faf9}
.mobile-app .sicon2{
  width:28px;height:28px;border-radius:10px;border:1px solid #dff5ea;background:#eafaf2;
  display:flex;align-items:center;justify-content:center;color:var(--green);font-weight:900;flex:0 0 28px;user-select:none;
}
.mobile-app .sname{font-size:13.25px;font-weight:700;color:#111827;line-height:1.2}
.mobile-app .smeta{margin-left:auto;font-size:11.5px;color:var(--muted);font-weight:700;white-space:nowrap}
.mobile-app .kbd{
  margin-left:8px;font-size:10.5px;color:#98a2b3;border:1px solid #e6eaee;background:#f8fafc;
  padding:3px 8px;border-radius:999px;font-weight:800;white-space:nowrap;
}
.mobile-app .nores{
  padding:12px 12px;color:var(--muted);font-size:12.5px;font-weight:600;display:flex;align-items:center;gap:10px;
}
.mobile-app .nores .warn{
  width:28px;height:28px;border-radius:10px;border:1px solid #ffe4b8;background:#fff7e6;
  display:flex;align-items:center;justify-content:center;color:#b7791f;font-weight:900;flex:0 0 28px;
}

.mobile-app .section-head{
  padding:14px 14px 10px;
  display:flex;align-items:flex-end;justify-content:space-between;gap:10px;
}
.mobile-app .section-head h2{font-size:14px;font-weight:700;color:#111827;letter-spacing:-.1px}
.mobile-app .section-head a{font-size:12.5px;font-weight:700;color:var(--muted)}
.mobile-app .section-head a:hover{color:var(--green)}

.mobile-app .mgrid{padding:0 14px 22px;display:grid;grid-template-columns:repeat(2, 1fr);gap:12px}
.mobile-app .mcard{
  background:var(--card);border:1px solid #eef0f3;border-radius:16px;overflow:hidden;cursor:pointer;
  transition:.15s ease;box-shadow:var(--shadow-tiny);
}
.mobile-app .mcard:hover{border-color:#d7dbe2}
.mobile-app .mcard:active{transform:scale(.995)}
.mobile-app .thumb{height:78px;background:#eef2f6;position:relative;overflow:hidden}
.mobile-app .thumb img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(1.02)}
.mobile-app .body{padding:10px 10px 11px}
.mobile-app .title{font-size:13px;font-weight:600;line-height:1.2;color:#111827;min-height:32px}
.mobile-app .meta{
  margin-top:0px;font-size:11.5px;color:var(--muted);
  display:flex;align-items:center;justify-content:space-between;gap:8px;
}
.mobile-app .avg{font-weight:600;color:#98a2b3;font-size:10px}
.mobile-app .avg b{color:var(--green);font-weight:600;margin-left:6px;font-size:11px}
.mobile-app .pill{
  font-size:10px;font-weight:500;color:#0f172a;background:#f3f5f6;border:1px solid #e6eaee;
  padding:4px 8px;border-radius:999px;white-space:nowrap;
}
.mobile-app .pill.hot{background:#eafaf2;border-color:#cfeedd;color:var(--green)}

.mobile-app .empty{
  display:none;margin:0 14px 18px;background:#fff;border:1px solid var(--border);border-radius:14px;padding:12px 12px;
  color:var(--muted);font-size:12.5px;font-weight:600;box-shadow:var(--shadow-tiny);
  align-items:flex-start;gap:10px;
}
.mobile-app .empty.active{display:flex}
.mobile-app .empty .i{
  width:28px;height:28px;border-radius:10px;border:1px solid #ffe4b8;background:#fff7e6;
  display:flex;align-items:center;justify-content:center;color:#b7791f;font-weight:900;flex:0 0 28px;
}

.mobile-app .msteps{padding:0 14px 22px;display:grid;gap:10px}
.mobile-app .mstep{
  background:#fff;border:1px solid #eef0f3;border-radius:16px;box-shadow:var(--shadow-tiny);
  padding:12px 12px;display:flex;gap:10px;align-items:flex-start;
}
.mobile-app .mstep .n{
  width:28px;height:28px;border-radius:10px;background:#eafaf2;border:1px solid #cfeedd;
  display:flex;align-items:center;justify-content:center;color:var(--green);font-weight:900;flex:0 0 28px;
}
.mobile-app .mstep b{display:block;font-size:13px;font-weight:600;color:#111827;margin-top:1px}
.mobile-app .mstep p{margin-top:3px;font-size:12.5px;color:var(--muted);line-height:1.35}

.mobile-app .city-search{padding:0 14px 10px;display:flex;gap:10px;align-items:center}
.mobile-app .city-input{
  flex:1;display:flex;align-items:center;gap:10px;background:#fff;border:1px solid #eef0f3;
  border-radius:14px;padding:10px 12px;box-shadow:var(--shadow-tiny);
}
.mobile-app .city-input .ic{
  color:#98a2b3;
  width:16px;
  height:16px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
}
.mobile-app .city-input .ic .ts-search-icon{width:16px;height:16px;display:block}
.mobile-app .city-input input{border:none;outline:none;background:transparent;width:100%;font-size:13.5px}
.mobile-app .city-btn{
  border:none;padding:10px 14px;border-radius:14px;background:var(--green);color:#fff;font-weight:800;
  cursor:pointer;box-shadow:var(--shadow-tiny);transition:.15s ease;
}
.mobile-app .city-btn:active{transform:scale(.99)}
.mobile-app .city-track{padding:0 14px 18px;display:flex;gap:10px;overflow:auto;scrollbar-width:none}
.mobile-app .city-track::-webkit-scrollbar{display:none}
.mobile-app .city-pill{
  border:1px solid #eef0f3;background:#fff;color:#111827;border-radius:999px;padding:9px 12px;
  font-size:12.5px;font-weight:600;cursor:pointer;box-shadow:var(--shadow-tiny);white-space:nowrap;transition:.15s ease;
}
.mobile-app .city-pill:hover{border-color:#d7dbe2}
.mobile-app .city-pill.active{border-color:#cfeedd;background:#f4fef8;color:var(--green)}

.mobile-app .pro-track{
  padding:0 14px 18px;
  padding-right:26px;
  display:flex;gap:12px;
  overflow:auto;scrollbar-width:none;
  scroll-snap-type:x mandatory;
  scroll-padding-left:14px;
  scroll-padding-right:26px;
}
.mobile-app .pro-track::-webkit-scrollbar{display:none}
.mobile-app .pro-track::after{content:"";flex:0 0 14px}
.mobile-app .pro{
  flex:0 0 74%;
  background:#fff;border:1px solid var(--border);
  border-radius:16px;box-shadow:var(--shadow-tiny);
  padding:12px 12px;scroll-snap-align:start;
}
.mobile-app .pro-top{display:flex;gap:10px;align-items:center}
.mobile-app .ava{
  width:42px;height:42px;border-radius:50%;
  overflow:hidden;background:#eef2f6;border:1px solid var(--border2);
  flex:0 0 42px;
}
.mobile-app .ava img{width:100%;height:100%;object-fit:cover;display:block}
.mobile-app .pname{font-size:13px;font-weight:700;color:#111827;line-height:1.1}
.mobile-app .prate{margin-top:4px;font-size:12px;color:var(--muted);font-weight:700;display:flex;align-items:center;gap:6px}
.mobile-app .stars{color:#f5b301;letter-spacing:.2px}
.mobile-app .ptags{margin-top:10px;display:flex;gap:8px;flex-wrap:wrap}
.mobile-app .tag{
  padding:6px 10px;border-radius:999px;background:#fff;border:1px solid var(--border2);
  font-size:11.5px;font-weight:600;color:#111827;box-shadow:var(--shadow-tiny);
}
.mobile-app .tag.green{background:#eafaf2;border-color:#cfeedd;color:var(--green)}
.mobile-app .pdesc{margin-top:10px;font-size:12.5px;color:var(--muted);line-height:1.4}
.mobile-app .pactions{margin-top:12px;display:flex;gap:10px}
.mobile-app .pbtn{
  flex:1;display:inline-flex;align-items:center;justify-content:center;text-align:center;text-decoration:none;border-radius:14px;padding:10px 12px;font-weight:600;font-size:12.5px;cursor:pointer;border:1px solid var(--border);
  background:#fff;box-shadow:var(--shadow-tiny);transition:.15s ease;
}
.mobile-app .pbtn:active{transform:scale(.99)}
.mobile-app .pbtn.primary{background:var(--green);border-color:var(--green);color:#fff}

/* Grow (MOBIL): desktop .grow kartını sıfırla */
.mobile-app .grow{
  padding:0 14px 22px;
  display:grid;
  gap:10px;
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
  border-radius:0 !important;
}
.mobile-app .gcard{
  background:#fff;border:1px solid rgba(15,23,42,.05);
  border-radius:16px;box-shadow:0 6px 16px rgba(15,23,42,.06);
  padding:12px 12px;display:flex;gap:10px;align-items:flex-start;
}
.mobile-app .gicon{
  width:28px;height:28px;border-radius:10px;background:#f3f5f6;border:1px solid #e6eaee;
  display:flex;align-items:center;justify-content:center;color:#111827;font-weight:700;flex:0 0 28px;
}
.mobile-app .gcard b{display:block;font-size:13px;font-weight:600;color:#111827}
.mobile-app .gcard p{margin-top:3px;font-size:12.5px;color:var(--muted);line-height:1.35}
.mobile-app .cta-row{padding:0 14px 22px}
.mobile-app .cta{
  width:100%;border:none;background:var(--green);color:#fff;border-radius:16px;padding:12px 14px;font-weight:700;
  cursor:pointer;box-shadow:var(--shadow-tiny);transition:.15s ease;
}
.mobile-app .cta:active{transform:scale(.99)}

.mobile-app .reviews{padding:0 14px 22px;display:grid;gap:10px}
.mobile-app .review{
  background:#fff;border:1px solid rgba(15,23,42,.05);
  border-radius:16px;box-shadow:0 6px 16px rgba(15,23,42,.06);
  padding:12px 12px;
}
.mobile-app .rname{font-size:12.75px;font-weight:600;color:#111827}
.mobile-app .rtext{margin-top:4px;font-size:12.5px;color:var(--muted);line-height:1.35}

.mobile-app .faq{padding:0 14px 22px;display:grid;gap:10px}
.mobile-app .faq-item{
  background:#fff;border:1px solid #eef0f3;
  border-radius:16px;box-shadow:var(--shadow-tiny);
  overflow:hidden;
}
.mobile-app .faq-q{
  width:100%;padding:12px 12px;
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  border:none;background:transparent;cursor:pointer;
  font-size:13px;font-weight:600;color:#111827;
}
.mobile-app .chev{
  width:28px;height:28px;border-radius:10px;border:1px solid var(--border2);
  display:flex;align-items:center;justify-content:center;color:#98a2b3;transition:.15s ease;flex:0 0 28px;
}
.mobile-app .faq-a{max-height:0;opacity:0;overflow:hidden;transition:.18s ease;padding:0 12px}
.mobile-app .faq-a p{padding:0 0 12px;font-size:12.5px;color:var(--muted);line-height:1.4}
.mobile-app .faq-item.active .faq-a{max-height:240px;opacity:1}
.mobile-app .faq-item.active .chev{color:var(--green);transform:rotate(180deg);border-color:#cfeedd;background:#f4fef8}

/* Tablet'te mobil home'u daraltma fix (küçük tablet dahil: 600-1024px) */
@media (min-width: 600px) and (max-width: 1024px){
  .mobile-app{
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding-bottom:86px;
  }
  .mobile-app .wrap{
    max-width:none !important;
    width:100% !important;
    margin:0 !important;
    padding:0 14px !important;
  }
}




/* ===== HOME LOADING / SKELETON ===== */
@keyframes ts-home-shimmer{
  0%{background-position:200% 0}
  100%{background-position:-200% 0}
}

.ts-home-card-skel{display:none}

.ts-home-popular-skel{
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:14px;
}

.ts-home-pro-skel{
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px;
}

.ts-home-mobile-popular-skel{
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px;
  padding:0 14px 22px;
}

.ts-home-mobile-pro-skel{
  grid-template-columns:1fr;
  gap:12px;
  padding:0 14px 18px;
}

.ts-home-skel-card,
.ts-home-skel-pro{
  position:relative;
  border:1px solid rgba(15,23,42,.08);
  border-radius:16px;
  background:#fff;
  box-shadow:0 4px 12px rgba(15,23,42,.06);
  overflow:hidden;
  padding:10px;
}

.ts-home-skel-pro{padding:12px}

.ts-home-skel-card .sk,
.ts-home-skel-pro .sk{
  display:block;
  border-radius:10px;
  background:linear-gradient(90deg,rgba(238,242,246,.62) 0%,rgba(247,249,251,.34) 50%,rgba(238,242,246,.62) 100%);
  background-size:200% 100%;
  animation:ts-home-shimmer 1.15s linear infinite;
}

.ts-home-skel-card .sk-media{height:116px}
.ts-home-skel-card .sk-title{height:14px;margin-top:10px;width:82%}
.ts-home-skel-card .sk-sub{height:11px;margin-top:8px;width:48%}

.ts-home-skel-pro-top{display:flex;align-items:center;gap:10px}
.ts-home-skel-pro .sk-ava{width:48px;height:48px;border-radius:999px;flex:0 0 48px}
.ts-home-skel-pro-lines{flex:1;min-width:0}
.ts-home-skel-pro .sk-title{height:13px;width:64%}
.ts-home-skel-pro .sk-sub{height:11px;margin-top:7px;width:44%}
.ts-home-skel-pro .sk-line{height:11px;margin-top:12px;width:92%}
.ts-home-skel-pro .sk-line.short{width:66%;margin-top:8px}

main.home[data-home-loading="1"] .ts-home-popular-grid,
main.home[data-home-loading="1"] .ts-home-pro-track,
main.home[data-home-loading="1"] .ts-home-mobile-popular-grid,
main.home[data-home-loading="1"] .ts-home-mobile-pro-track{
  display:none !important;
}

main.home[data-home-loading="1"] .ts-home-popular-skel,
main.home[data-home-loading="1"] .ts-home-pro-skel,
main.home[data-home-loading="1"] .ts-home-mobile-popular-skel,
main.home[data-home-loading="1"] .ts-home-mobile-pro-skel{
  display:grid !important;
}

main.home[data-home-loading="1"] #m_empty{
  display:none !important;
}

@media (max-width: 1024px){
  .ts-home-popular-skel{grid-template-columns:repeat(3,minmax(0,1fr))}
  .ts-home-pro-skel{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media (max-width: 768px){
  .ts-home-skel-card{border-radius:14px}
  .ts-home-skel-pro{border-radius:14px}
  .ts-home-skel-card .sk-media{height:78px}
}

main.home[data-home-loading="1"] .grid .card,
main.home[data-home-loading="1"] .pro-track .pro-card,
main.home[data-home-loading="1"] .mobile-app .mcard,
main.home[data-home-loading="1"] .mobile-app .pro-track .pro{
  position:relative;
  overflow:hidden;
}

main.home[data-home-loading="1"] .grid .card{min-height:186px}
main.home[data-home-loading="1"] .pro-track .pro-card{min-height:226px}
main.home[data-home-loading="1"] .mobile-app .mcard{min-height:156px}
main.home[data-home-loading="1"] .mobile-app .pro-track .pro{min-height:212px}

main.home[data-home-loading="1"] .grid .card::before,
main.home[data-home-loading="1"] .pro-track .pro-card::before,
main.home[data-home-loading="1"] .mobile-app .mcard::before,
main.home[data-home-loading="1"] .mobile-app .pro-track .pro::before,
[data-media-pending="1"]::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(238,242,246,.58) 0%,rgba(247,249,251,.32) 50%,rgba(238,242,246,.58) 100%);
  background-size:200% 100%;
  animation:ts-home-shimmer 1.15s linear infinite;
  pointer-events:none;
}

.card,
.pro-card,
.mobile-app .mcard,
.mobile-app .pro,
.thumb,
.avatar,
.ava,
.how-img,
.review-top{
  position:relative;
}

.card img,
.thumb img,
.avatar img,
.ava img,
.how-img img,
.review-top img{
  transition:opacity .24s ease, filter .24s ease;
}

[data-media-pending="1"]{
  overflow:hidden;
  background:#eef2f6;
}

[data-media-pending="1"] > img,
img[data-media-loading="1"]{
  opacity:.22;
}

[data-media-ready="1"]::after,
[data-media-error="1"]::after{
  opacity:0;
  animation:none;
}

[data-media-ready="1"] > img,
[data-media-error="1"] > img,
img[data-media-ready="1"],
img[data-media-error="1"]{
  opacity:1;
}

/* =========================================================
   DESKTOP USER-PANEL RESCUE FIX
   - desktop home'u user-panel shell içindeki global css çakışmalarından izole eder
   ========================================================= */
@media (min-width: 901px){
  main.home{
    display:block !important;
    width:100% !important;
    max-width:none !important;
    overflow-x:clip !important;
  }

  main.home > .desktop-app{
    display:block !important;
    width:100% !important;
    max-width:none !important;
    overflow-x:clip !important;
  }

  main.home > .mobile-app{
    display:none !important;
  }

  main.home > .desktop-app *{
    box-sizing:border-box;
  }

  main.home > .desktop-app img{
    display:block;
    max-width:100%;
  }

  main.home > .desktop-app .container{
    width:100% !important;
    max-width:1200px !important;
    margin-left:auto !important;
    margin-right:auto !important;
    padding-left:20px !important;
    padding-right:20px !important;
  }

  main.home > .desktop-app .section{
    padding:72px 0 !important;
  }

  main.home > .desktop-app .section.alt{
    background:#f7f8fa !important;
  }

  main.home > .desktop-app .hero{
    background:linear-gradient(135deg, #1a2a33 0%, #243743 55%, #1c313d 100%) !important;
    color:#fff !important;
    padding:64px 0 34px !important;
  }

  main.home > .desktop-app .hero-grid{
    display:grid !important;
    grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr) !important;
    gap:26px !important;
    align-items:stretch !important;
  }

  main.home > .desktop-app .hero-grid > *{
    min-width:0 !important;
  }

  main.home > .desktop-app .hero h1{
    font-size:34px !important;
    line-height:1.18 !important;
    font-weight:800 !important;
    letter-spacing:-.35px !important;
    margin:0 !important;
  }

  main.home > .desktop-app .hero .sub{
    margin-top:14px !important;
    max-width:560px !important;
    font-size:15px !important;
    line-height:1.68 !important;
    color:rgba(255,255,255,.86) !important;
  }

  main.home > .desktop-app .hero-badges{
    margin-top:18px !important;
    display:flex !important;
    flex-wrap:wrap !important;
    gap:10px !important;
  }

  main.home > .desktop-app .badge{
    display:inline-flex !important;
    align-items:center !important;
    gap:8px !important;
    padding:8px 12px !important;
    border-radius:999px !important;
  }

  main.home > .desktop-app .hero-card{
    padding:16px !important;
    border-radius:18px !important;
  }

  main.home > .desktop-app .search-box{
    display:flex !important;
    align-items:center !important;
    gap:10px !important;
    width:100% !important;
  }

  main.home > .desktop-app .search-box input{
    min-width:0 !important;
    width:100% !important;
  }

  main.home > .desktop-app .hero-helper,
  main.home > .desktop-app .hero-cta-row{
    display:flex !important;
    flex-wrap:wrap !important;
    gap:10px !important;
  }

  main.home > .desktop-app .trust-strip{
    margin-top:18px !important;
    display:grid !important;
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:12px !important;
  }

  main.home > .desktop-app .kpi{
    min-width:0 !important;
  }

  main.home > .desktop-app .popular-head,
  main.home > .desktop-app .cities-head,
  main.home > .desktop-app .pro-head-row{
    display:flex !important;
    align-items:flex-end !important;
    justify-content:space-between !important;
    gap:14px !important;
    flex-wrap:wrap !important;
  }

  main.home > .desktop-app .grid{
    display:grid !important;
    grid-template-columns:repeat(6,minmax(0,1fr)) !important;
    gap:14px !important;
  }

  main.home > .desktop-app .card{
    min-width:0 !important;
    overflow:hidden !important;
  }

  main.home > .desktop-app .card img{
    width:100% !important;
    height:118px !important;
    object-fit:cover !important;
  }

  main.home > .desktop-app .how-wrap{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
    gap:26px !important;
    align-items:center !important;
  }

  main.home > .desktop-app .steps{
    display:grid !important;
    gap:12px !important;
  }

  main.home > .desktop-app .city-search{
    display:flex !important;
    align-items:center !important;
    gap:10px !important;
    flex-wrap:wrap !important;
  }

  main.home > .desktop-app .city-search .input{
    flex:1 1 260px !important;
    min-width:260px !important;
  }

  main.home > .desktop-app .city-grid{
    display:grid !important;
    grid-template-columns:repeat(5,minmax(0,1fr)) !important;
    gap:10px !important;
  }

  main.home > .desktop-app .pro-track{
    display:flex !important;
    gap:14px !important;
    overflow-x:auto !important;
  }

  main.home > .desktop-app .pro-card{
    flex:0 0 calc((100% - 28px)/3) !important;
    min-width:320px !important;
  }

  main.home > .desktop-app .grow-boxes,
  main.home > .desktop-app .reviews-grid{
    display:grid !important;
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:16px !important;
  }

  main.home > .desktop-app .faq{
    max-width:1000px !important;
  }
}

@media (min-width: 901px) and (max-width: 1280px){
  main.home > .desktop-app .grid{
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  }

  main.home > .desktop-app .city-grid{
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  }
}

.search-box .hero-ai-btn{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:40px;
  padding:0 13px;
  border-radius:12px;
  border:1px solid #bfe9d1;
  background:#f4fdf8;
  color:#5d6570;
  text-decoration:none;
  font-size:13px;
  font-weight:800;
  white-space:nowrap;
  box-shadow:0 6px 16px rgba(29,191,113,.10);
  transition:.18s ease;
}
.search-box .hero-ai-btn:hover{
  background:#eafaf2;
  transform:translateY(-1px);
}
.helper-chip b{color:var(--green)}
.mobile-app .chip.chip-service-split{
  display:inline-flex;
  align-items:center;
  gap:4px;
}
.mobile-app .chip.chip-service-split b{color:var(--green)}

@media (max-width: 380px){
  .mobile-app .searchbox{gap:6px;padding-right:8px}
  .mobile-app .searchbox .m-ai-mini-btn{font-size:11.5px;padding:0 8px}
  .mobile-app .clear{flex-basis:26px;width:26px;height:26px}
}

/* FINAL FIX: keep mobile search clear button inside the searchbox */
.mobile-app .searchbox{
  gap:8px;
  padding:8px 10px 8px 12px;
  overflow:hidden;
}
.mobile-app .searchbox input{
  flex:1 1 auto;
  min-width:0;
}
.mobile-app .searchbox .m-ai-mini-btn{
  flex:0 0 auto;
  min-width:38px;
  white-space:nowrap;
}
.mobile-app .clear{
  flex:0 0 28px;
  width:28px;
  height:28px;
  border-radius:999px;
  border:0;
  background:#f8fafc;
  margin-left:0;
}
.mobile-app .clear.show{display:flex}
.mobile-app .clear:hover{background:#eef2f7;color:#334155;border-color:transparent}
@media (max-width: 380px){
  .mobile-app .searchbox{gap:6px;padding-right:8px}
  .mobile-app .searchbox .m-ai-mini-btn{font-size:11.5px;padding:0 8px}
  .mobile-app .clear{flex-basis:26px;width:26px;height:26px}
}


/* =========================================================
   TS MARKET UI STANDARD -> HOME MINIMAL BORDER/SHADOW
   Not: Ölçü, radius, padding, font, renk değiştirmez.
   Sadece border + box-shadow dilini Market kart standardına yaklaştırır.
   ========================================================= */
:root{
  --ts-home-ui-border:#e7eaef;
  --ts-home-ui-border-soft:#edf0f4;
  --ts-home-ui-shadow-soft:0 6px 16px rgba(15,23,42,.045);
  --ts-home-ui-shadow-card:0 10px 28px rgba(15,23,42,.06);
}

/* Searchbox: eski tip/radius/padding korunur, sadece çizgi ve gölge */
.mobile-app .searchbox{
  border-color:var(--ts-home-ui-border) !important;
  box-shadow:var(--ts-home-ui-shadow-soft) !important;
}

.mobile-app .searchbox.focus{
  border-color:#cfeedd !important;
  box-shadow:0 0 0 3px rgba(29,191,113,.10), var(--ts-home-ui-shadow-soft) !important;
}

/* Searchbox içi AI butonu: ölçü/radius korunur, sadece border-shadow */
.mobile-app .searchbox .m-ai-mini-btn{
  border-color:var(--ts-home-ui-border) !important;
  box-shadow:var(--ts-home-ui-shadow-soft) !important;
}

/* Hızlı hizmet chipleri: eski boyut/radius/font korunur */
.mobile-app .chip,
.mobile-app .city-pill,
.mobile-app .tag{
  border-color:var(--ts-home-ui-border) !important;
  box-shadow:var(--ts-home-ui-shadow-soft) !important;
}

/* Popüler hizmet kartları ve genel kartlar: sadece border-shadow */
.mobile-app .mcard,
.mobile-app .mstep,
.mobile-app .pro,
.mobile-app .review,
.mobile-app .faq-item,
.mobile-app .empty,
.mobile-app .suggest{
  border-color:var(--ts-home-ui-border) !important;
  box-shadow:var(--ts-home-ui-shadow-soft) !important;
}

.mobile-app .mcard:hover,
.mobile-app .chip:hover,
.mobile-app .city-pill:hover{
  border-color:#dce2ea !important;
}

/* Küçük kutular / form kutuları: sadece border-shadow */
.mobile-app .city-input,
.mobile-app .clear,
.mobile-app .sitem,
.mobile-app .sicon2,
.mobile-app .mstep .n,
.mobile-app .chev,
.mobile-app .iconbtn,
.mobile-app .drawer-close,
.mobile-app .loc{
  border-color:var(--ts-home-ui-border) !important;
}

.mobile-app .city-input,
.mobile-app .city-btn,
.mobile-app .pbtn,
.mobile-app .cta,
.mobile-app .iconbtn,
.mobile-app .drawer-close,
.mobile-app .loc{
  box-shadow:var(--ts-home-ui-shadow-soft) !important;
}

/* Desktop home tarafında da sadece border-shadow standardı */
.search-box{
  border-color:var(--ts-home-ui-border) !important;
  box-shadow:var(--ts-home-ui-shadow-soft) !important;
}

.search-box .hero-ai-btn,
.search-box button,
.helper-chip{
  border-color:var(--ts-home-ui-border) !important;
  box-shadow:var(--ts-home-ui-shadow-soft) !important;
}

