/* Bies Soğutma Tema v3 */
:root{
  --bg: #0b0f1a;
  --text: #e7e9ee;
  --muted: #a8b0c2;
  --glass: rgba(255,255,255,.08);
  --border: rgba(255,255,255,.12);
  --grad-a: #2a6afc;
  --grad-b: #e21b92;
  --shadow: 0 10px 30px rgba(0,0,0,.35), 0 2px 6px rgba(0,0,0,.25);
}

*{ box-sizing: border-box }
html{ background: #0b0f1a; scroll-behavior: smooth; }
body{
  margin:0; padding:0;
  scroll-behavior:smooth;
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  background: transparent;
  color: var(--text);
}

body::before{
  content:""; position:fixed; inset:0; z-index:-1;
  background:
    radial-gradient(1200px 800px at 10% -10%, rgba(42,106,252,.35), transparent 60%),
    radial-gradient(1000px 800px at 100% 0%, rgba(226,27,146,.30), transparent 60%),
    radial-gradient(1200px 900px at 50% 120%, rgba(42,106,252,.20), transparent 60%);
  pointer-events:none;
  animation: floatBg 26s linear infinite alternate;
}
@keyframes floatBg{ from{ transform: translateY(-2%) } to{ transform: translateY(2%) } }

img{ max-width: 100%; display:block }
.container{ width:min(1120px, 92%); margin-inline:auto }
.section{ padding: 96px 0; position: relative }
.section-head{ text-align:center; margin-bottom: 36px }
.section-head h2{ font-size: clamp(28px, 4vw, 40px); margin:0 0 10px; letter-spacing:.3px }
.section-head p{ margin:0 auto; color: var(--muted); max-width: 800px }

.site-header{ position: sticky; top:0; z-index: 1000; backdrop-filter: blur(10px);
  background: linear-gradient( to right, rgba(10,14,25,.65), rgba(10,14,25,.35) ); border-bottom: 1px solid var(--border) }
.header-inner{ display:flex; align-items:center; justify-content:space-between; min-height:72px; gap:24px }
.brand img{ height: 80px; width:auto } /* desktop */
@media (max-width:900px){ .brand img{ height:56px } } /* mobile */

.main-nav ul{ list-style:none; display:flex; gap: 12px; padding:0; margin:0 }
.main-nav a{ display:inline-block; padding:10px 14px; border-radius:12px; text-decoration:none; color: var(--text); font-weight:600; letter-spacing:.2px; border:1px solid transparent }
.main-nav a.active, .main-nav a:hover{ background: linear-gradient( to right, rgba(42,106,252,.22), rgba(226,27,146,.22) ); border-color: transparent }

.nav-toggle{ display:none; background:transparent; border:0; cursor:pointer }
.nav-toggle span{ display:block; width:24px; height:2px; background:#fff; margin:5px 0; border-radius:2px }
@media (max-width:900px){
  .nav-toggle{ display:block }
  .main-nav{ position: fixed; inset: 72px 0 auto 0; background: rgba(10,14,25,.95); border-bottom:1px solid var(--border); transform: translateY(-120%); transition:.3s }
  .main-nav.open{ transform: translateY(0) }
  .main-nav ul{ flex-direction:column; align-items:center; padding: 16px 0 }
  .main-nav a{ font-size:18px }
}

.hero{ padding: 120px 0 80px }
.hero-card{
  background-image: url('../img/hero_mesh.svg'), linear-gradient( to right bottom, rgba(255,255,255,.10), rgba(255,255,255,.06) );
  background-size: cover, auto;
  background-position: center;
 max-width: 900px; margin: 0 auto; padding: 36px; border-radius: 24px;
   border: 1px solid var(--border); box-shadow: var(--shadow); backdrop-filter: blur(12px); text-align:center }
.hero-card h1{ margin:0 0 12px; font-size: clamp(32px, 6vw, 56px); line-height:1.1 }
.hero-card p{ margin: 0 auto 20px; color: var(--muted); max-width: 760px }
.hero-ctas{ display:flex; gap:12px; justify-content:center; flex-wrap:wrap }
.scroll-down{ display:block; text-align:center; margin-top: 26px; color:#c8cfe0; text-decoration:none; opacity:.7 }

.glass{  border: 1px solid var(--border); border-radius: 18px; padding: 22px; box-shadow: var(--shadow); backdrop-filter: blur(10px) }
.grid-3{ display:grid; grid-template-columns: repeat(3, 1fr); gap: 18px }
@media (max-width: 900px){ .grid-3{ grid-template-columns: 1fr } }
.grid-6{ display:grid; grid-template-columns: repeat(3, 1fr); gap: 18px }
@media (max-width:1100px){ .grid-6{ grid-template-columns: repeat(2, 1fr) } }
@media (max-width:700px){ .grid-6{ grid-template-columns: 1fr } }
.about-wrap{ display:grid; gap:18px; grid-template-columns: 1.2fr .8fr }
@media (max-width: 900px){ .about-wrap{ grid-template-columns: 1fr } }
.card h3{ margin-top:0; display:flex; align-items:center; gap:10px }
.card .icon{ color:#8ecbff; margin-bottom:6px; opacity:.9 }
.ticks{ padding-left: 20px } .ticks li{ margin: 8px 0 }

.btn{ --pad: 12px; display:inline-block; padding: var(--pad) 18px; border-radius: 16px; text-decoration:none; font-weight:700; letter-spacing:.3px; border: 1px solid var(--border); transition: transform .08s, box-shadow .2s, background .2s; user-select:none }
.btn:active{ transform: translateY(1px) }
.btn-gradient{ color:#fff; background: linear-gradient( to right, var(--grad-a), var(--grad-b) ); box-shadow: 0 10px 24px rgba(42,106,252,.25), 0 6px 18px rgba(226,27,146,.20); position:relative; overflow:hidden }
.btn-gradient::before{ content:""; position:absolute; inset:0; background: radial-gradient( 240px 100px at var(--x, 10%) var(--y, 50%), rgba(255,255,255,.25), transparent 60% ); opacity:.0; transition:opacity .25s }
.btn-gradient:hover::before{ opacity:.8 }
.btn-ghost{ color:#fff; background: transparent } /* Teklif Al butonu hero'da */
.form-actions .btn-ghost{ display:none } /* iletişimde yalnızca Gönder kalsın */

.contact-wrap{ display:grid; gap:18px; grid-template-columns: 1.1fr .9fr }
@media (max-width: 900px){ .contact-wrap{ grid-template-columns: 1fr } }
.contact-form .form-row{ display:flex; flex-direction:column; gap:8px; margin-bottom: 14px }
.contact-form label{ font-weight:600 }
.contact-form input, .contact-form textarea{ background: rgba(255,255,255,.06); color:#fff; border:1px solid var(--border); border-radius: 12px; padding:12px 14px; outline:none }
.contact-form input:focus, .contact-form textarea:focus{ border-color: rgba(226,27,146,.5) }
.form-actions{ display:flex; gap:10px; flex-wrap:wrap; margin-top:10px }
.map-embed{ padding:28px; text-align:center }

.service.image-card{ display:flex; flex-direction:column; gap:10px }
.service.image-card img{ width:100%; height:160px; object-fit:cover; border-radius:12px; border:1px solid var(--border) }

.refs{ overflow:hidden; position:relative }
.refs .track{ display:flex; gap:18px; will-change: transform }
.ref-card{ min-width: 280px;  border: 1px solid var(--border); border-radius: 18px; padding: 18px; box-shadow: var(--shadow) }
.ref-card img{ width: 100%; height: 120px; object-fit: cover; border-radius: 12px }

.site-footer{ border-top:1px solid var(--border); padding: 24px 0; color: #bec6d7 }
.footer-inner{ display:flex; align-items:center; justify-content:space-between; gap:10px }
.to-top{ display:inline-flex; align-items:center; justify-content:center; width:40px; height:40px; border-radius:12px; text-decoration:none; color:#fff; border:1px solid var(--border) }

.reveal{ opacity:0; transform: translateY(14px); transition: opacity .5s ease, transform .5s ease }
.reveal.visible{ opacity:1; transform: translateY(0) }

.section{ scroll-margin-top: 92px }

#referanslar{ min-height: 80vh; padding-bottom: 120px }
