/* ==========================================================================
   Mobil uygulama kabugu (alt sekme cubugu + tam ekran menu)
   ve detay sayfasi lacivert yan formu.
   site.css'ten SONRA yuklenir.
   ========================================================================== */

.tabbar{display:none}
.mapp{display:none}

/* ---------- Detay sayfasi yan formu: genis, lacivert, modern ---------- */
.layout-aside{grid-template-columns:1fr 400px}

.aside-card:has(.form){
  background:linear-gradient(165deg,#0b1224 0%,#1a1350 60%,#2a1c8f 130%);
  border:0;color:#fff;padding:1.7rem;border-radius:var(--radius-lg);
  box-shadow:var(--shadow-lg);position:sticky;top:96px;overflow:hidden;
}
.aside-card:has(.form)::before{
  content:"";position:absolute;width:300px;height:300px;right:-120px;top:-140px;border-radius:50%;
  background:radial-gradient(circle,rgba(0,179,137,.32),transparent 65%);pointer-events:none;
}
.aside-card:has(.form) > *{position:relative;z-index:1}
.aside-card:has(.form) h3{color:#fff;font-size:1.22rem;margin-bottom:.4rem}
.aside-card:has(.form) > p{color:#b9c1dd;font-size:.9rem}
.aside-card:has(.form) .field label{color:#dfe4f2}
.aside-card:has(.form) .field input,
.aside-card:has(.form) .field select,
.aside-card:has(.form) .field textarea{
  background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.18);color:#fff;
}
.aside-card:has(.form) .field input::placeholder,
.aside-card:has(.form) .field textarea::placeholder{color:#8792b5}
.aside-card:has(.form) .field select option{color:#0b1224}
.aside-card:has(.form) .field input:focus,
.aside-card:has(.form) .field select:focus,
.aside-card:has(.form) .field textarea:focus{
  border-color:var(--accent);background:rgba(255,255,255,.12);
}
.aside-card:has(.form) .btn-primary{background:var(--accent);color:#04241c}
.aside-card:has(.form) .btn-primary:hover{background:#00d3a1;color:#04241c}
.aside-card:has(.form) .form-note{color:#8792b5;font-size:.75rem}
.aside-card:has(.form) .form-note a{color:#cdc6ff;text-decoration:underline}
.aside-card:has(.form) .list-check li{color:#c9cfe4}
.aside-card:has(.form) .alert-ok{background:rgba(0,179,137,.18);border-color:rgba(0,179,137,.5);color:#9df0d6}
.aside-card:has(.form) .alert-err{background:rgba(255,90,90,.14);border-color:rgba(255,120,120,.45);color:#ffc2c2}

/* :has() desteklemeyen tarayicilar icin acik tema geri donusu bozulmaz. */

/* ---------- Mobil ---------- */
@media (max-width:1080px){

  /* Alt sekme cubugu */
  .tabbar{
    position:fixed;left:0;right:0;bottom:0;z-index:95;display:grid;grid-template-columns:repeat(5,1fr);
    background:rgba(255,255,255,.95);backdrop-filter:blur(16px);
    border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom);
    box-shadow:0 -8px 28px rgba(11,18,36,.08);
  }
  .tabbar-item{
    display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;
    padding:.5rem 0 .45rem;border:0;background:none;cursor:pointer;
    color:var(--ink-3);font-family:var(--font-h);font-size:.66rem;font-weight:600;
    text-decoration:none;-webkit-tap-highlight-color:transparent;
  }
  .tabbar-item svg{width:21px;height:21px}
  .tabbar-item:hover{text-decoration:none}
  .tabbar-item.is-active{color:var(--primary-d)}
  .tabbar-menu[aria-expanded="true"]{color:var(--primary-d)}

  body{padding-bottom:calc(62px + env(safe-area-inset-bottom))}
  .wa-float{bottom:calc(74px + env(safe-area-inset-bottom));width:48px;height:48px}

  /* Tam ekran menu sayfasi */
  .mapp{
    display:flex;flex-direction:column;position:fixed;inset:0;z-index:100;background:var(--surface);
    transform:translateY(100%);transition:transform .28s cubic-bezier(.4,0,.2,1);
  }
  .mapp.is-open{transform:translateY(0)}
  .mapp[hidden]{display:none}

  .mapp-top{
    display:flex;align-items:center;justify-content:space-between;gap:1rem;
    padding:calc(.9rem + env(safe-area-inset-top)) 1.1rem .9rem;
    background:#fff;border-bottom:1px solid var(--line);flex:none;
  }
  .mapp-logo{height:22px;width:auto}
  .mapp-close{
    width:38px;height:38px;border:0;border-radius:50%;background:var(--surface-2);
    color:var(--ink);display:grid;place-items:center;cursor:pointer;
  }
  .mapp-scroll{
    flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;
    padding:1.1rem 1.1rem calc(2rem + env(safe-area-inset-bottom));
  }

  .mapp-hero{
    display:block;background:linear-gradient(135deg,#1a1350,#3b1fd6);color:#fff;
    border-radius:20px;padding:1.15rem 1.25rem;text-decoration:none;box-shadow:var(--shadow-lg);
  }
  .mapp-hero:hover{text-decoration:none}
  .mapp-hero-badge{
    display:inline-block;font-size:.66rem;font-weight:700;letter-spacing:.05em;
    background:rgba(255,255,255,.16);padding:.22rem .55rem;border-radius:999px;margin-bottom:.5rem;
  }
  .mapp-hero strong{display:block;font-family:var(--font-h);font-size:1.2rem;line-height:1.2}
  .mapp-hero-sub{display:block;font-size:.83rem;color:#cdc6ff;margin-top:.2rem}

  .mapp-quick{display:grid;grid-template-columns:repeat(4,1fr);gap:.55rem;margin:.9rem 0 1.1rem}
  .mapp-quick a{
    display:flex;flex-direction:column;align-items:center;gap:.35rem;text-decoration:none;
    background:#fff;border:1px solid var(--line);border-radius:16px;padding:.85rem .3rem;
    color:var(--ink);font-family:var(--font-h);font-size:.68rem;font-weight:600;text-align:center;
  }
  .mapp-quick a:hover{text-decoration:none}
  .mapp-quick svg{color:var(--primary-d);width:20px;height:20px}

  .mapp-nav{background:#fff;border:1px solid var(--line);border-radius:18px;overflow:hidden}
  .mapp-row{
    display:flex;align-items:center;gap:.85rem;padding:.95rem 1rem;cursor:pointer;list-style:none;
    color:var(--ink);text-decoration:none;border-bottom:1px solid var(--line);
  }
  .mapp-row:hover{text-decoration:none}
  .mapp-row::-webkit-details-marker{display:none}
  .mapp-nav > .mapp-row:last-child,
  .mapp-group:last-child > .mapp-row{border-bottom:0}
  .mapp-ic{
    width:36px;height:36px;border-radius:11px;background:var(--primary-l);color:var(--primary-d);
    display:grid;place-items:center;flex:none;
  }
  .mapp-ic svg{width:19px;height:19px}
  .mapp-label{flex:1;font-family:var(--font-h);font-weight:700;font-size:.98rem}
  .mapp-arrow{color:var(--ink-3);display:flex}
  .mapp-toggle{transition:transform .2s}
  .mapp-group[open] .mapp-toggle{transform:rotate(90deg)}
  .mapp-group[open] > .mapp-row{background:var(--surface);border-bottom-color:transparent}
  .mapp-sub{background:var(--surface);border-bottom:1px solid var(--line);padding:.25rem .75rem .75rem}
  .mapp-sub a{display:block;padding:.65rem .75rem;border-radius:12px;text-decoration:none;color:var(--ink)}
  .mapp-sub a:active,.mapp-sub a:hover{background:#fff;text-decoration:none}
  .mapp-sub strong{display:block;font-family:var(--font-h);font-size:.92rem;font-weight:700}
  .mapp-sub span{display:block;font-size:.76rem;color:var(--ink-3);line-height:1.35;margin-top:.1rem}

  .mapp-contact{display:grid;gap:.55rem;margin-top:1.1rem}
  .mapp-cbtn{
    display:flex;align-items:center;gap:.7rem;padding:.85rem 1rem;border-radius:15px;
    background:#fff;border:1px solid var(--line);color:var(--ink);text-decoration:none;
    font-family:var(--font-h);font-weight:600;font-size:.92rem;
  }
  .mapp-cbtn:hover{text-decoration:none}
  .mapp-cbtn svg{color:var(--primary-d);flex:none}
  .mapp-cbtn.is-call{background:var(--primary);border-color:var(--primary);color:#fff}
  .mapp-cbtn.is-call svg{color:#fff}
  .mapp-cbtn.is-wa{background:#25D366;border-color:#25D366;color:#fff}
  .mapp-cbtn.is-wa svg{color:#fff}
  .mapp-foot{margin-top:1.25rem;font-size:.74rem;color:var(--ink-3);text-align:center;line-height:1.5}

  /* Eski cekmece devre disi */
  .mobile-nav,.mobile-backdrop,.burger{display:none !important}

  .layout-aside{grid-template-columns:1fr}
  .aside-card:has(.form){position:static}
}