:root{
    /* Varsayılan: AYDINLIK MOD */
    --bg:#f4f6fb; --panel:#ffffff; --panel2:#ffffff; --line:#e3e7f0;
    --ink:#12172b; --sub:#5f6889;
    --c1:#0891b2; --c2:#9333ea; --c3:#db2777;
    --grad: linear-gradient(100deg, var(--c1), var(--c2) 55%, var(--c3));
    --nav-bg: rgba(255,255,255,.85);
    --surface-tint: rgba(18,23,43,.04);
    --surface-tint-hover: rgba(18,23,43,.07);
    --dot-color: rgba(18,23,43,.08);
    --shadow-color: rgba(20,25,50,.14);
    --footer-bg: #ffffff;
    color-scheme: light;
  }

  html[data-theme="dark"]{
    --bg:#0a0e17; --panel:#11172a; --panel2:#151d33; --line:#232c47;
    --ink:#f4f6fb; --sub:#9aa4c2;
    --c1:#22d3ee; --c2:#a855f7; --c3:#f472b6;
    --nav-bg: rgba(10,14,23,.92);
    --surface-tint: rgba(255,255,255,.03);
    --surface-tint-hover: rgba(255,255,255,.05);
    --dot-color: rgba(255,255,255,.06);
    --shadow-color: rgba(0,0,0,.8);
    --footer-bg: #070a11;
    color-scheme: dark;
  }

  body{ transition: background-color .25s ease, color .25s ease; }
  
  /* YATAY TAŞMAYI ENGELLEYEN KRİTİK AYARLAR */
  html, body {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden !important;
    position: relative;
    margin: 0;
    padding: 0;
  }

  *{ scroll-behavior:smooth; box-sizing: border-box; }
  body{ background:var(--bg); color:var(--ink); font-family:'Sora',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Arial,sans-serif; }
  a{ text-decoration:none; }
  .container{ max-width:1180px; width: 100%; padding-left: 15px; padding-right: 15px; }
  .grad-text{ background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent; }
  .reveal{ opacity:0; transform:translateY(16px); transition:opacity .55s ease, transform .55s ease; }
  .reveal.in{ opacity:1; transform:none; }

  .btn-grad{margin-right: 7px;font-size: small; background:var(--grad); border:none; color:#fff; font-weight:700; padding:10px 12px; border-radius:12px; display:inline-flex; align-items:center; gap:8px; transition:.2s; }
  .btn-grad:hover{ filter:brightness(1.08); color:#0a0e17; }
  .btn-ghost{font-size: small; border:1px solid var(--line); color:var(--ink); padding:10px 12px; border-radius:12px; display:inline-flex; align-items:center; gap:8px; background:var(--surface-tint); transition:.2s; }
  .btn-ghost:hover{ border-color:#3d4a75; color:var(--ink); background:var(--surface-tint-hover); }

  /* SABİT VE TAŞMAYAN NAVBAR */
  .navbar {
    position: fixed !important;
    top: 0;
    left: 0;
    width: 100% !important;
    z-index: 1050;
    background: var(--nav-bg) !important;
    backdrop-filter: blur(14px);
    border-bottom: 1px solid var(--line);
    padding: 12px 0;
  }
  
  .navbar .container {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    flex-wrap: nowrap !important;
  }

  .navbar-brand {
    color: var(--ink) !important;
    font-weight: 800;
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 1.1rem;
    white-space: nowrap;
    margin: 0;
  }
  
  .brand-mark {
    width: 32px;
    height: 32px;
    border-radius: 8px;
    background: var(--grad);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #0a0e17;
    font-size: 15px;
    flex-shrink: 0;
  }

  .navbar-toggler {
    border: 1px solid var(--line) !important;
    background: var(--surface-tint-hover);
    padding: 5px 10px;
    border-radius: 8px;
    outline: none !important;
    box-shadow: none !important;
    color: var(--ink);
    font-size: 1.4rem;
  }

  /* Tema değiştirme butonu */
  .theme-toggle{
    border: 1px solid var(--line);
    background: var(--surface-tint);
    color: var(--ink);
    width: 40px; height: 40px;
    border-radius: 10px;
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 1.05rem;
    flex-shrink: 0;
    transition: .2s;
    cursor: pointer;
  }
  .theme-toggle:hover{ background: var(--surface-tint-hover); border-color:#3d4a75; }

  @media (max-width: 991.98px) {
    .navbar-collapse {
      position: absolute;
      top: 100%;
      left: 15px;
      right: 15px;
      background: var(--panel2);
      border: 1px solid var(--line);
      border-radius: 16px;
      padding: 20px;
      margin-top: 10px;
      box-shadow: 0 10px 30px var(--shadow-color);
      max-height: 80vh;
      overflow-y: auto;
    }
  }

  .nav-link{ color:var(--sub) !important; font-weight:600; font-size:.92rem; }
  .nav-link:hover{ color:var(--ink) !important; }

  /* HERO */
  .hero{ position:relative; padding:130px 0 60px; overflow: hidden; }
  .hero::before{
    content:""; position:absolute; inset:0; z-index:0;
    background-image: radial-gradient(circle, var(--dot-color) 1px, transparent 1px);
    background-size:26px 26px; mask-image:radial-gradient(ellipse 70% 60% at 50% 0%, #000 40%, transparent 100%);
  }
  .hero-glow{ position:absolute; width:300px; height:300px; border-radius:50%; filter:blur(90px); opacity:.28; z-index:0; pointer-events:none; }
  .hero-glow.g1{ background:var(--c1); top:-100px; left:-100px; }
  .hero-glow.g2{ background:var(--c2); top:-50px; right:-100px; }
  .hero .container{ position:relative; z-index:1; }
  .kicker{ display:inline-flex; align-items:center; gap:8px; border:1px solid var(--line); background:var(--surface-tint); color:var(--sub); font-size:.78rem; font-weight:600; border-radius:999px; padding:7px 16px; max-width: 100%; }
  .kicker i{ color:var(--c1); }
  .hero h1{ font-size: 2.5rem; font-weight:800; line-height:1.15; letter-spacing:-.03em; margin:20px 0 16px; word-wrap: break-word; }
  .hero p.lead{ color:var(--sub); font-size:1rem; max-width:540px; }
  .hero-cta{ display:flex; gap:12px; flex-wrap:wrap; margin-top:26px; }
  .stat-row{ display:flex; gap:24px; margin-top:36px; flex-wrap:wrap; }
  .stat-row .num{ font-size:1.4rem; font-weight:800; color:var(--ink); }
  .stat-row .lbl{ font-size:.74rem; color:var(--sub); font-weight:600; text-transform:uppercase; letter-spacing:.05em; }

  /* Demo banner */
  .demo-banner{ border:1px solid var(--line); background:linear-gradient(135deg, rgba(34,211,238,.08), rgba(168,85,247,.08)); border-radius:20px; padding:24px 20px; display:flex; align-items:center; gap:16px; margin-top:32px; flex-wrap: wrap; flex:1; min-width:280px; }
  .demo-banners{ display:flex; gap:20px; flex-wrap:wrap; }
  .demo-banner .qricon{ width:56px; height:56px; border-radius:16px; background:var(--grad); display:flex; align-items:center; justify-content:center; color:#0a0e17; font-size:24px; flex-shrink:0; }
  .demo-banner strong{ color:var(--ink); display:block; font-size:1.05rem; font-weight:700; }
  .demo-banner span{ color:var(--sub); font-size:.9rem; line-height:1.4; }
  .demo-banner .btn-ghost{ font-size:.9rem; padding:10px 16px; white-space:nowrap; margin-top:8px; }
  
  @media(max-width:768px){ 
    .demo-banners{ flex-direction:column; gap:16px; }
    .demo-banner{ padding:20px 18px; gap:14px; margin-top:24px; }
    .demo-banner .qricon{ width:52px; height:52px; font-size:22px; }
    .demo-banner strong{ font-size:1rem; }
    .demo-banner span{ font-size:.88rem; }
    .demo-banner .btn-ghost{ font-size:.95rem; padding:12px 20px; margin-top:12px; width:100%; text-align:center; }
  }
  
  /* Phone mock */
  .phone-wrap{ position:relative; width: 100%; max-width: 290px; margin: 0 auto; }
  .phone{ background:#000; border:6px solid #1a2136; border-radius:38px; padding:10px; box-shadow:0 0 0 1px rgba(255,255,255,.04), 0 30px 80px -20px rgba(34,211,238,.25); width: 100%; }
  .phone .scr{ background:#0d1220; border-radius:28px; overflow:hidden; }
  .phone .top{ background:linear-gradient(135deg, var(--c2), var(--c3)); padding:16px; position:relative; }
  .phone .top .pill{ background:rgba(255,255,255,.2); color:#fff; font-size:.62rem; font-weight:700; padding:4px 10px; border-radius:999px; display:inline-block; }
  .phone .top .av{ width:40px;height:40px;border-radius:50%;background:#fff;color:var(--c2);display:flex;align-items:center;justify-content:center;font-weight:800;margin-top:10px; }
  .phone .body{ background:#0d1220; padding:14px; margin-top:-14px; border-radius:18px 18px 0 0; }
  .phone .item{ display:flex; justify-content:space-between; align-items:center; padding:8px 0; border-bottom:1px solid #1c2440; font-size:.72rem; color:#dbe0f0; }
  .phone .item b{ color:#fff; font-weight:800; }
  .phone .item .dot{ width:26px;height:26px;border-radius:8px;background:#161d34;display:flex;align-items:center;justify-content:center;color:var(--c1);margin-right:8px;font-size:.7rem; }
  .phone .navbar-mini{ display:flex; justify-content:space-around; align-items:flex-end; margin-top:12px; padding-top:10px; border-top:1px solid #1c2440; }
  .phone .navbar-mini i{ color:#3d4568; font-size:.9rem; }
  .phone .navbar-mini .a{ color:var(--c1); }
  .phone .navbar-mini .c{ width:30px;height:30px;border-radius:50%;border:2px solid var(--c1);display:flex;align-items:center;justify-content:center;margin-top:-16px;background:#0d1220; }
  .phone .navbar-mini .c i{ color:var(--c1); font-size:.85rem; }

  /* MOBİLDE DIŞARI TAŞAN BALONCUKLARI DÜZELTME */
  .float-tag{ position:absolute; background:var(--panel); border:1px solid var(--line); border-radius:12px; padding:8px 12px; font-size:.68rem; font-weight:700; color:var(--ink); display:flex; gap:6px; align-items:center; box-shadow:0 14px 30px -14px var(--shadow-color); z-index: 2; }
  .float-tag i{ color:var(--c1); }
  .float-tag.t1{ top:5%; left: -10px; }
  .float-tag.t2{ bottom:8%; right: -10px; }

  /* SECTION HEAD */
  /* ---- Fotoğraftan Menü (AI) tanıtım alanı ---- */
  .ai-chip{ display:inline-block; margin-left:6px; padding:1px 7px; border-radius:999px; font-size:.62rem; font-weight:800; letter-spacing:.05em; color:#fff; background:var(--grad); vertical-align:middle; }
  .ai-promo{ border:1px solid var(--line); border-radius:26px; padding:34px; background:linear-gradient(135deg, rgba(34,211,238,.07), rgba(168,85,247,.07) 55%, rgba(244,114,182,.07)); position:relative; overflow:hidden; }
  .ai-promo h3{ color:var(--ink); font-weight:800; letter-spacing:-.02em; font-size:1.7rem; }
  .ai-promo p.lead-s{ color:var(--sub); font-size:.95rem; }
  .ai-points{ list-style:none; padding:0; margin:18px 0 22px; display:grid; gap:12px; }
  .ai-points li{ display:flex; gap:12px; align-items:flex-start; color:var(--ink); font-size:.9rem; }
  .ai-points li > i{ flex:0 0 34px; height:34px; border-radius:10px; background:rgba(168,85,247,.14); color:var(--c2); display:flex; align-items:center; justify-content:center; font-size:1rem; }
  .ai-points li span{ color:var(--sub); display:block; font-size:.82rem; }
  .ai-note{ color:var(--sub); font-size:.78rem; margin-top:12px; }
  .ai-demo{ display:flex; align-items:center; justify-content:center; gap:14px; flex-wrap:wrap; }
  .ai-paper{ width:170px; background:var(--panel); border:1px dashed var(--line); border-radius:14px; padding:14px; box-shadow:0 14px 34px -18px var(--shadow-color); transform:rotate(-3deg); }
  .ai-paper b{ display:block; text-align:center; font-size:.7rem; letter-spacing:.14em; color:var(--sub); margin-bottom:8px; }
  .ai-paper div{ display:flex; justify-content:space-between; font-size:.72rem; color:var(--ink); padding:3px 0; border-bottom:1px dotted var(--line); }
  .ai-arrow{ color:var(--c2); font-size:1.6rem; }
  .ai-cards{ display:grid; gap:10px; width:230px; max-width:100%; }
  .ai-pcard{ background:var(--panel); border:1px solid var(--line); border-radius:12px; padding:10px 12px; box-shadow:0 14px 34px -22px var(--shadow-color); }
  .ai-pcard .t{ display:flex; justify-content:space-between; font-weight:700; font-size:.82rem; color:var(--ink); }
  .ai-pcard .m{ font-size:.68rem; color:var(--sub); margin-top:4px; display:flex; gap:6px; flex-wrap:wrap; }
  .ai-pcard .m em{ font-style:normal; padding:1px 8px; border-radius:999px; background:var(--surface-tint-hover); }
  @media (max-width:575px){ .ai-promo{ padding:22px; } .ai-arrow{ transform:rotate(90deg); } .ai-paper{ transform:none; } }

  .sec-kicker{ color:var(--c1); font-weight:700; font-size:.75rem; letter-spacing:.12em; text-transform:uppercase; }
  .sec-title{ font-size:1.8rem; font-weight:800; letter-spacing:-.02em; color:var(--ink); margin-top:8px; }
  .sec-sub{ color:var(--sub); font-size:.95rem; }

  /* Steps */
  .step{ border:1px solid var(--line); background:var(--panel); border-radius:18px; padding:22px; height:100%; }
  .step .n{ font-size:2rem; font-weight:800; background:var(--grad); -webkit-background-clip:text; background-clip:text; color:transparent; opacity:.85; }
  .step h6{ color:var(--ink); font-weight:700; margin:8px 0 6px; }
  .step p{ color:var(--sub); font-size:.85rem; margin:0; }

  /* Business types strip */
  .biz-strip{ display:flex; gap:12px; overflow-x:auto; padding-bottom:12px; scrollbar-width:none; width: 100%;justify-content: space-evenly; }
  .biz-strip::-webkit-scrollbar{ display:none; }
  .biz-chip{ flex:0 0 auto; border:1px solid var(--line); background:var(--panel); border-radius:16px; padding:16px; min-width:140px; text-align:center; }
  .biz-chip .ic{ width:38px;height:38px;border-radius:12px;background:rgba(34,211,238,.12);color:var(--c1);display:flex;align-items:center;justify-content:center;margin:0 auto 8px;font-size:1.1rem; }
  .biz-chip h6{ color:var(--ink); font-weight:700; margin:0 0 3px; font-size:.85rem; }
  .biz-chip p{ color:var(--sub); font-size:.7rem; margin:0; }

  /* Bento */
  .bento{ border:1px solid var(--line); background:var(--panel); border-radius:20px; padding:22px; height:100%; position:relative; overflow:hidden; }
  .bento .ic{ width:42px;height:42px;border-radius:12px;background:rgba(168,85,247,.14);color:var(--c2);display:flex;align-items:center;justify-content:center;font-size:1.2rem;margin-bottom:14px; }
  .bento h5{ color:var(--ink); font-weight:700; font-size: 1.1rem; }
  .bento p{ color:var(--sub); font-size:.85rem; margin:0; }
  .bento.big{ background:linear-gradient(135deg, rgba(34,211,238,.06), rgba(244,114,182,.06)); }

  /* Pricing */
  .cycle-toggle{ background:var(--panel); border:1px solid var(--line); border-radius:14px; padding:4px; display:inline-flex; gap:4px; max-width:100%; overflow-x:auto; }
  .cycle-toggle button{ border:none; background:transparent; color:var(--sub); font-weight:700; font-size:.78rem; padding:8px 14px; border-radius:10px; white-space:nowrap; }
  .cycle-toggle button.active{ background:var(--grad); color:#0a0e17; }
  .price-card{ border:1px solid var(--line); background:var(--panel); border-radius:22px; padding:24px; height:100%; position:relative; }
  .price-card.featured{ border-color:var(--c1); background:linear-gradient(160deg, rgba(34,211,238,.08), var(--panel) 60%); }
  .price-tag{ position:absolute; top:-12px; left:24px; background:var(--grad); color:#0a0e17; font-size:.65rem; font-weight:800; padding:4px 12px; border-radius:999px; }
  .price-card h4{ color:var(--ink); font-weight:800; margin-bottom:6px; }
  .price-desc{ color:var(--sub); font-size:.82rem; }
  .price-amt{ margin:16px 0; text-align:center; }
  .price-value{ font-size:2rem; font-weight:800; color:var(--ink); }
  .price-cycle{ color:var(--sub); font-size:.85rem; }
  .price-btn{ display:block; text-align:center; border:1px solid var(--line); color:var(--ink); padding:10px; border-radius:12px; font-weight:700; font-size:.85rem; margin-bottom:20px; }
  .price-btn.solid{ background:var(--grad); color:#fff; border:none; }
  .price-list{ list-style:none; padding:0; margin:0; }
  .price-list li{ display:flex; align-items:flex-start; gap:8px; font-size:.8rem; color:var(--ink); padding:5px 0; }
  .price-list li i{ color:var(--c1); margin-top:2px; }
  .price-list li.off{ color:#5b6485;text-decoration: line-through; }
  .price-list li.off i{ color:#3d4568; }

  /* FAQ */
  .faq{ border:1px solid var(--line); background:var(--panel); border-radius:16px; margin-bottom:10px; }
  .faq-q{ padding:16px 18px; font-weight:700; color:var(--ink); display:flex; justify-content:space-between; align-items:center; cursor:pointer; font-size:.9rem; }
  .faq-q i{ color:var(--c1); transition:.25s; flex-shrink:0; }
  .faq.open .faq-q i{ transform:rotate(180deg); }
  .faq-a{ max-height:0; overflow:hidden; transition:max-height .3s ease; }
  .faq-a p{ padding:0 18px 18px; color:var(--sub); font-size:.85rem; margin:0; }

  /* CTA */
  .cta-block{ border:1px solid var(--line); border-radius:24px; padding:40px 20px; text-align:center; position:relative; overflow:hidden; background:var(--panel); }
  .cta-block h3{ color:var(--ink); font-weight:800; font-size:1.6rem; }
  .cta-block p{ color:var(--sub); font-size:.9rem; }
  .cta-block .hero-cta{ justify-content:center; }

  footer{ background:var(--footer-bg); border-top:1px solid var(--line); color:var(--sub); }
  footer a{ color:var(--ink); }
  footer h6{ color:var(--ink); font-weight:700; font-size:.8rem; text-transform:uppercase; letter-spacing:.06em; margin-bottom:14px; }
  footer ul{ list-style:none; padding:0; margin:0; }
  footer li{ margin-bottom:8px; font-size:.85rem; }

  @media (max-width:767px){
    .hero{ padding:100px 0 40px; text-align:center; }
    .hero h1{ font-size: 2rem; }
    .hero p.lead{ margin:0 auto; }
    .hero-cta{ justify-content:center; }
    .hero-cta a{ width: 100%; justify-content: center; }
    .stat-row{ justify-content:center; }
    .phone-wrap{ margin-top:30px; }
    .demo-banner{ text-align: left; }
    .demo-banner .btn-ghost{ width: 100%; justify-content: center; }
  }

  .mobile-swiper{ padding-bottom:34px; }
  .mobile-swiper .swiper-slide{ height:auto; }
  .mobile-swiper .swiper-pagination-bullet{ background:#2a3454; opacity:1; }
  .mobile-swiper .swiper-pagination-bullet-active{ background:var(--c1); }
  #bentoSwiper .swiper-slide{ width:100%!important; }
  #pricingSwiper .swiper-slide{ width:88%; }

	@media screen and (max-width: 768px) {
	  .nomobile {
	    display: none;
	  }
	}