:root{
      --text:#e8eefc;
      --muted:#a8b3cf;
      --line:rgba(255,255,255,.10);
      --accent:#374151; /* grid gri */
      --accent2:#6b7280;
      --good:#22c55e;
      --warn:#f59e0b;
      --bad:#ef4444;
      --whatsapp:#25D366;
      --shadow:0 18px 50px rgba(0,0,0,.35);
      --radius:18px;
      --max:1100px;
      --header-h:72px;
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;
      font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
      color:var(--text);
      background:
        radial-gradient(1200px 600px at 20% 10%, rgba(55,65,81,.35), transparent 55%),
        radial-gradient(900px 500px at 80% 0%, rgba(107,114,128,.28), transparent 55%),
        linear-gradient(180deg, #071022, #060b16 60%, #050812);
      line-height:1.45;
    }
    a{color:inherit;text-decoration:none}
    .container{width:100%;max-width:var(--max);margin:0 auto;padding:0 18px}

    /* Header */
    header{
      position:sticky;top:0;z-index:50;
      background:rgba(6,10,18,.72);
      border-bottom:1px solid var(--line);
      backdrop-filter: blur(12px);
    }
    .nav{
      min-height:var(--header-h);
      display:flex;align-items:center;justify-content:space-between;
      gap:14px;
      padding:14px 0;
    }
    .brand{display:flex;align-items:center;gap:12px;font-weight:900;letter-spacing:.3px;flex:0 0 auto}
    .logo{
      width:36px;height:36px;border-radius:12px;
      background:linear-gradient(135deg, rgba(55,65,81,.95), rgba(107,114,128,.55));
      border:1px solid rgba(255,255,255,.12);
      box-shadow:0 10px 30px rgba(0,0,0,.25);
      flex:0 0 36px;
    }
    .brand .brandtext{font-size:22px;white-space:nowrap}

    nav{flex:1 1 auto;min-width:0}
    nav ul{
      list-style:none;
      display:flex;
      gap:10px;
      margin:0;padding:0;
      align-items:center;
      justify-content:center;
      flex-wrap:nowrap;     /* IMPORTANT: never wrap */
      white-space:nowrap;
      overflow:hidden;
    }
    nav a{
      font-size:13px;color:var(--muted);
      padding:10px 10px;border-radius:10px;
      white-space:nowrap;
      flex:0 0 auto;
    }
    nav a:hover{background:rgba(255,255,255,.06);color:var(--text)}

    .nav-actions{display:flex;gap:10px;align-items:center;flex:0 0 auto;flex-wrap:nowrap}

    .btn{
      display:inline-flex;align-items:center;justify-content:center;gap:10px;
      padding:12px 14px;border-radius:12px;
      border:1px solid rgba(255,255,255,.12);
      background:rgba(255,255,255,.06);
      color:var(--text);
      font-weight:900;font-size:13px;
      cursor:pointer;
      transition:.18s transform, .18s background, .18s border-color;
      user-select:none;
      white-space:nowrap;
    }
    .btn:hover{transform:translateY(-1px);background:rgba(255,255,255,.09)}
    .btn-primary{
      background:linear-gradient(135deg, rgba(55,65,81,1), rgba(107,114,128,.72));
      border-color:rgba(255,255,255,.18);
      box-shadow:0 16px 40px rgba(0,0,0,.28);
    }
    .btn-primary:hover{background:linear-gradient(135deg, rgba(55,65,81,1), rgba(107,114,128,.85))}
    .btn-wa{
      background:linear-gradient(135deg, rgba(37,211,102,.95), rgba(55,65,81,.55));
      border-color:rgba(255,255,255,.18);
    }
    .btn-wa:hover{background:linear-gradient(135deg, rgba(37,211,102,1), rgba(55,65,81,.62))}
    .btn-danger{
      background:linear-gradient(135deg, rgba(239,68,68,.95), rgba(245,158,11,.50));
      border-color:rgba(255,255,255,.18);
    }
    .btn-danger:hover{background:linear-gradient(135deg, rgba(239,68,68,1), rgba(245,158,11,.62))}
    .btn-icon{width:44px;height:44px;padding:0;border-radius:14px}
    .btn svg{width:18px;height:18px;flex:0 0 18px}

    /* Hamburger */
    .hamburger{
      display:none;
      width:44px;height:44px;border-radius:14px;
      border:1px solid rgba(255,255,255,.12);
      background:rgba(255,255,255,.06);
      place-items:center;
      cursor:pointer;
    }
    .hamburger span{
      width:18px;height:2px;background:rgba(232,238,252,.9);
      display:block;position:relative;border-radius:99px;
    }
    .hamburger span:before,.hamburger span:after{
      content:"";position:absolute;left:0;width:18px;height:2px;border-radius:99px;
      background:rgba(232,238,252,.9);
    }
    .hamburger span:before{top:-6px}
    .hamburger span:after{top:6px}

    /* Mobile drawer */
    .drawer{
      display:none;
      border-top:1px solid var(--line);
      background:rgba(6,10,18,.86);
      backdrop-filter: blur(12px);
    }
    .drawer-inner{padding:14px 0 18px;display:grid;gap:12px}
    .drawer .menu{display:flex;flex-wrap:wrap;gap:10px}
    .drawer .menu a{
      border:1px solid rgba(255,255,255,.10);
      background:rgba(255,255,255,.05);
      padding:10px 12px;border-radius:12px;
      color:rgba(232,238,252,.92);
      font-weight:800;font-size:13px;
    }
    .drawer .menu a:hover{background:rgba(255,255,255,.08)}
    .drawer .actions{display:flex;flex-wrap:wrap;gap:10px}

    /* ===== Everything below here is the original page styling from v3 (kept) ===== */

    :root{
      --text:#e8eefc;
      --muted:#a8b3cf;
      --line:rgba(255,255,255,.10);
      --accent:#374151; /* grid gri */
      --accent2:#6b7280;
      --good:#22c55e;
      --warn:#f59e0b;
      --bad:#ef4444;
      --whatsapp:#25D366;
      --shadow:0 18px 50px rgba(0,0,0,.35);
      --radius:18px;
      --max:1100px;
      --header-h:72px;
    }
    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    body{
      margin:0;
      font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, "Apple Color Emoji","Segoe UI Emoji";
      color:var(--text);
      background:
        radial-gradient(1200px 600px at 20% 10%, rgba(55,65,81,.35), transparent 55%),
        radial-gradient(900px 500px at 80% 0%, rgba(107,114,128,.28), transparent 55%),
        linear-gradient(180deg, #071022, #060b16 60%, #050812);
      line-height:1.45;
    }
    a{color:inherit;text-decoration:none}
    .container{width:100%;max-width:var(--max);margin:0 auto;padding:0 18px}

    /* Content */
    .pill{
      display:inline-flex;align-items:center;gap:10px;
      border:1px solid var(--line);
      background:rgba(255,255,255,.04);
      color:var(--muted);
      padding:8px 12px;border-radius:999px;
      font-size:13px;
      backdrop-filter: blur(10px);
    }
    .dot{width:8px;height:8px;border-radius:99px;background:var(--good);box-shadow:0 0 0 6px rgba(34,197,94,.12)}
    .hero{padding:58px 0 28px;position:relative}
    .hero-grid{display:grid;grid-template-columns: 1.25fr .85fr;gap:22px;align-items:stretch}
    h1{margin:14px 0 10px;font-size:42px;line-height:1.08;letter-spacing:-.9px}
    .sub{font-size:16px;color:var(--muted);max-width:60ch;margin:0 0 18px}
    .cta-row{display:flex;gap:12px;flex-wrap:wrap;margin-top:18px}
    .hero-card{
      background:linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
      border:1px solid rgba(255,255,255,.10);
      border-radius:var(--radius);
      box-shadow:var(--shadow);
      padding:18px;
      position:relative;
      overflow:hidden;
    }
    .hero-card:before{
      content:"";
      position:absolute;inset:-1px;
      background:radial-gradient(600px 300px at 30% 10%, rgba(55,65,81,.38), transparent 60%);
      pointer-events:none;
    }
    .hero-card > *{position:relative}
    .kpi{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:14px}
    .kpi .box{
      background:rgba(0,0,0,.20);
      border:1px solid rgba(255,255,255,.10);
      border-radius:14px;
      padding:12px;
    }
    .kpi .num{font-size:18px;font-weight:900}
    .kpi .lbl{font-size:12px;color:var(--muted);margin-top:4px}
    .tagline{
      margin-top:10px;
      padding:12px 14px;border-radius:14px;
      border:1px dashed rgba(255,255,255,.18);
      background:rgba(55,65,81,.12);
      color:rgba(232,238,252,.92);
      font-weight:900;
    }
    .note{
      margin-top:12px;
      display:flex;gap:10px;align-items:flex-start;
      border:1px solid rgba(255,255,255,.10);
      background:rgba(0,0,0,.18);
      border-radius:16px;
      padding:12px 14px;
      color:rgba(232,238,252,.92);
    }
    .note .badge{
      width:28px;height:28px;border-radius:12px;
      display:grid;place-items:center;
      background:rgba(37,211,102,.14);
      border:1px solid rgba(37,211,102,.30);
      color:#bbf7d0;font-weight:900;
      flex:0 0 28px;
    }
    .note .t{font-size:13px;color:var(--muted)}
    .section{padding:34px 0}
    .section h2{margin:0 0 10px;font-size:26px;letter-spacing:-.4px}
    .section p.lead{margin:0 0 18px;color:var(--muted);max-width:74ch}
    .grid{display:grid;gap:14px}
    .grid.cols-3{grid-template-columns:repeat(3,1fr)}
    .grid.cols-2{grid-template-columns:repeat(2,1fr)}
    .card{
      border-radius:var(--radius);
      border:1px solid rgba(255,255,255,.10);
      background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.025));
      padding:18px;
      box-shadow:0 14px 40px rgba(0,0,0,.22);
    }
    .card.small{padding:16px}
    .icon{
      width:40px;height:40px;border-radius:14px;
      display:grid;place-items:center;
      background:rgba(55,65,81,.24);
      border:1px solid rgba(255,255,255,.12);
      margin-bottom:10px;
      font-size:18px;
    }
    .card h3{margin:0 0 8px;font-size:16px}
    .card p{margin:0;color:var(--muted);font-size:14px}
    .list{margin:10px 0 0;padding:0;list-style:none;display:grid;gap:10px}
    .list li{display:flex;gap:10px;align-items:flex-start;color:rgba(232,238,252,.92)}
    .check{
      margin-top:2px;width:18px;height:18px;border-radius:6px;
      display:grid;place-items:center;
      background:rgba(34,197,94,.16);
      border:1px solid rgba(34,197,94,.28);
      flex:0 0 18px;font-size:12px;color:#bbf7d0;
    }
    .check.bad{background:rgba(245,158,11,.12);border:1px solid rgba(245,158,11,.25);color:#fde68a}
    .split{display:grid;grid-template-columns:1.05fr .95fr;gap:14px;align-items:start}
    .callout{
      border:1px solid rgba(255,255,255,.12);
      background:linear-gradient(135deg, rgba(55,65,81,.28), rgba(255,255,255,.04));
      border-radius:var(--radius);
      padding:18px;
      box-shadow:var(--shadow);
    }
    .callout strong{font-weight:900}
    .callout .mini{margin-top:10px;color:var(--muted);font-size:14px}

    .trust{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:14px}
    .trust .tcard{
      border-radius:16px;border:1px solid rgba(255,255,255,.10);
      background:rgba(0,0,0,.18);padding:14px;
    }
    .trust .tcard b{display:block;font-size:14px;margin-bottom:6px}
    .trust .tcard span{color:var(--muted);font-size:12px}

    .ref-grid{display:grid;grid-template-columns:repeat(4, 1fr);gap:12px}
    .ref{
      border-radius:16px;border:1px solid rgba(255,255,255,.10);
      background:rgba(0,0,0,.18);
      padding:14px;min-height:74px;
      display:flex;align-items:center;justify-content:center;
      color:rgba(232,238,252,.78);
      font-weight:900;letter-spacing:.2px;text-align:center;
    }
    .ref:hover{background:rgba(255,255,255,.06)}
    .hint{font-size:12px;color:rgba(168,179,207,.95);margin-top:10px}

    .promise{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:14px}
    .promise .box{
      border-radius:18px;border:1px solid rgba(255,255,255,.10);
      background:linear-gradient(135deg, rgba(37,211,102,.10), rgba(55,65,81,.12));
      padding:16px;
    }
    .promise .box h3{margin:0 0 6px;font-size:16px}
    .promise .box p{margin:0;color:var(--muted);font-size:13px}

    .footer{padding:26px 0 36px;border-top:1px solid var(--line);color:var(--muted);font-size:13px}

    /* Floating */
    .float{position:fixed;right:18px;bottom:18px;z-index:60;display:flex;flex-direction:column;gap:10px}
    .fab{
      width:54px;height:54px;border-radius:18px;display:grid;place-items:center;
      border:1px solid rgba(255,255,255,.14);
      background:rgba(255,255,255,.08);
      backdrop-filter: blur(10px);
      box-shadow:0 18px 40px rgba(0,0,0,.32);
      cursor:pointer;
      transition:.18s transform, .18s background;
      font-size:20px;
    }
    .fab:hover{transform:translateY(-2px);background:rgba(255,255,255,.11)}
    .fab-wa{background:rgba(37,211,102,.12);border-color:rgba(37,211,102,.25)}
    .fab-wa:hover{background:rgba(37,211,102,.18)}
    .fab svg{width:22px;height:22px}

    /* RESPONSIVE: Fix overflow + perfect mobile */
    @media (max-width: 1100px){
      .brand{min-width:auto}
      .brand span{font-size:20px}
      nav ul{gap:6px}
      nav a{padding:9px 8px}
      .btn{padding:11px 12px}
    }
    @media (max-width: 980px){
      nav{display:none}           /* hide inline menu */
      .hamburger{display:grid}   /* show hamburger */
      .btn span.txt{display:none}/* optional for icon-only buttons if used */
      .nav-actions .btn{padding:11px 12px}
    }
    @media (max-width: 700px){
      :root{--header-h:64px}
      .brand span{font-size:18px}
      .logo{width:32px;height:32px;flex:0 0 32px}
      h1{font-size:34px}
      .hero-grid,.split{grid-template-columns:1fr}
      .grid.cols-3{grid-template-columns:1fr}
      .grid.cols-2{grid-template-columns:1fr}
      .ref-grid{grid-template-columns:repeat(2, 1fr)}
      .trust{grid-template-columns:repeat(2,1fr)}
      .promise{grid-template-columns:1fr}
      .nav-actions{gap:8px}
      .nav-actions .btn{
        padding:10px 10px;
        font-size:13px;
      }
      /* Make actions not overflow: keep only 2 main CTAs on the top row */
      .nav-actions a.btn:nth-child(2), /* tel */
      .nav-actions a.btn:nth-child(3)  /* whatsapp */
      {display:none}
    }
  
  
/* ===== Mini Garanti (Fiyat konuşmadan ikna) ===== */
.guarantee-wrap{
  border:1px solid rgba(255,255,255,.12);
  background:linear-gradient(135deg, rgba(55,65,81,.22), rgba(0,0,0,.18));
  border-radius:18px;
  padding:18px;
  box-shadow:0 18px 50px rgba(0,0,0,.30);
}
.guarantee-badge{
  display:inline-flex;
  padding:8px 12px;
  border-radius:999px;
  font-weight:900;
  letter-spacing:.4px;
  font-size:12px;
  color:#bbf7d0;
  background:rgba(34,197,94,.12);
  border:1px solid rgba(34,197,94,.24);
}
.guarantee-title{margin:12px 0 8px;font-size:22px;letter-spacing:-.3px}
.guarantee-lead{margin:0 0 14px;color:var(--muted);max-width:78ch}

.guarantee-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0,1fr));
  gap:12px;
}
.guarantee-card{
  border:1px solid rgba(255,255,255,.10);
  background:rgba(0,0,0,.18);
  border-radius:16px;
  padding:14px;
  display:grid;
  gap:6px;
}
.guarantee-card .g-ico{font-size:18px}
.guarantee-card b{font-size:14px}
.guarantee-card span{font-size:13px;color:var(--muted);line-height:1.35}

