/*
Theme Name: Çalışkan Metal
Theme URI: https://hurdaci.work/
Author: ChatGPT
Description: Elementor + Gutenberg uyumlu, sade ama göz alıcı efektlere sahip tema. (Lacivert içermez)
Version: 1.1.0
License: GPLv2 or later
Text Domain: caliskan-metal
Tags: custom-background, custom-logo, custom-menu, featured-images, block-styles, wide-blocks
*/

:root{
  --cm-bg:#f4f7fb;
  --cm-surface:#ffffff;
  --cm-surface-2:#eef3f8;
  --cm-text:#12171d;
  --cm-muted:#5b6572;
  --cm-border:rgba(16,24,40,.12);
  --cm-green:#16a34a;
  --cm-green-2:#22c55e;
  --cm-amber:#f59e0b;
  --cm-shadow:0 12px 30px rgba(2, 6, 23, .10);
  --cm-radius:18px;
  --cm-radius-sm:12px;
  --cm-max:1180px;
}


*{ box-sizing:border-box; }
html,body{ margin:0; padding:0; }
body{
  font-family: system-ui,-apple-system,Segoe UI,Roboto,Inter,Arial,sans-serif;
  background:
    radial-gradient(1200px 700px at 15% 15%, rgba(57,208,122,.16), transparent 60%),
    radial-gradient(900px 600px at 85% 25%, rgba(255,183,3,.14), transparent 60%),
    linear-gradient(180deg, #06090b, var(--cm-bg));
  color:var(--cm-text);
  line-height:1.6;
  overflow-x:hidden;
}

a{ color:inherit; text-decoration:none; }
img{ max-width:100%; height:auto; }
.container{max-width:var(--cm-max); margin:0 auto; padding:0 16px; width:100%;}


.cm-skip{ position:absolute; left:-9999px; top:auto; width:1px; height:1px; overflow:hidden; }
.cm-skip:focus{ left:16px; top:16px; width:auto; height:auto; padding:10px 12px; background:#000; border:1px solid var(--cm-line); border-radius:12px; z-index:9999; }

.cm-card{
  background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.03));
  border:1px solid var(--cm-line);
  border-radius: var(--cm-radius);
  box-shadow: var(--cm-shadow);
  backdrop-filter: blur(10px);
}

.cm-btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  padding:12px 14px;
  border-radius: 14px;
  border:1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.06);
  cursor:pointer;
  transition: transform .12s ease, border-color .12s ease, background .12s ease, box-shadow .12s ease;
}
.cm-btn:hover{ transform: translateY(-1px); border-color: rgba(255,255,255,.22); background: rgba(255,255,255,.08); }
.cm-btn:active{ transform: translateY(0px) scale(.99); }
.cm-btn.cm-primary{
  border-color: rgba(57,208,122,.55);
  background: linear-gradient(180deg, rgba(57,208,122,.18), rgba(57,208,122,.08));
}
.cm-btn.cm-primary:hover{ box-shadow:0 0 0 6px rgba(57,208,122,.10); }
.cm-btn.cm-amber{
  border-color: rgba(255,183,3,.55);
  background: linear-gradient(180deg, rgba(255,183,3,.18), rgba(255,183,3,.08));
}
.cm-btn.cm-amber:hover{ box-shadow:0 0 0 6px rgba(255,183,3,.10); }

.cm-pill{
  display:inline-flex; align-items:center; gap:.45rem;
  padding:8px 10px; border-radius:999px;
  border:1px solid var(--cm-line);
  background: rgba(0,0,0,.25);
  color: var(--cm-muted);
  font-size:13px;
}

.cm-header{
  position:sticky; top:0; z-index:999;
  background: rgba(8,11,14,.58);
  border-bottom:1px solid rgba(255,255,255,.08);
  backdrop-filter: blur(10px);
}
.cm-header__bar{ display:flex; align-items:center; justify-content:space-between; gap:14px; padding:12px 0; }
.cm-brand{ display:flex; align-items:center; gap:10px; min-width:200px; }
.cm-brand__logo{ width:42px; height:42px; border-radius:14px; overflow:hidden; border:1px solid rgba(255,255,255,.10); background: rgba(255,255,255,.06); display:grid; place-items:center; }
.cm-brand__title{ display:flex; flex-direction:column; line-height:1.1; }
.cm-brand__title strong{ font-size:15px; letter-spacing:.2px; }
.cm-brand__title span{ font-size:12.5px; color:var(--cm-muted); }

.cm-nav{ display:flex; align-items:center; gap:18px; flex:1; justify-content:center; }
.cm-nav ul{ list-style:none; display:flex; gap:14px; padding:0; margin:0; flex-wrap:wrap; justify-content:center; }
.cm-nav a{
  position:relative;
  padding:8px 10px;
  border-radius:12px;
  color: var(--cm-text);
  opacity:.92;
}
.cm-nav a:after{
  content:"";
  position:absolute; left:10px; right:10px; bottom:5px;
  height:2px;
  transform:scaleX(0);
  transform-origin:left;
  transition: transform .16s ease;
  background: linear-gradient(90deg, var(--cm-accent), var(--cm-accent-2));
  border-radius:99px;
  opacity:.9;
}
.cm-nav a:hover{ background: rgba(255,255,255,.06); }
.cm-nav a:hover:after{ transform:scaleX(1); }

.cm-header__cta{ display:flex; gap:10px; align-items:center; justify-content:flex-end; min-width:260px; }
.cm-header__cta .cm-phone{ font-weight:700; letter-spacing:.3px; }
.cm-mobile-toggle{ display:none; }

