
:root {
  --bg: #0a0b0d; --bg2: #14161a; --panel: rgba(20, 22, 26, 0.85); --line: #2a2e33;
  --text: #e4e8ea; --muted: #8a949c; --mask: #8fb8b6; --mask-d: #5f8f8d;
  --led-g: #5fd07a; --led-a: #f2b43c; --led-r: #e0524a; --red-accent: #b33939;
  --r: 8px; --maxw: 1120px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--bg); color: var(--text); font: 16px/1.65 "PT Sans", system-ui, sans-serif; -webkit-font-smoothing: antialiased; }
a { color: var(--mask); text-decoration: none; }
a:hover { text-decoration: underline; }
h1, h2, h3 { font-family: "Russo One", "PT Sans", sans-serif; font-weight: 400; text-transform: uppercase; margin: 0 0 .6em; text-shadow: 1px 1px 3px rgba(0,0,0,0.8); }
h1 { font-size: clamp(36px, 7vw, 68px); line-height: 1.1; color: #fff; }
h2 { font-size: clamp(26px, 4vw, 40px); color: var(--mask); }
h3 { font-size: 20px; letter-spacing: 0.05em; }
.mono { font-family: "PT Mono", monospace; }
.wrap { max-width: var(--maxw); margin: 0 auto; padding: 0 20px; }
.btn { display: inline-flex; align-items: center; gap: 8px; border: 1px solid var(--mask-d); background: rgba(0,0,0,0.4); color: var(--text); font: 15px "PT Sans", sans-serif; text-transform: uppercase; letter-spacing: 0.05em; padding: 12px 24px; border-radius: 2px; cursor: pointer; transition: all .2s; backdrop-filter: blur(4px); }
.btn:hover { background: rgba(143, 184, 182, 0.15); text-decoration: none; box-shadow: 0 0 10px rgba(143,184,182,0.2); }
.btn.pri { background: var(--mask); border-color: var(--mask); color: #0a0b0d; font-weight: 700; box-shadow: 0 0 15px rgba(143,184,182,0.4); }
.btn.pri:hover { background: #a3c9c7; box-shadow: 0 0 25px rgba(143,184,182,0.6); }
.btn.sm { padding: 8px 16px; font-size: 13px; }
.btn:disabled { opacity: .45; cursor: not-allowed; }
.led { display: inline-block; width: 10px; height: 10px; border-radius: 50%; background: var(--led-g); box-shadow: 0 0 6px var(--led-g); vertical-align: middle; }
.led.a { background: var(--led-a); box-shadow: 0 0 6px var(--led-a); }
.led.r { background: var(--led-r); box-shadow: 0 0 6px var(--led-r); }
.scene-tag { font: 14px "PT Mono", monospace; letter-spacing: 0.15em; text-transform: uppercase; color: var(--red-accent); border-left: 3px solid var(--red-accent); padding-left: 8px; margin-bottom: 12px; }

/* Intro */
.intro { position: fixed; inset: 0; background: #050505; z-index: 9999; display: flex; align-items: center; justify-content: center; flex-direction: column; transition: opacity 0.6s ease; }
.intro.hide { opacity: 0; pointer-events: none; }
.intro .tw { overflow: hidden; white-space: nowrap; border-right: 3px solid var(--mask); font: 48px "Russo One", sans-serif; color: #fff; letter-spacing: 0.1em; animation: typing 1.2s steps(8, end) forwards, blink .8s step-end infinite; }
.intro .sub { opacity: 0; font: 16px "PT Sans", sans-serif; letter-spacing: 0.3em; text-transform: uppercase; color: var(--mask-d); margin-top: 15px; animation: fadeIn .8s 1.3s forwards; }
@keyframes typing { from { width: 0 } to { width: 310px } }
@keyframes blink { 50% { border-color: transparent } }
@keyframes fadeIn { to { opacity: 1 } }
@media (prefers-reduced-motion: reduce) { .intro { display: none !important; } }
@media (max-width: 400px) { @keyframes typing { from { width: 0 } to { width: 250px } } .intro .tw { font-size: 36px; } }

/* Header */
header { position: sticky; top: 0; z-index: 20; background: rgba(10, 11, 13, 0.9); backdrop-filter: blur(10px); border-bottom: 1px solid var(--line); }
.nav { display: flex; align-items: center; gap: 22px; height: 70px; }
.logo { font: 24px "Russo One", sans-serif; color: #fff; letter-spacing: 0.1em; text-shadow: 0 0 8px rgba(255,255,255,0.3); }
.logo:hover { text-decoration: none; color: var(--mask); }
.nav .links { display: flex; gap: 24px; margin-left: 20px; }
.nav .links a { color: var(--muted); font-size: 14px; text-transform: uppercase; letter-spacing: 0.05em; font-family: "Russo One", sans-serif; }
.nav .links a:hover { color: var(--mask); text-decoration: none; }
.nav .auth { margin-left: auto; display: flex; gap: 12px; }
@media(max-width:860px){.nav .links{display:none}}

/* Hero */
.hero { position: relative; overflow: hidden; min-height: 90vh; display: flex; align-items: center; background: url('/assets/hero.webp') center/cover no-repeat; border-bottom: 1px solid var(--line); }
.hero::before { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, #0a0b0d 10%, rgba(10,11,13,0.6) 50%, #0a0b0d 95%); }
.hero-in { position: relative; z-index: 2; display: grid; grid-template-columns: 1.2fr 0.8fr; gap: 40px; align-items: center; padding: 60px 20px; width: 100%; }
.hero p.lead { font-size: 20px; color: #b0b8c0; max-width: 580px; text-shadow: 1px 1px 2px #000; }
.hero .cta { display: flex; gap: 16px; flex-wrap: wrap; margin-top: 30px; }
.scan { pointer-events: none; position: absolute; inset: 0; background: repeating-linear-gradient(0deg, rgba(255,255,255,0.03) 0 1px, transparent 1px 4px); mix-blend-mode: overlay; z-index: 1; }
.grain { pointer-events: none; position: absolute; inset: -50%; opacity: 0.08; background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='3'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>"); animation: gr 0.8s steps(4) infinite; z-index: 1; mix-blend-mode: screen; }
@keyframes gr { 0%{transform:translate(0,0)} 25%{transform:translate(-2%,2%)} 50%{transform:translate(2%,-2%)} 75%{transform:translate(-1%,-1%)} }

/* Reveal Mask */
.reveal { position: relative; aspect-ratio: 1/1; max-width: 420px; width: 100%; margin: 0 auto; cursor: crosshair; touch-action: none; border-radius: 12px; overflow: hidden; background: #000; box-shadow: 0 10px 40px rgba(0,0,0,0.8); border: 1px solid var(--line); }
.reveal .term { position: absolute; inset: 0; padding: 30px; font-family: "PT Mono", monospace; color: var(--mask-d); font-size: 14px; display: flex; flex-direction: column; justify-content: center; background: radial-gradient(circle at center, #111a1a 0%, #050808 100%); }
.reveal .term p { margin: 8px 0; }
.reveal .term .hl { color: var(--mask); text-shadow: 0 0 5px var(--mask); }
.reveal .top-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;
  -webkit-mask-image: radial-gradient(circle var(--rr,0px) at var(--x,50%) var(--y,50%), transparent 98%, #000 100%);
  mask-image: radial-gradient(circle var(--rr,0px) at var(--x,50%) var(--y,50%), transparent 98%, #000 100%);
  transition: mask-size 0.1s;
}
.reveal-hint { text-align: center; font-size: 12px; color: var(--muted); margin-top: 12px; font-family: "PT Mono", monospace; text-transform: uppercase; letter-spacing: 0.1em; }

@media(max-width:960px){.hero-in{grid-template-columns:1fr; padding: 40px 20px;} .hero::before{background:rgba(10,11,13,0.85);}}

/* Console Status */
.console { display: flex; flex-wrap: wrap; gap: 0; border: 1px solid var(--line); border-radius: 2px; background: rgba(0,0,0,0.6); margin-top: 40px; max-width: 660px; backdrop-filter: blur(5px); }
.console div { flex: 1; min-width: 160px; padding: 14px 20px; border-right: 1px solid var(--line); }
.console div:last-child { border-right: none; }
.console small { display: block; font: 11px "PT Mono", monospace; color: var(--muted); text-transform: uppercase; letter-spacing: 0.1em; margin-bottom: 4px; }
.console b { font: 20px "Russo One", sans-serif; color: var(--text); font-weight: 400; }

section { padding: 90px 0; border-bottom: 1px solid var(--line); position: relative; }
.sec-head { max-width: 700px; margin-bottom: 45px; }
.sec-head p { color: var(--muted); font-size: 18px; }

/* How it works */
.steps { position: relative; display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.steps .track { position: absolute; left: 10%; right: 10%; top: 38px; height: 1px; background: rgba(143, 184, 182, 0.3); border-bottom: 1px dashed rgba(143, 184, 182, 0.1); }
.steps .car { position: absolute; top: -10px; left: 8%; width: 120px; height: auto; transition: left 0.1s linear; filter: drop-shadow(0 5px 10px rgba(0,0,0,0.8)); z-index: 2; transform: translateY(15px); }
.steps .jet { position: absolute; top: 38px; left: 8%; height: 2px; background: linear-gradient(90deg, transparent, var(--mask)); transition: width 0.1s linear, left 0.1s linear; box-shadow: 0 0 8px var(--mask); z-index: 1; }
.step { position: relative; background: var(--panel); border: 1px solid var(--line); padding: 70px 24px 30px; border-radius: 4px; box-shadow: inset 0 0 20px rgba(0,0,0,0.5); backdrop-filter: blur(4px); }
.step .n { position: absolute; top: 20px; left: 24px; font: 16px "Russo One", sans-serif; color: var(--red-accent); opacity: 0.8; }
.step p { color: var(--muted); margin: 0; font-size: 15px; }
@media(max-width:860px){.steps{grid-template-columns:1fr}.steps .track, .steps .car, .steps .jet{display:none}.step{padding-top:50px}}

/* Features (Lair background) */
#features { background: url('/assets/lair.webp') center/cover fixed; }
#features::before { content: ''; position: absolute; inset: 0; background: rgba(10, 11, 13, 0.88); }
.feat { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 20px; position: relative; z-index: 2; }
.card { background: var(--panel); border: 1px solid var(--line); padding: 26px; border-radius: 4px; transition: transform 0.2s, border-color 0.2s; box-shadow: 0 8px 24px rgba(0,0,0,0.4); backdrop-filter: blur(6px); }
.card:hover { transform: translateY(-3px); border-color: var(--mask-d); }
.card p { color: var(--muted); margin: 0; font-size: 15px; }
.card .ic { width: 40px; height: 40px; border: 1px solid var(--mask-d); border-radius: 2px; display: grid; place-items: center; background: rgba(143,184,182,0.1); color: var(--mask); margin-bottom: 18px; font: 14px "Russo One", sans-serif; box-shadow: inset 0 0 10px rgba(143,184,182,0.2); }

/* Pricing */
.plans { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
@media(max-width:1100px){.plans{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.plans{grid-template-columns:1fr}}
.plan { display: flex; flex-direction: column; background: url('/assets/poster_bg.webp') center/cover; position: relative; padding: 26px; border-radius: 2px; box-shadow: 0 10px 30px rgba(0,0,0,0.6); overflow: hidden; border: 1px solid #333; }
.plan::before { content:''; position:absolute; inset:0; background: rgba(15,17,20,0.92); z-index: 1; }
.plan > * { position: relative; z-index: 2; }
.plan.hl::before { background: rgba(20,28,30,0.85); }
.plan.hl { border-color: var(--mask); box-shadow: 0 0 20px rgba(143,184,182,0.2); }
.plan .scene-tag { border-color: var(--mask); color: var(--mask); margin-bottom: 8px; border-left: none; padding: 0; font-size: 12px; }
.plan .price { font: 28px "Russo One", sans-serif; margin: 10px 0 2px; color: #fff; text-shadow: 1px 1px 2px #000; }
.plan .per { font-size: 12px; color: var(--muted); margin-bottom: 20px; text-transform: uppercase; letter-spacing: 0.05em; }
.plan ul { list-style: none; padding: 0; margin: 0 0 24px; flex: 1; }
.plan li { position: relative; padding-left: 24px; margin: 0 0 12px; font-size: 14px; color: #d0d6d9; }
.plan li::before { content: "■"; position: absolute; left: 0; top: 0; font-size: 10px; color: var(--mask); }
.plan li.off { color: #5a6268; }
.plan li.off::before { content: "□"; color: #4a5157; }
.plan .btn { justify-content: center; width: 100%; }

.addon { margin-top: 30px; display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
@media(max-width:760px){.addon{grid-template-columns:1fr}}
.addon .card { display: flex; gap: 20px; align-items: center; }
.addon .card .btn { margin-left: auto; flex-shrink: 0; }

/* Dossier / Cases */
#dossier { background: url('/assets/dossier.webp') center/cover fixed; }
#dossier::before { content: ''; position: absolute; inset: 0; background: rgba(10, 11, 13, 0.85); }
.dossier-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 24px; position: relative; z-index: 2; }
.dossier-card { background: #ded8c9; color: #1a1a1a; padding: 30px; position: relative; font-family: "PT Mono", monospace; box-shadow: 2px 4px 15px rgba(0,0,0,0.8); border-radius: 2px; transform: rotate(-1deg); }
.dossier-card:nth-child(even) { transform: rotate(1.5deg); }
.dossier-card::after { content: attr(data-stamp); position: absolute; top: 20px; right: 10px; color: rgba(179, 57, 57, 0.3); font-size: 24px; font-weight: bold; font-family: "Russo One", sans-serif; transform: rotate(-15deg); border: 3px solid rgba(179, 57, 57, 0.3); padding: 4px 8px; border-radius: 4px; pointer-events: none; }
.dossier-card h3 { font-family: "PT Mono", monospace; border-bottom: 2px solid #1a1a1a; padding-bottom: 8px; margin-bottom: 16px; font-size: 18px; }
.dossier-card p { font-size: 14px; line-height: 1.5; }

/* FAQ */
details { border: 1px solid var(--line); border-radius: 2px; background: var(--panel); padding: 0 20px; margin-bottom: 12px; }
summary { cursor: pointer; padding: 18px 0; font-family: "Russo One", sans-serif; font-size: 16px; list-style: none; letter-spacing: 0.02em; }
summary::-webkit-details-marker { display: none; }
summary::after { content: "+"; float: right; color: var(--mask); font: 20px "PT Mono", monospace; }
details[open] summary::after { content: "–"; }
details p { color: var(--muted); margin: 0 0 20px; font-size: 15px; }

footer { padding: 50px 0 80px; color: var(--muted); font-size: 14px; border-top: 1px solid var(--line); background: #050505; }
.foot { display: flex; flex-wrap: wrap; gap: 24px 40px; align-items: flex-start; }
.foot .logo { font-size: 18px; color: var(--muted); }
.foot .legal { display: flex; flex-wrap: wrap; gap: 12px 24px; }
.foot .legal a { color: var(--muted); text-transform: uppercase; font-size: 12px; letter-spacing: 0.05em; }
.foot .legal a:hover { color: var(--mask); }

/* Forms & Auth */
.view { display: none; }
.view.on { display: block; animation: fadeInView 0.3s; }
@keyframes fadeInView { from{opacity:0} to{opacity:1} }
.auth-box { max-width: 460px; margin: 80px auto; background: var(--panel); border: 1px solid var(--line); border-radius: 4px; padding: 40px; box-shadow: 0 20px 50px rgba(0,0,0,0.5); backdrop-filter: blur(8px); }
label { display: block; font-size: 12px; color: var(--muted); margin: 16px 0 8px; text-transform: uppercase; letter-spacing: 0.1em; font-family: "PT Mono", monospace; }
input[type=email], input[type=password], input[type=text], input[type=url], select, textarea { width: 100%; background: rgba(0,0,0,0.4); border: 1px solid var(--line); color: var(--text); padding: 12px 14px; font: 16px "PT Mono", monospace; border-radius: 2px; transition: border-color 0.2s; }
input:focus, select:focus, textarea:focus { outline: none; border-color: var(--mask); box-shadow: inset 0 0 8px rgba(143,184,182,0.1); }
.chk { display: flex; gap: 12px; align-items: flex-start; font-size: 14px; color: var(--muted); margin-top: 20px; }
.chk input { margin-top: 4px; cursor: pointer; }
.err { color: var(--led-r); font-size: 13px; min-height: 20px; margin-top: 10px; font-family: "PT Mono", monospace; }
.or { display: flex; align-items: center; gap: 16px; color: var(--muted); font-size: 12px; margin: 24px 0; text-transform: uppercase; letter-spacing: 0.1em; }
.or::before, .or::after { content: ""; flex: 1; height: 1px; background: var(--line); }
.tgbtn { width: 100%; justify-content: center; border-color: #2aa3df; color: #2aa3df; }
.tgbtn:hover { background: rgba(42,163,223,0.1); box-shadow: 0 0 15px rgba(42,163,223,0.2); }
.note { font-size: 14px; color: var(--muted); background: rgba(0,0,0,0.3); border-left: 3px solid var(--line); padding: 12px 16px; margin-top: 16px; }
.warn { border-left-color: var(--led-a); background: rgba(242,180,60,0.05); color: #d6b883; }
.warn b { color: var(--led-a); }
.danger { border-left-color: var(--led-r); background: rgba(224,82,74,0.05); color: #d69893; }

/* Cabinet */
.cab { display: grid; grid-template-columns: 240px 1fr; gap: 34px; padding-top: 50px; padding-bottom: 90px; }
@media(max-width:860px){.cab{grid-template-columns:1fr}}
.side { display: flex; flex-direction: column; gap: 6px; }
.side button { all: unset; cursor: pointer; padding: 12px 16px; border-radius: 2px; color: var(--muted); font-size: 14px; font-family: "Russo One", sans-serif; text-transform: uppercase; letter-spacing: 0.05em; border: 1px solid transparent; transition: all 0.2s; }
.side button.on, .side button:hover { background: rgba(143,184,182,0.1); color: var(--mask); border-color: rgba(143,184,182,0.2); }
@media(max-width:860px){.side{flex-direction:row;overflow-x:auto;scrollbar-width:none}.side::-webkit-scrollbar{display:none}.side button{white-space:nowrap}}
.pane { display: none; }
.pane.on { display: block; animation: fadeInView 0.3s; }
.userline { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin-bottom: 30px; color: var(--muted); font-size: 15px; background: var(--panel); padding: 14px 20px; border: 1px solid var(--line); border-radius: 2px; }
.pill { font: 12px "PT Mono", monospace; padding: 4px 12px; border-radius: 2px; border: 1px solid var(--line); color: var(--muted); text-transform: uppercase; }
.pill.ok { border-color: rgba(95,208,122,0.4); color: #5fd07a; background: rgba(95,208,122,0.05); }
.pill.no { border-color: rgba(242,180,60,0.4); color: #f2b43c; background: rgba(242,180,60,0.05); }
.tbl { width: 100%; border-collapse: collapse; font-size: 15px; }
.tbl th, .tbl td { text-align: left; padding: 14px 12px; border-bottom: 1px solid var(--line); }
.tbl th { color: var(--muted); font-weight: 400; font: 12px "PT Mono", monospace; text-transform: uppercase; letter-spacing: 0.1em; }
.empty { color: var(--muted); text-align: center; padding: 40px; border: 1px dashed var(--line); border-radius: 2px; font-family: "PT Mono", monospace; }
.row2 { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
@media(max-width:600px){.row2{grid-template-columns:1fr}}
.demo { position: fixed; right: 20px; bottom: 20px; z-index: 30; font: 12px "PT Mono", monospace; color: #000; background: var(--led-a); padding: 6px 12px; border-radius: 2px; font-weight: bold; box-shadow: 0 4px 10px rgba(242,180,60,0.3); }

/* ---- v3 eklemeleri: çok sayfalı yapı, SEO bölümleri ---- */
.intro[hidden] { display: none; }
.muted { color: var(--muted); }
.center { text-align: center; }
.narrow { max-width: 820px; }
.btn.ghost { border-color: var(--line); color: var(--muted); padding-left: 12px; padding-right: 12px; }
.nav .auth { align-items: center; }
@media (max-width: 560px) { .nav .auth .btn.sm { padding: 7px 10px; font-size: 12px; } .nav { gap: 10px; } .logo { font-size: 19px; } }
section.first, article.first { padding-top: 60px; }
.h1s { font-size: clamp(30px, 5vw, 48px); color: #fff; }
.h3 { font-size: 20px; letter-spacing: .05em; }
.crumbs { font: 13px "PT Mono", monospace; color: var(--muted); margin-bottom: 24px; }
.crumbs a { color: var(--muted); }
.prose { font-size: 17px; line-height: 1.75; color: #cfd5d8; }
.prose p { margin: 0 0 1.1em; }
.prose h2 { font-size: clamp(22px, 3vw, 28px); margin: 1.6em 0 .6em; }
.prose ul { padding-left: 1.2em; margin: 0 0 1.2em; }
.prose li { margin: .35em 0; }
.prose b { color: #fff; }
#what { background: radial-gradient(ellipse at 20% 0%, rgba(143,184,182,0.07), transparent 60%); }
/* AI yorum örnekleri */
.ex-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(290px, 1fr)); gap: 20px; }
.ex { margin: 0; background: var(--panel); border: 1px solid var(--line); border-radius: 4px; padding: 22px; }
.ex figcaption { font-size: 12px; color: var(--red-accent); text-transform: uppercase; letter-spacing: .12em; margin-bottom: 14px; }
.ex-post { background: rgba(255,255,255,0.04); border-radius: 10px 10px 10px 2px; padding: 12px 14px; color: #dfe4e6; margin-bottom: 12px; font-weight: 700; }
.ex-cm { background: rgba(143,184,182,0.12); border: 1px solid rgba(143,184,182,0.25); border-radius: 10px 10px 2px 10px; padding: 12px 14px; color: #dfe4e6; margin-left: 18px; }
.ex-l { display: block; font: 11px "PT Mono", monospace; color: var(--muted); text-transform: uppercase; letter-spacing: .1em; margin-bottom: 4px; font-weight: 400; }
/* karşılaştırma tablosu */
.tbl-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: 4px; background: var(--panel); }
.cmp { width: 100%; border-collapse: collapse; min-width: 640px; font-size: 15px; }
.cmp th, .cmp td { padding: 14px 16px; text-align: left; border-bottom: 1px solid var(--line); vertical-align: top; }
.cmp thead th { font: 13px "Russo One", sans-serif; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); }
.cmp tbody th { font-weight: 700; color: #dfe4e6; }
.cmp td { color: var(--muted); }
.cmp .us { color: var(--mask); background: rgba(143,184,182,0.06); }
.cmp thead .us { color: var(--mask); }
/* fiyat kartları: link buton */
.plan h3 { margin: .4em 0 0; color: #fff; }
.plan a.btn { justify-content: center; width: 100%; }
.addon-card { display: flex; gap: 20px; align-items: center; padding: 20px; }
.addon-card p { color: var(--muted); font-size: 14px; margin: 0; }
.addon-card h3 { margin: 0 0 6px; }
.addon-card .btn { margin-left: auto; flex-shrink: 0; }
/* blog */
.post-list { display: grid; gap: 18px; margin-top: 20px; }
.post-card h2 { margin: 0 0 10px; }
.post-card h2 a { color: #fff; }
.post-card p { margin-bottom: 16px; }
.cta-box { margin-top: 40px; padding: 28px; border: 1px solid var(--mask-d); border-radius: 4px; background: rgba(143,184,182,0.06); }
.cta-box h2 { font-size: 22px; }
#final { background: radial-gradient(ellipse at 50% 100%, rgba(179,57,57,0.12), transparent 60%); }
#final .btn { margin-top: 10px; }
.nf { min-height: 60vh; display: flex; align-items: center; }
footer .foot { justify-content: space-between; }
/* performans: sürekli yeniden çizimi kaldır (tahıl animasyonu + fixed arka plan + blend) */
.grain { animation: none; mix-blend-mode: normal; inset: 0; opacity: .06; }
#features, #dossier { background-attachment: scroll; }
.card, .step, .console, .auth-box { backdrop-filter: none; }
/* bölüm başlıkları karartma katmanının ÖNÜNDE olsun */
#features .sec-head, #dossier .sec-head { position: relative; z-index: 2; }
#features .sec-head p, #dossier .sec-head p { color: #b3bcc2; }
/* uçan araba: şeffaf, kırpılmış görsel, gidiş yönüne bakar (JS scaleX) */
.steps .car { width: 150px; height: auto; top: 17px; transform: scaleX(-1); transition: left .1s linear, transform .25s ease; filter: drop-shadow(0 6px 8px rgba(0,0,0,.7)); }
.steps .jet { transition: width .1s linear, left .1s linear, opacity .25s; }
.prose.legal h2 { font-size: 20px; color: var(--mask); margin-top: 1.8em; } .prose.legal { font-size: 15.5px; }
/* ---- telefon uyumu (375px) ---- */
.hero-in { grid-template-columns: minmax(0, 1.2fr) minmax(0, 0.8fr); }
h1, h2, .h1s { overflow-wrap: anywhere; hyphens: auto; }
h1 { font-size: clamp(26px, 8.2vw, 68px); }
@media (max-width: 960px) { .hero-in { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 600px) {
  section { padding: 56px 0; }
  h2 { font-size: 24px; }
  .h1s { font-size: 28px; }
  .hero { min-height: auto; }
  .hero-in { padding: 36px 16px 44px; gap: 28px; }
  .hero p.lead { font-size: 17px; }
  .hero .cta .btn { flex: 1 1 100%; justify-content: center; }
  .console div { min-width: 0; flex: 1 1 33%; padding: 10px 12px; }
  .console b { font-size: 17px; }
  .reveal { max-width: 300px; }
  .wrap { padding: 0 16px; }
  .sec-head { margin-bottom: 28px; }
  .sec-head p { font-size: 16px; }
  .step { padding: 50px 18px 22px; }
  .card { padding: 20px; }
  .addon-card { flex-wrap: wrap; }
  .addon-card .btn { margin-left: 0; width: 100%; justify-content: center; }
  .dossier-card, .dossier-card:nth-child(even) { transform: none; padding: 22px; }
  .dossier-card::after { font-size: 16px; top: 12px; right: 8px; }
  .ex-cm { margin-left: 8px; }
  .auth-box { margin: 36px auto; padding: 26px 20px; }
  footer .foot { flex-direction: column; gap: 18px; }
  /* karşılaştırma tablosu -> kartlar */
  .tbl-wrap { border: none; background: none; overflow: visible; }
  .cmp { min-width: 0; }
  .cmp thead { display: none; }
  .cmp, .cmp tbody, .cmp tr, .cmp th, .cmp td { display: block; width: 100%; }
  .cmp tr { background: var(--panel); border: 1px solid var(--line); border-radius: 4px; margin-bottom: 14px; padding: 6px 0; }
  .cmp tbody th { border-bottom: 1px solid var(--line); padding: 12px 16px; font-size: 15px; }
  .cmp td { border: none; padding: 8px 16px; display: flex; justify-content: space-between; gap: 12px; }
  .cmp td::before { content: attr(data-label); font: 12px "PT Mono", monospace; color: var(--muted); text-transform: uppercase; letter-spacing: .05em; flex: 0 0 42%; }
  .cmp td.us { background: rgba(143,184,182,0.08); }
}
@media (max-width: 400px) {
  .logo { font-size: 16px; letter-spacing: .06em; }
  .nav { gap: 8px; }
  .nav .auth { gap: 6px; }
  .nav .auth .btn.sm { padding: 6px 8px; font-size: 11px; letter-spacing: .02em; }
}
.hero-in { min-width: 0; max-width: 100%; } .hero-in > div { min-width: 0; }
/* dil öneri şeridi */
.langbar { position: fixed; left: 12px; right: 12px; bottom: 12px; z-index: 50; display: flex; flex-wrap: wrap; align-items: center; gap: 10px;
  background: #14171b; border: 1px solid var(--mask-d); border-radius: 4px; padding: 12px 14px; box-shadow: 0 8px 30px rgba(0,0,0,.6); font-size: 14px; max-width: 560px; margin: 0 auto; }
.langbar span { flex: 1 1 200px; color: #d6dcdf; }
/* örnekler: sahte müşteri etiketi + link */
.ex-client { font: 12px "PT Mono", monospace; color: #dfe4e6; background: rgba(196,30,36,.10); border: 1px dashed rgba(196,30,36,.45); border-radius: 6px; padding: 6px 10px; margin: 0 0 12px; }
.ex-client span { color: var(--muted); text-transform: uppercase; letter-spacing: .08em; }
.ex-client em { color: var(--muted); font-style: normal; }
.ex-link { color: #6ab0ff; text-decoration: underline; text-underline-offset: 2px; overflow-wrap: anywhere; cursor: default; }