.guarantee-cta{
  margin-top:14px;
  display:flex;
  gap:12px;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
}
.guarantee-mini{
  border:1px dashed rgba(255,255,255,.18);
  background:rgba(255,255,255,.04);
  border-radius:14px;
  padding:12px 14px;
  min-width:260px;
  flex:1 1 260px;
}
.guarantee-mini b{display:block}
.guarantee-mini span{display:block;color:var(--muted);font-size:13px;margin-top:4px}

.guarantee-foot{
  margin-top:12px;
  color:rgba(168,179,207,.95);
  font-size:12px;
}
.guarantee-foot span{font-weight:900;color:rgba(232,238,252,.9)}

@media (max-width: 700px){
  .guarantee-title{font-size:20px}
  .guarantee-grid{grid-template-columns:1fr}
}


/* ===== Mobile header polish (no broken CTA) ===== */
@media (max-width: 520px){
  /* keep header minimal: logo + hamburger + whatsapp(icon) */
  .nav-actions a.btn-primary{display:none !important;} /* hide top consult button */
  .nav-actions a.btn-wa{padding:10px 10px !important;}
  .nav-actions a.btn-wa{width:44px;height:44px;border-radius:14px;justify-content:center;}
  .nav-actions a.btn-wa{gap:0;}
  .nav-actions a.btn-wa svg{width:20px;height:20px;}
  .nav-actions a.btn-wa{font-size:0;} /* hide text safely */
}
@media (max-width: 520px){
  /* if any phone button exists in header, hide it */
  .nav-actions a.btn-tel{display:none !important;}
}