@media (max-width: 900px){
  .cm-nav{ display:none; }
  .cm-mobile-toggle{ display:inline-flex; }
  .cm-header__cta{ min-width:auto; }
}

.cm-hero{
  padding:60px 0 26px;
}
.cm-hero__grid{
  display:grid; gap:18px;
  grid-template-columns: 1.2fr .8fr;
  align-items:stretch;
}
@media (max-width: 900px){
  .cm-hero__grid{ grid-template-columns:1fr; }
}

.cm-hero__panel{ padding:24px; position:relative; overflow:hidden; }
.cm-hero__panel:before{
  content:"";
  position:absolute; inset:-2px;
  background:
    radial-gradient(700px 260px at 30% 15%, rgba(57,208,122,.20), transparent 60%),
    radial-gradient(700px 260px at 90% 70%, rgba(255,183,3,.18), transparent 60%);
  filter: blur(6px);
  opacity:.8;
  pointer-events:none;
}
.cm-hero__panel > *{ position:relative; z-index:1; }
.cm-hero h1{ margin:0 0 10px; font-size: clamp(28px, 3.4vw, 44px); line-height:1.15; }
.cm-hero p{ margin:0 0 16px; color:var(--cm-muted); font-size:15.5px; }
.cm-hero__badges{ display:flex; flex-wrap:wrap; gap:8px; margin:0 0 18px; }
.cm-hero__actions{ display:flex; flex-wrap:wrap; gap:10px; }

.cm-section{ padding:18px 0 40px; }
.cm-section__head{ display:flex; align-items:flex-end; justify-content:space-between; gap:12px; margin:0 0 14px; }
.cm-section__head h2{ margin:0; font-size:20px; }
.cm-section__head p{ margin:0; color:var(--cm-muted); font-size:13.5px; }

.cm-grid-2{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
@media (max-width: 900px){ .cm-grid-2{ grid-template-columns:1fr; } }

.cm-footer{ padding:36px 0 28px; border-top:1px solid rgba(255,255,255,.08); margin-top:24px; }
.cm-footer__grid{ display:grid; grid-template-columns:1.1fr .9fr; gap:16px; }
@media (max-width: 900px){ .cm-footer__grid{ grid-template-columns:1fr; } }
.cm-footer small{ color:var(--cm-muted); }

.cm-table{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  overflow:hidden;
  border-radius: 16px;
  border:1px solid rgba(255,255,255,.10);
}
.cm-table th, .cm-table td{
  padding:12px 12px;
  border-bottom:1px solid rgba(255,255,255,.08);
  font-size:14px;
}
.cm-table th{
  text-align:left;
  color:#fff;
  background: rgba(255,255,255,.05);
  position:sticky; top:0;
}
.cm-table tr:hover td{ background: rgba(255,255,255,.03); }
.cm-table tr:last-child td{ border-bottom:none; }

.cm-form{
  display:grid; gap:10px;
}
.cm-form label{ font-size:13px; color:var(--cm-muted); }
.cm-form input, .cm-form select, .cm-form textarea{
  width:100%;
  padding:12px 12px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.12);
  background: rgba(0,0,0,.25);
  color: var(--cm-text);
  outline:none;
}
.cm-form input:focus, .cm-form select:focus, .cm-form textarea:focus{
  border-color: rgba(57,208,122,.55);
  box-shadow:0 0 0 6px rgba(57,208,122,.10);
}

.cm-note{ color:var(--cm-muted); font-size:13px; }

/* Mobile nav */
.cm-nav-toggle{
  display:none; border:1px solid var(--cm-border); background:var(--cm-surface);
  border-radius:12px; padding:10px 12px; font-size:18px; line-height:1;
  box-shadow:0 6px 16px rgba(2,6,23,.08);
}
@media (max-width: 900px){
  .cm-header__bar{gap:10px;}
  .cm-brand__title{display:none;}
  .cm-nav-toggle{display:inline-flex; align-items:center; justify-content:center;}
  .cm-nav{
    display:none; position:absolute; left:16px; right:16px; top:72px;
    background:var(--cm-surface); border:1px solid var(--cm-border);
    border-radius:18px; padding:10px; box-shadow:var(--cm-shadow);
  }
  .cm-nav.is-open{display:block;}
  .cm-nav ul{display:flex; flex-direction:column; gap:6px;}
  .cm-header__cta{display:none;}
}

/* Mobile bottom bar */
.cm-bottom-bar{display:none;}
@media (max-width: 900px){
  .cm-bottom-bar{
    position:fixed; left:0; right:0; bottom:0; z-index:9999;
    display:grid; grid-template-columns:1fr 1fr;
    border-top:1px solid var(--cm-border);
  }
  .cm-bottom-btn{
    padding:14px 12px; text-align:center; font-weight:800;
    text-decoration:none; color:#fff;
  }
  .cm-bottom-wa{background:var(--cm-green);}
  .cm-bottom-call{background:#111827;}
  body{padding-bottom:54px;}
}

.cm-image-placeholder{
  min-height:320px;
  border:2px dashed rgba(16,24,40,.18);
  border-radius:var(--cm-radius);
  display:flex; flex-direction:column;
  align-items:center; justify-content:center;
  gap:6px; color:var(--cm-muted);
  background:linear-gradient(180deg, #fff, var(--cm-surface-2));
}
.cm-cta-row{display:flex; gap:10px; flex-wrap:wrap; margin-bottom:12px;}