/* Video Atölyesi: ortak tasarım sözleşmesi (değişkenler, sıfırlama, yardımcılar, düğmeler).
   Bölüm stilleri: video.css (üst bilgi, hero, durum şeridi, nasıl çalışır, CTA, alt bilgi),
   studio.css (stüdyo/form/durum ekranları), pricing.css (fiyatlar, SSS). */
:root {
  color-scheme: dark;
  --bg: #070B14;
  --bg-2: #0B1120;
  --surface: rgba(16, 22, 38, .72);
  --surface-solid: #101626;
  --surface-2: #151C30;
  --line: rgba(255, 255, 255, .09);
  --line-2: rgba(255, 255, 255, .16);
  --ink: #F4F6FB;
  --ink-2: #C6CEDF;
  --mute: #9AA6BF;
  --violet: #7C5CFF;
  --coral: #FF5C8A;
  --amber: #FFB84D;
  --cyan: #35E0D0;
  --danger: #FF6B7A;
  --warn: #FFC15E;
  --grad: linear-gradient(90deg, #6C5CFF 0%, #B25DDC 38%, #FF5C8A 68%, #FFAA4D 100%);
  --grad-soft: linear-gradient(135deg, rgba(124, 92, 255, .22), rgba(255, 92, 138, .14) 55%, rgba(255, 184, 77, .10));
  --r-sm: 12px;
  --r-md: 16px;
  --r-lg: 22px;
  --r-xl: 28px;
  --shadow-glow: 0 0 0 1px rgba(124, 92, 255, .35), 0 18px 60px -12px rgba(124, 92, 255, .45);
  --font-ui: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-display: "Plus Jakarta Sans", "Inter", system-ui, sans-serif;
  --maxw: 1200px;
  --gutter: clamp(16px, 4vw, 32px);
  --header-h: 68px;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: calc(var(--header-h) + 12px); -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; } }
body {
  margin: 0;
  background: var(--bg);
  color: var(--ink);
  font-family: var(--font-ui);
  font-size: 16px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-x: hidden;
}
body.nav-open { overflow: hidden; }
img, svg, video { max-width: 100%; display: block; }
h1, h2, h3, h4 { font-family: var(--font-display); margin: 0; letter-spacing: -.02em; line-height: 1.1; color: var(--ink); }
p { margin: 0; }
ul, ol { margin: 0; padding: 0; list-style: none; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; cursor: pointer; }
:focus-visible { outline: 2px solid var(--cyan); outline-offset: 3px; border-radius: 6px; }
[hidden] { display: none !important; }

.wrap, .container { width: 100%; max-width: var(--maxw); margin-inline: auto; padding-inline: var(--gutter); }
.sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.skip-link { position: absolute; left: 12px; top: -48px; z-index: 200; background: var(--ink); color: #0b1020; padding: 10px 16px; border-radius: 10px; font-weight: 600; transition: top .2s; }
.skip-link:focus { top: 12px; }
.no-break { white-space: nowrap; }

.gradient-text { background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; -webkit-text-fill-color: transparent; }

.sec-title { font-size: clamp(28px, 4vw, 44px); font-weight: 800; text-align: center; }
.sec-sub { color: var(--mute); text-align: center; margin-top: 10px; }

/* Düğmeler */
.btn-grad {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  background: var(--grad); color: #fff; font-weight: 700; font-family: var(--font-display);
  border: 0; border-radius: 14px; padding: 12px 22px; min-height: 46px;
  box-shadow: 0 10px 30px -8px rgba(255, 92, 138, .55), inset 0 1px 0 rgba(255, 255, 255, .28);
  transition: transform .18s ease, filter .18s ease, box-shadow .18s ease;
}
.btn-grad:hover { transform: translateY(-2px); filter: brightness(1.08); box-shadow: 0 16px 38px -8px rgba(255, 92, 138, .65), inset 0 1px 0 rgba(255, 255, 255, .3); }
.btn-grad:active { transform: translateY(0); }
.btn-grad svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.btn-lg { min-height: 56px; padding: 14px 30px; font-size: 17px; border-radius: 16px; }
.btn-text { display: inline-flex; align-items: center; gap: 8px; color: var(--ink-2); font-weight: 600; padding: 12px 4px; transition: color .2s; }
.btn-text:hover { color: #fff; }
.btn-text svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }

/* Çerez bilgisi (main.js ekler) */
.cookie-notice {
  position: fixed; left: 16px; right: 16px; bottom: 16px; z-index: 150; max-width: 760px; margin-inline: auto;
  display: flex; gap: 14px; align-items: center; justify-content: space-between;
  background: rgba(16, 22, 38, .92); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px);
  border: 1px solid var(--line-2); border-radius: var(--r-md); padding: 12px 16px; font-size: 14px; color: var(--ink-2);
  box-shadow: 0 20px 50px -12px rgba(0, 0, 0, .6);
}
.cookie-notice a { color: var(--ink); text-decoration: underline; }
.cookie-notice button { flex: none; background: var(--grad); color: #fff; border: 0; border-radius: 10px; padding: 8px 16px; font-weight: 600; }
@media (max-width: 560px) { .cookie-notice { flex-direction: column; align-items: stretch; text-align: left; } }

/* Görününce belirme (site.js .rv/.is-in ekler; JS yoksa içerik zaten görünür) */
.rv { opacity: 0; transform: translateY(14px); transition: opacity .6s ease, transform .6s ease; }
.rv.is-in { opacity: 1; transform: none; }