/* ===== Drawer mobile spacing (less cramped) ===== */
@media (max-width: 700px){
  .drawer-inner{padding:18px 0 22px !important; gap:14px !important;}
  .drawer .menu{
    display:grid !important;
    grid-template-columns:repeat(2, minmax(0,1fr)) !important;
    gap:10px !important;
  }
  .drawer .menu a{
    padding:12px 12px !important;
    border-radius:14px !important;
    text-align:center !important;
  }
  .drawer .actions{
    display:flex !important;
    flex-direction:column !important;
    gap:12px !important;
  }
  .drawer .actions .btn{
    width:100% !important;
    justify-content:center !important;
    padding:14px 14px !important;
    border-radius:16px !important;
  }
}
}


/* ===== Drawer: "dağınık ama şık" görünüm (ferah, sıkışık değil) ===== */
@media (max-width: 700px){
  .drawer-inner{padding:18px 0 22px !important; gap:14px !important;}

  /* Menüyü tekrar dağınık/pill yap: wrap + farklı genişlikler */
  .drawer .menu{
    display:flex !important;
    flex-wrap:wrap !important;
    gap:12px !important;
    align-items:flex-start !important;
  }
  .drawer .menu a{
    padding:12px 14px !important;
    border-radius:16px !important;
    text-align:left !important;
    width:auto !important;
    max-width:100% !important;
  }

  /* Hafif "dağınık" hissi için değişken genişlik + ufak offset */
  .drawer .menu a{flex: 0 1 calc(50% - 6px) !important;}
  .drawer .menu a:nth-child(3){flex-basis: 100% !important;}
  .drawer .menu a:nth-child(2){margin-top:6px !important;}
  .drawer .menu a:nth-child(5){margin-top:8px !important;}
  .drawer .menu a:nth-child(6){margin-top:2px !important;}

  /* CTA butonlar: dokunması kolay, alt alta */
  .drawer .actions{
    display:flex !important;
    flex-direction:column !important;
    gap:12px !important;
  }
  .drawer .actions .btn{
    width:100% !important;
    justify-content:center !important;
    padding:14px 14px !important;
    border-radius:16px !important;
  }
}
}


