/* ==========================================================================
   Tema: FABRİKA — süreç ve teknoloji. Stitch: Tasarim/Stitch/fabrika.png
   Neredeyse siyah + grafit zemin, asit yeşili vurgu. Anton (dev büyük harf) + IBM Plex Sans.
   Keskin köşeler (0px), asimetrik dergi düzeni. Border yok; ayrım zemin tonuyla.
   ========================================================================== */
:root {
    --bg: #0c0e0f; --bg2: #161819; --card: #1e2021; --ink: #f2f3f4; --muted: #adb3b8;
    --accent: #c6f432; --accent2: #b2dd22; --on-accent: #161f00; --soft: #27292b; --field: #27292b;
    --r: 0px; --r-sm: 0px;
    --sh: 0 4px 20px rgba(0,0,0,.25); --sh-lg: 0 20px 50px rgba(0,0,0,.4);
    --fh: 'Anton', Impact, sans-serif; --fb: 'IBM Plex Sans', system-ui, sans-serif; --w: 1280px;
}
.fb h1, .fb h2, .fb h3 { font-family: var(--fh); font-weight: 400; text-transform: uppercase; letter-spacing: .01em; line-height: 1; }
.fb-etiket { display: inline-block; font-size: 14px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--accent); }
.fb-etiket--dolu { background: var(--accent); color: var(--on-accent); padding: 4px 10px; }
.fb-etiket--koyu { color: #161f00; }

.fb-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 14px 22px; border: 0; background: var(--accent); color: var(--on-accent); font: 700 15px var(--fb); text-transform: uppercase; letter-spacing: .06em; cursor: pointer; white-space: nowrap; transition: background .2s; }
.fb-btn:hover { background: #d8ff55; }
.fb-btn--koyu { background: #27292b; color: var(--ink); }
.fb-btn--koyu:hover { background: #333537; }
.fb-btn--genis { width: 100%; }
.fb-girdi { width: 100%; padding: 14px 16px; border: 0; background: var(--field); color: var(--ink); font: 16px var(--fb); outline: none; }
.fb-girdi:focus { box-shadow: inset 0 -2px 0 var(--accent); }
.fb-girdi::placeholder { color: #7d848a; }

/* Üst */
.fb-ust { position: sticky; top: 0; z-index: 900; background: rgba(12,14,15,.94); backdrop-filter: blur(10px); }
.fb-ust.kaydi { box-shadow: 0 2px 20px rgba(0,0,0,.5); }
.fb-ust-ic { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding-top: 14px; padding-bottom: 14px; }
.fb-logo { display: flex; align-items: center; gap: 12px; }
.fb-logo img { max-height: 42px; width: auto; }
.fb-logo-kare { width: 22px; height: 22px; background: var(--accent); }
.fb-logo b { font-family: var(--fh); font-size: 24px; font-weight: 400; text-transform: uppercase; letter-spacing: .04em; white-space: nowrap; }
.fb-menu { display: flex; gap: 26px; }
.fb-menu a { font-size: 14px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }
.fb-menu a:hover, .fb-menu a.on { color: var(--accent); }
.fb-ust-sag { display: flex; align-items: center; gap: 18px; }
.fb-ust-tel { text-align: right; line-height: 1.2; }
.fb-ust-tel small { display: block; font-size: 14px; color: var(--muted); text-transform: uppercase; letter-spacing: .06em; }
.fb-ust-tel b { font-size: 17px; white-space: nowrap; }
.fb-hamburger { display: none; width: 46px; height: 46px; border: 0; background: var(--soft); color: var(--ink); cursor: pointer; }

/* Hero: tam ekran slider — asit yeşili perde ekranı soldan sağa siler, altından yeni görsel açılır;
   başlık satırları maskenin içinden sırayla yükselir. */
.fb-hero { position: relative; height: calc(100vh - 74px); min-height: 640px; max-height: 920px; overflow: hidden; background: #000; }
.fb-slayt { position: absolute; inset: 0; visibility: hidden; }
.fb-slayt.aktif { visibility: visible; z-index: 2; }
.fb-slayt.onceki { visibility: visible; z-index: 1; }
.fb-slayt-foto { position: absolute; inset: 0; clip-path: inset(0 100% 0 0); }
.fb-slayt.onceki .fb-slayt-foto { clip-path: inset(0 0 0 0); }
.fb-slayt.aktif .fb-slayt-foto { animation: fb-ac 1s cubic-bezier(.77,0,.18,1) .35s forwards; }
@keyframes fb-ac { to { clip-path: inset(0 0 0 0); } }
.fb-slayt-foto img { width: 100%; height: 100%; object-fit: cover; filter: saturate(.75) contrast(1.05); transform: scale(1.06); }
.fb-slayt.aktif .fb-slayt-foto img { animation: fb-kay var(--sure, 7000ms) linear forwards; }
@keyframes fb-kay { from { transform: scale(1.06) translateX(1.5%); } to { transform: scale(1.06) translateX(-1.5%); } }
.fb-slayt-foto::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(12,14,15,.92) 0%, rgba(12,14,15,.6) 45%, rgba(12,14,15,.15) 100%), linear-gradient(0deg, rgba(12,14,15,.85) 0%, transparent 35%); }
.fb-perde { position: absolute; z-index: 5; top: 0; bottom: 0; left: 0; width: 100%; background: var(--accent); transform: translateX(-101%); pointer-events: none; }
.fb-slayt.aktif .fb-perde { animation: fb-perde 1.3s cubic-bezier(.77,0,.18,1) forwards; }
@keyframes fb-perde { 0% { transform: translateX(-101%); } 45% { transform: translateX(0); } 100% { transform: translateX(101%); } }
.fb-slayt-ic { position: relative; z-index: 3; height: 100%; display: flex; flex-direction: column; justify-content: center; padding-bottom: 90px; }
.fb-baslik-blok { font-family: var(--fh); text-transform: uppercase; font-size: clamp(64px, 10.5vw, 168px); line-height: .9; margin: 22px 0 26px; }
.fb-satir { display: block; overflow: hidden; padding-bottom: .04em; }
.fb-satir > span { display: block; transform: translateY(105%); }
.fb-slayt.aktif .fb-satir > span { animation: fb-yuksel .9s cubic-bezier(.2,.8,.2,1) forwards; animation-delay: calc(.9s + var(--g, 0ms)); }
@keyframes fb-yuksel { to { transform: none; } }
.fb-satir em { font-style: normal; color: var(--accent); }
.fb-slayt-ic > p { max-width: 560px; color: #d5dade; font-size: 18px; margin: 0 0 30px; }
.fb-giris { opacity: 0; transform: translateY(14px); }
.fb-slayt.aktif .fb-giris { animation: fb-giris .7s ease 1.35s forwards; }
@keyframes fb-giris { to { opacity: 1; transform: none; } }
.fb-slayt-ic > .fb-etiket { align-self: flex-start; }
.fb-hero-btn { display: flex; flex-wrap: wrap; gap: 12px; }
.fb-btn--cam { background: rgba(255,255,255,.08); color: var(--ink); backdrop-filter: blur(6px); }
.fb-btn--cam:hover { background: rgba(255,255,255,.16); }
.fb-kontrol { position: absolute; z-index: 6; right: 48px; top: 50%; transform: translateY(-50%); display: flex; flex-direction: column; align-items: flex-end; gap: 22px; }
.fb-sayac { font-family: var(--fh); line-height: 1; text-align: right; }
.fb-sayac b { display: block; font-weight: 400; font-size: 110px; color: var(--accent); }
.fb-sayac span { font-size: 26px; color: var(--muted); }
.fb-cizgiler { display: flex; flex-direction: column; gap: 8px; }
.fb-cizgiler button { width: 6px; height: 56px; padding: 0; border: 0; background: rgba(255,255,255,.18); cursor: pointer; }
.fb-cizgiler i { display: block; width: 100%; height: 0; background: var(--accent); }
.fb-cizgiler button.aktif i { animation: fb-dolum var(--sure, 7000ms) linear forwards; }
.fb-hero.durdu .fb-cizgiler button.aktif i { animation-play-state: paused; }
@keyframes fb-dolum { to { height: 100%; } }
@keyframes fb-dolum-y { to { width: 100%; } }
.fb-oklar { display: flex; gap: 6px; }
.fb-oklar button { width: 52px; height: 52px; border: 0; background: rgba(255,255,255,.08); color: var(--ink); cursor: pointer; transition: background .2s, color .2s; }
.fb-oklar button:hover { background: var(--accent); color: var(--on-accent); }
.fb-hero-serit { position: absolute; z-index: 6; left: 0; right: 0; bottom: 0; background: rgba(12,14,15,.82); backdrop-filter: blur(8px); }
.fb-hero-serit-ic { display: flex; align-items: center; gap: 34px; padding-top: 18px; padding-bottom: 18px; font-size: 14px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; color: var(--muted); }
.fb-hero-serit b { color: var(--accent); margin-right: 6px; }
.fb-hero-serit a { margin-left: auto; display: inline-flex; align-items: center; gap: 8px; color: var(--ink); font-size: 17px; letter-spacing: .02em; }
.fb-hero-serit a .material-symbols-outlined { color: var(--accent); }
.fb-rakamlar--ust { padding-top: 80px; }

/* Rakamlar */
.fb-rakamlar { padding: 0 0 80px; }
.fb-rakam-izgara { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.fb-rakam-izgara > div { padding: 30px; background: var(--bg2); }
.fb-rakam-izgara strong { display: block; font-family: var(--fh); font-weight: 400; font-size: 64px; line-height: 1; color: var(--accent); }
.fb-rakam-izgara b { display: block; margin: 10px 0 8px; text-transform: uppercase; letter-spacing: .08em; }
.fb-rakam-izgara p { margin: 0; color: var(--muted); font-size: 15px; }

/* Bölümler */
.fb-bolum { padding: 96px 0; }
.fb-bolum--koyu { background: var(--bg2); }
.fb-bas { display: flex; justify-content: space-between; align-items: end; gap: 40px; margin-bottom: 48px; }
.fb-bas h2 { font-size: clamp(38px, 5vw, 64px); margin: 10px 0 0; max-width: 760px; }
.fb-bas > p { color: var(--muted); max-width: 380px; margin: 0; }

/* 7 aşama: sırayla sol/sağ geniş foto */
.fb-surec { display: flex; flex-direction: column; gap: 16px; }
.fb-asama { display: grid; grid-template-columns: 1fr 1.25fr; background: var(--bg2); }
.fb-asama.ters .fb-asama-metin { order: 2; }
.fb-asama-metin { display: flex; gap: 28px; padding: 40px; align-items: center; }
.fb-asama-no { font-family: var(--fh); font-size: 96px; line-height: 1; color: var(--accent); }
.fb-asama h3 { font-size: 32px; margin: 8px 0 12px; }
.fb-asama p { margin: 0; color: var(--muted); }
.fb-asama-foto img { width: 100%; height: 100%; min-height: 260px; object-fit: cover; }

/* Makine kartları */
.fb-makineler { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.fb-makine { padding: 26px; background: var(--card); display: flex; flex-direction: column; gap: 10px; }
.fb-makine h3 { font-size: 26px; margin: 4px 0; }
.fb-makine p { margin: 0; color: var(--muted); font-size: 15px; flex: 1; }
.fb-makine dl { margin: 8px 0 0; padding: 14px; background: var(--bg); display: flex; flex-direction: column; gap: 8px; }
.fb-makine dl div { display: flex; justify-content: space-between; gap: 10px; font-size: 14px; }
.fb-makine dt { color: var(--muted); }
.fb-makine dd { margin: 0; font-weight: 700; color: var(--accent); text-align: right; }

/* Uzmanlık listesi */
.fb-uzman { display: grid; grid-template-columns: 1fr 2fr; gap: 48px; }
.fb-uzman h2 { font-size: 52px; margin: 10px 0 16px; }
.fb-uzman > div > p { color: var(--muted); }
.fb-not { margin-top: 24px; padding: 20px; background: var(--bg2); display: flex; flex-direction: column; gap: 6px; }
.fb-not b { color: var(--accent); text-transform: uppercase; letter-spacing: .08em; font-size: 14px; }
.fb-not span { color: var(--muted); font-size: 15px; }
.fb-liste { display: flex; flex-direction: column; gap: 10px; }
.fb-liste-oge { display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 22px 26px; background: var(--bg2); transition: background .2s; }
.fb-liste-oge:hover { background: var(--card); }
.fb-liste-oge b { display: block; font-family: var(--fh); font-weight: 400; font-size: 24px; text-transform: uppercase; margin: 4px 0; }
.fb-liste-oge small { color: var(--muted); font-size: 15px; }
.fb-liste-oge .material-symbols-outlined { color: var(--accent); }

/* Alıntı */
.fb-alinti { padding: 110px 0; text-align: center; background: var(--bg); }
.fb-alinti blockquote { font-family: var(--fh); font-style: italic; text-transform: uppercase; font-size: clamp(30px, 4.4vw, 58px); line-height: 1.08; max-width: 1080px; margin: 0 auto 24px; transform: skewX(-6deg); }
.fb-alinti cite { font-style: normal; color: var(--accent); font-weight: 700; letter-spacing: .1em; text-transform: uppercase; font-size: 14px; }

/* Lime CTA */
.fb-cta { background: var(--accent); color: #161f00; padding: 96px 0; }
.fb-cta-izgara { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: center; }
.fb-cta h2 { font-size: clamp(44px, 5.5vw, 76px); margin: 12px 0 18px; }
.fb-cta p { font-size: 17px; margin: 0 0 18px; }
.fb-cta ul { list-style: none; padding: 0; margin: 0 0 28px; display: flex; flex-direction: column; gap: 8px; }
.fb-cta li { font-weight: 700; font-size: 15px; text-transform: uppercase; letter-spacing: .04em; }
.fb-cta li::before { content: "■ "; }
.fb-cta-tel { font-family: var(--fh); font-size: 44px; line-height: 1; }
.fb-cta-tel small { display: block; font: 700 14px var(--fb); text-transform: uppercase; letter-spacing: .08em; margin-bottom: 6px; }
.fb-form { background: var(--bg); color: var(--ink); padding: 32px; display: flex; flex-direction: column; gap: 14px; box-shadow: 0 30px 60px rgba(22,31,0,.3); }
.fb-form-bas { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.fb-form-bas h3 { font-size: 30px; margin: 0; }
.fb-form-bas span { color: var(--accent); font-size: 14px; font-weight: 700; text-transform: uppercase; }
.fb-form label { display: flex; flex-direction: column; gap: 6px; }
.fb-form label > span { font-size: 14px; color: var(--muted); text-transform: uppercase; letter-spacing: .06em; }
.fb-iki { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }

/* Alt */
.fb-alt { background: var(--bg); padding: 72px 0 0; }
.fb-alt-izgara { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1.2fr; gap: 40px; padding-bottom: 48px; }
.fb-alt p { color: var(--muted); font-size: 15px; }
.fb-alt h4 { margin: 0 0 16px; font-size: 14px; letter-spacing: .12em; text-transform: uppercase; color: var(--accent); }
.fb-alt-izgara > div > a:not(.fb-logo) { display: block; color: var(--muted); padding: 5px 0; font-size: 15px; }
.fb-alt-izgara a:hover { color: var(--accent); }
.fb-alt-izgara .fb-alt-tel { font-family: var(--fh); font-size: 34px; color: var(--ink); }
.fb-sosyal { display: flex; gap: 8px; margin-top: 12px; }
.fb-sosyal a { width: 42px; height: 42px; background: var(--soft); display: flex !important; align-items: center; justify-content: center; padding: 0 !important; }
.fb-alt-son { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 10px; padding-top: 20px; padding-bottom: 26px; font-size: 14px; color: var(--muted); }
.fb-alt-son a:hover { color: var(--accent); }
.fb-wa { position: fixed; right: 22px; bottom: 22px; z-index: 950; width: 58px; height: 58px; background: #25d366; color: #fff; display: flex; align-items: center; justify-content: center; }

@media (max-width: 1100px) {
    .fb-ust { backdrop-filter: none; background: var(--bg); }
    .fb-menu { position: fixed; inset: 72px 0 auto 0; flex-direction: column; gap: 0; padding: 12px 24px 24px; background: var(--bg2); transform: translateY(-120%); transition: transform .3s; z-index: 899; }
    .fb-menu.acik { transform: none; visibility: visible; }
    .fb-menu { visibility: hidden; }
    .fb-menu a { padding: 12px 0; }
    .fb-hamburger { display: inline-flex; align-items: center; justify-content: center; }
    .fb-ust-tel { display: none; }
    .fb-uzman, .fb-cta-izgara { grid-template-columns: 1fr; }
    .fb-kontrol { right: 24px; top: auto; bottom: 86px; transform: none; flex-direction: row; align-items: center; }
    .fb-sayac b { font-size: 56px; display: inline; }
    .fb-cizgiler { flex-direction: row; }
    .fb-cizgiler button { width: 40px; height: 6px; }
    .fb-cizgiler i { height: 100%; width: 0; }
    .fb-cizgiler button.aktif i { animation-name: fb-dolum-y; }
    .fb-hero-serit span { display: none; }
    .fb-makineler { grid-template-columns: repeat(2, 1fr); }
    .fb-asama, .fb-asama.ters { grid-template-columns: 1fr; }
    .fb-asama.ters .fb-asama-metin { order: 0; }
    .fb-alt-izgara { grid-template-columns: 1fr 1fr; }
    .fb-bas { flex-direction: column; align-items: start; }
}
@media (max-width: 640px) {
    .fb-ust-sag .fb-btn { display: none; }
    .fb-bolum { padding: 72px 0; }
    .fb-rakam-izgara, .fb-makineler, .fb-iki, .fb-alt-izgara { grid-template-columns: 1fr; }
    .fb-asama-metin { flex-direction: column; align-items: start; gap: 8px; padding: 26px; }
    .fb-asama-no { font-size: 64px; }
    .fb-hero { height: 720px; min-height: 0; }
    .fb-slayt-ic { justify-content: flex-start; padding-top: 60px; }
    .fb-oklar { display: none; }
}