/* ===== Drawer layout: screenshot-like (3 pills row + centered CTAs) ===== */
@media (max-width: 700px){
  .drawer-inner{padding:18px 0 22px !important; gap:14px !important;}

  /* Pills: neat 3 columns like the screenshot */
  .drawer .menu{
    display:grid !important;
    grid-template-columns:repeat(3, minmax(0,1fr)) !important;
    gap:12px !important;
    align-items:stretch !important;
  }
  .drawer .menu a{
    width:100% !important;
    text-align:center !important;
    padding:12px 10px !important;
    border-radius:18px !important;
    font-weight:900 !important;
  }

  /* CTA buttons: centered stack, with 3rd a bit smaller (like screenshot) */
  .drawer .actions{
    display:flex !important;
    flex-direction:column !important;
    gap:14px !important;
    align-items:flex-start !important;
    width:100% !important;
    margin-top:6px !important;
  }
  .drawer .actions .btn{
    width:100% !important;
    justify-content:flex-start !important;
    padding:16px 16px !important;
    border-radius:18px !important;
  }
  .drawer .actions .btn:nth-child(2){
    justify-content:flex-start !important;
  }
  .drawer .actions .btn:nth-child(3){
    width:72% !important;  /* smaller third button */
    justify-content:flex-start !important;
  }
}

/* Smaller phones: 2 columns pills */
.drawer .actions .btn:nth-child(3){width:100% !important;}
}


/* ===== Drawer menu button equalization (fix 'Paket Yok') ===== */
@media (max-width: 700px){
  .drawer .menu{
    grid-auto-rows: 1fr !important;
  }
  .drawer .menu a{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    min-height:56px !important;
    line-height:1.1 !important;
    white-space:nowrap !important;
  }
}


/* ===== Drawer menu: TRUE equal width & height buttons ===== */
@media (max-width: 700px){
  .drawer .menu{
    display:grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap:14px !important;
  }
  .drawer .menu a{
    width:100% !important;
    min-height:64px !important;
    height:64px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    text-align:center !important;
    padding:0 12px !important;
    border-radius:22px !important;
    box-sizing:border-box !important;
  }
}


/* ===== Drawer menu: HARD RESET (force equal buttons, overrides all previous) ===== */
@media (max-width: 700px){
  .drawer .menu{
    display:grid !important;
    grid-template-columns: 1fr 1fr !important;
    grid-auto-rows: 64px !important;
    gap:14px !important;
    align-items:stretch !important;
    justify-items:stretch !important;
  }
  .drawer .menu a{
    /* reset any previous flex/wrap rules */
    flex:none !important;
    flex-basis:auto !important;
    margin:0 !important;
    max-width:none !important;

    /* equal box */
    width:100% !important;
    height:64px !important;
    min-height:64px !important;
    padding:0 12px !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    text-align:center !important;

    border-radius:22px !important;
    line-height:1.1 !important;
    white-space:nowrap !important;
  }
}
}


/* ===== Drawer menu: dağınık hissi + hepsi eşit (2 sütun) ===== */
@media (max-width: 700px){
  .drawer .menu{
    display:grid !important;
    grid-template-columns: 1fr 1fr !important;
    grid-auto-rows: 64px !important;
    gap:14px !important;
    align-items:stretch !important;
    justify-items:stretch !important;
  }
  .drawer .menu a{
    width:100% !important;
    height:64px !important;
    min-height:64px !important;
    padding:0 14px !important;

    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    text-align:center !important;

    border-radius:22px !important;

    /* keep equal size but add playful "scatter" vibe */
    transform: translateY(0) rotate(0deg) !important;
  }

  /* Small, tasteful offsets that DON'T change box sizes */
  .drawer .menu a:nth-child(1){transform: translateY(2px) rotate(-0.6deg) !important;}
  .drawer .menu a:nth-child(2){transform: translateY(-3px) rotate(0.6deg) !important;}
  .drawer .menu a:nth-child(3){transform: translateY(4px) rotate(0.4deg) !important;}
  .drawer .menu a:nth-child(4){transform: translateY(-2px) rotate(-0.4deg) !important;}
  .drawer .menu a:nth-child(5){transform: translateY(3px) rotate(-0.5deg) !important;}
  .drawer .menu a:nth-child(6){transform: translateY(-4px) rotate(0.5deg) !important;}

  /* A bit more breathing room between menu and CTAs */
  .drawer .actions{margin-top:10px !important;}
}

/* Very small phones: 1 column, still equal height */
.drawer .menu a{height:62px !important; min-height:62px !important; border-radius:20px !important;}
}


/* ===== Small phones: still 2 columns, tighter ===== */
@media (max-width: 420px){
  .drawer .menu{
    grid-template-columns: 1fr 1fr !important;
    gap:12px !important;
  }
  .drawer .menu a{
    height:58px !important;
    min-height:58px !important;
    border-radius:20px !important;
    font-size:13px !important;
    padding:0 10px !important;
  }
}

/* Custom logo fit */
.custom-logo-link{display:inline-flex;align-items:center;}
.custom-logo{height:var(--logo-h,44px);width:auto;max-width:160px;object-fit:contain;border-radius:12px;}
@media (max-width:520px){.custom-logo{height:calc(var(--logo-h,44px) - 6px);max-width:140px;}}

/* Title hide support */
.brand{gap:12px;}
.brand .brandtext{white-space:nowrap;}

/* Custom logo sizing (works for SVG/PNG/JPG) */
.custom-logo-link{display:inline-flex;align-items:center;max-width:var(--logo-w,160px);}
.custom-logo{
  height:var(--logo-h,44px) !important;
  width:auto !important;
  max-width:var(--logo-w,160px) !important;
  max-height:var(--logo-h,44px) !important;
  object-fit:contain;
  border-radius:12px;
}
@media (max-width:520px){
  .custom-logo-link{max-width:140px;}
  .custom-logo{height:calc(var(--logo-h,44px) - 6px) !important; max-width:140px !important;}
}

/* --- HERO mini cards fix (v22 restore) --- */
.cards{
  display:grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap:14px;
}
.tcard{
  padding:18px 16px;
  border-radius:18px;
  background: rgba(255,255,255,.03);
  border: 1px solid rgba(255,255,255,.08);
  box-shadow: 0 10px 30px rgba(0,0,0,.25);
}
.tcard b{display:block; margin:0 0 8px; font-size:16px; letter-spacing:.2px;}
.tcard span{display:block; opacity:.85; line-height:1.4;}
@media (max-width: 980px){
  .cards{grid-template-columns: repeat(2, minmax(0,1fr));}
}

/* --- References visibility controls --- */
.ref-grid{display:grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap:14px;}
@media (max-width: 980px){ .ref-grid{grid-template-columns: repeat(2, minmax(0,1fr));} }
.ref{display:flex; align-items:center; justify-content:center; min-height:96px; padding:18px; border-radius:22px; text-align:center;}
.refs--dark .ref{background: rgba(255,255,255,.03); border:1px solid rgba(255,255,255,.08);}
.refs--light .ref{background: rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.14);}
.ref-plate{display:flex; align-items:center; justify-content:center; width:100%; height:100%; padding:14px; border-radius:18px; background: rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.12);}
.refs--light .ref-plate{background: rgba(255,255,255,.82); border:1px solid rgba(0,0,0,.12);}
.ref img{max-width: 160px; height:auto; filter:none;}
.refs-invert .ref img{filter: invert(1) hue-rotate(180deg) contrast(1.05);}


/* v11 hero restore helpers */
.hero .quote{margin-top:18px;padding:16px 18px;border:1px dashed rgba(255,255,255,.18);border-radius:18px;background:rgba(255,255,255,.03);}
.hero .support{margin-top:14px;display:flex;gap:12px;align-items:flex-start;padding:16px 18px;border-radius:18px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);}
.hero .support .badge{width:34px;height:34px;border-radius:12px;display:flex;align-items:center;justify-content:center;background:rgba(34,197,94,.14);border:1px solid rgba(34,197,94,.28);}
.hero .support b{display:block;margin-bottom:6px;}
.hero .support span{opacity:.86;line-height:1.45;display:block;}
.hero .hero-strong{margin-top:14px;font-weight:800;opacity:.96;}
.hero-card .kpi{margin-top:16px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;}
.hero-card .kpi .box{padding:14px;border-radius:16px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);}
.hero-card .kpi .num{font-weight:900;font-size:18px;margin-bottom:6px;}
.hero-card .kpi .lbl{opacity:.82;line-height:1.35;}
.hero-card .tagline{margin-top:14px;padding:14px 16px;border-radius:18px;border:1px dashed rgba(255,255,255,.18);opacity:.92;}


/* --- Alignment & buttons polish (v13) --- */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  height:56px;
  padding:0 18px;
  line-height:1;
  white-space:nowrap;
}
.btn svg{
  width:20px;
  height:20px;
  display:block;
  flex:0 0 auto;
}
.cta-row{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  align-items:center;
}
/* Guarantee CTA row (15 dk ücretsiz ön görüşme) */
.guarantee-cta{
  display:grid;
  grid-template-columns: 1fr auto;
  gap:16px;
  align-items:center;
}
.guarantee-cta > a,
.guarantee-cta .cta-row,
.guarantee-cta .btn{justify-self:end;}
@media (max-width: 980px){
  .guarantee-cta{grid-template-columns:1fr;}
  .guarantee-cta > a,
  .guarantee-cta .cta-row,
  .guarantee-cta .btn{justify-self:start;}
}

/* Hero mini cards equal height */
.tcard{
  min-height:170px;
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
}
.tcard span{margin-top:6px;}

/* References: keep premium dark (no bright white) */
.ref-plate{
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.10);
}
.refs--light .ref-plate{
  background: rgba(255,255,255,.14);
  border: 1px solid rgba(255,255,255,.18);
}

/* v14 spacing + alignment fixes */
.hero .cards{margin-top:22px !important;}
.hero .support{margin-bottom:6px;}
.cta-row{display:flex;flex-wrap:wrap;gap:12px;align-items:center;}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;}
.btn svg{width:22px;height:22px;display:inline-block;flex:0 0 auto;}

/* v15 final fixes */
.btn svg{width:22px;height:22px;display:inline-block;flex:0 0 auto;}
.hero .cards{margin-top:22px !important;}

/* refs premium + customizer-safe */
.refs-wrap .ref-logo{max-width:160px;height:auto;display:block;}
.refs--dark .ref{background: rgba(255,255,255,.02); border:1px solid rgba(255,255,255,.09);}
.refs--dark .ref-plate{background: rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.10);}
.refs--light .ref{background: rgba(255,255,255,.06); border:1px solid rgba(255,255,255,.14);}
.refs--light .ref-plate{background: rgba(255,255,255,.78); border:1px solid rgba(0,0,0,.12);}

/* footer bottom */
.site-footer-bottom{padding:18px 0;border-top:1px solid rgba(255,255,255,.08);background:rgba(0,0,0,.12);}
.footer-copy{opacity:.78;font-size:14px;line-height:1.4;}

/* v19 WhatsApp icon */
.btn .ico-wa{width:22px;height:22px;display:inline-block;flex:0 0 auto;}

/* v20 mobile refs overflow fix */
.ref-grid{max-width:100%;}
.ref{overflow:hidden;}
.refs-wrap .ref-logo, .ref img{max-width:100% !important; height:auto !important;}
@media (max-width: 640px){
  .ref-grid{grid-template-columns: repeat(2, minmax(0,1fr)) !important; gap:12px !important;}
  .ref{min-height:86px !important; padding:14px !important; border-radius:18px !important;}
  .ref-plate{padding:10px !important; border-radius:14px !important;}
  .refs-wrap .ref-logo, .ref img{max-width:120px !important;}
}

/* whatsapp icon guarantee (v21) */

.btn-wa svg{width:22px;height:22px;}

/* v23: prevent double WhatsApp icons (use inline SVG only) */
.btn-wa::before{content:none !important;}