/* =========================================================
   Vita Medya — Tasarım Sistemi (koyu / sinematik reskin)
   Kaynak: Claude design "Vita Medya.dc.html"
   Palet #080E14 · accent #1BA0D7 · Space Grotesk + Instrument Serif
   ========================================================= */

:root {
	--vm-bg:        #080E14;
	--vm-text:      #EAF0F4;
	--vm-muted:     #9AA9B5;
	--vm-muted2:    #8A98A5;
	--vm-dim:       #6D7E8B;
	--vm-dim2:      #55636E;
	--accent:       #1BA0D7;
	--accent-ink:   #050A0F;
	--surface:      linear-gradient(150deg, #0E151D, #0A0F16);
	--line:         rgba(255,255,255,0.08);
	--line-12:      rgba(255,255,255,0.12);
	--line-16:      rgba(255,255,255,0.16);
	--acc-04:       rgba(27,160,207,0.04);
	--acc-10:       rgba(27,160,207,0.10);
	--acc-28:       rgba(27,160,207,0.28);
	--acc-40:       rgba(27,160,207,0.40);

	--sans: 'Space Grotesk', system-ui, -apple-system, sans-serif;
	--serif: 'Instrument Serif', Georgia, serif;
	--mono: ui-monospace, 'SF Mono', Menlo, monospace;

	--maxw: 1200px;
}

/* ---------- Temel ---------- */
html { scroll-behavior: smooth; }
body {
	background: var(--vm-bg);
	color: var(--vm-text);
	font-family: var(--sans);
	overflow-x: hidden;
}
/* Sabit arka plan parıltısı */
body::before {
	content: ""; position: fixed; inset: 0; pointer-events: none; z-index: 0;
	background:
		radial-gradient(720px 480px at 78% -6%, rgba(27,160,207,0.18), transparent 60%),
		radial-gradient(620px 520px at 8% 108%, rgba(27,160,207,0.10), transparent 60%);
}
.site { position: relative; z-index: 1; background: transparent; }
a { color: var(--accent); text-decoration: none; transition: color .16s ease; }
a:hover { color: var(--vm-text); }
::selection { background: var(--accent); color: var(--accent-ink); }
::-webkit-scrollbar { width: 10px; }
::-webkit-scrollbar-track { background: #060B10; }
::-webkit-scrollbar-thumb { background: #1b2732; border-radius: 20px; }

.vm-container, .k-container { max-width: var(--maxw); margin-inline: auto; padding-inline: 28px; }
.k-section { padding-block: clamp(56px, 7vw, 90px); position: relative; z-index: 1; }
.k-section--tint { background: rgba(255,255,255,0.015); }

/* ---------- Tipografi ---------- */
.vm-eyebrow, .k-kicker {
	display: inline-flex; align-items: center; gap: 10px;
	font-size: 12px; letter-spacing: 3px; text-transform: uppercase; color: var(--accent);
	font-weight: 500;
}
.vm-eyebrow::before { content: ""; width: 26px; height: 1px; background: var(--accent); }
.vm-serif { font-family: var(--serif); font-style: italic; font-weight: 400; color: var(--accent); }
h1, h2, h3, h4 { font-family: var(--sans); font-weight: 500; letter-spacing: -0.02em; color: var(--vm-text); }
.vm-h1, .k-h1 { font-size: clamp(38px, 5vw, 68px); line-height: 1.03; font-weight: 500; margin: 0; }
.vm-h2, .k-h2 { font-size: clamp(28px, 3.2vw, 42px); line-height: 1.1; font-weight: 500; margin: 0; }
.k-lead { font-size: 18px; line-height: 1.7; color: var(--vm-muted); }
.vm-mono { font-family: var(--mono); font-size: 12px; color: var(--vm-dim); letter-spacing: 1px; }

/* ---------- Butonlar (pill) ---------- */
.k-btn, .vm-btn {
	display: inline-flex; align-items: center; gap: 8px; cursor: pointer;
	padding: 15px 30px; border-radius: 999px; font-family: var(--sans);
	font-weight: 600; font-size: 15px; line-height: 1; border: 0;
	transition: background .18s ease, color .18s ease, border-color .18s ease, transform .18s ease;
}
.k-btn--primary, .k-btn--brand, .vm-btn--accent { background: var(--accent); color: var(--accent-ink); }
.k-btn--primary:hover, .k-btn--brand:hover, .vm-btn--accent:hover { background: var(--vm-text); color: var(--accent-ink); }
.k-btn--ghost, .vm-btn--ghost { background: transparent; color: var(--vm-text); border: 1px solid var(--line-16); }
.k-btn--ghost:hover, .vm-btn--ghost:hover { border-color: var(--accent); color: var(--accent); }

/* =========================================================
   HEADER / NAV (GeneratePress override → glassmorphic)
   ========================================================= */
.site-header {
	position: sticky; top: 0; z-index: 50;
	background: rgba(8,14,20,0.72) !important;
	backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
	border-bottom: 1px solid rgba(255,255,255,0.07);
}
.site-header .inside-header {
	max-width: var(--maxw); margin: 0 auto; padding: 14px 28px;
	display: flex; align-items: center; justify-content: space-between; gap: 24px;
}
.main-title, .site-description, .site-branding { display: none !important; }
.site-logo { margin: 0; }
.site-logo img, .header-image.is-logo-image, .custom-logo { max-height: 58px; width: auto; height: auto; }
@media (max-width: 768px){ .site-logo img, .custom-logo { max-height: 46px; } }

/* Nav menü pill'leri */
.main-navigation { background: transparent !important; flex: 1; }
.main-navigation .inside-navigation { justify-content: flex-end; }
.main-navigation .main-nav > ul { display: flex; align-items: center; gap: 4px; }
.main-navigation .main-nav ul li a,
.main-navigation .menu li a {
	color: var(--vm-muted2) !important; font-size: 14px; font-weight: 500;
	padding: 8px 14px !important; border-radius: 999px; line-height: 1;
	background: transparent; transition: color .16s ease, background .16s ease;
}
.main-navigation .main-nav ul li a:hover,
.main-navigation .menu li.current-menu-item > a,
.main-navigation .menu li.current-menu-ancestor > a {
	color: var(--vm-text) !important; background: rgba(27,160,207,0.12);
}
/* alt menü (dropdown) koyu */
.main-navigation ul ul { background: #0C131B !important; border: 1px solid var(--line) !important; border-radius: 12px; padding: 6px !important; }
.main-navigation ul ul li a { color: var(--vm-muted) !important; }

/* Header CTA → @vitamedyaa pill */
.kivanc-header-cta {
	display: inline-flex; align-items: center; gap: 8px; margin: 0 0 0 8px;
	padding: 9px 16px; border: 1px solid var(--line-16); border-radius: 999px;
	color: var(--vm-text) !important; font-size: 13px; font-weight: 500; white-space: nowrap;
	transition: border-color .16s ease, color .16s ease;
}
.kivanc-header-cta:hover { border-color: var(--accent); color: var(--accent) !important; }

/* =========================================================
   MOBİL NAV — sağa dayalı hamburger + tam-ekran off-canvas
   ========================================================= */
.vm-mobbar { display: none; }
.vm-offcanvas { display: none; }

.vm-mobnav-ig { color: var(--vm-text); display: inline-flex; align-items: center; padding: 6px; }
.vm-mobnav-ig:hover { color: var(--accent); }
.vm-burger { width: 46px; height: 42px; display: inline-flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px; background: rgba(255,255,255,0.06); border: 1px solid var(--line-16); border-radius: 10px; cursor: pointer; padding: 0; }
.vm-burger span { display: block; width: 22px; height: 2px; background: var(--vm-text); border-radius: 2px; }

@media (max-width: 768px){
	.menu-toggle { display: none !important; }
	.kivanc-header-cta { display: none !important; }
	.main-navigation { display: none !important; }
	.vm-mobbar { display: flex; position: fixed; top: 0; right: 18px; height: 86px; align-items: center; gap: 14px; z-index: 55; }
	.vm-offcanvas { display: block; }
}

/* Off-canvas panel */
.vm-offcanvas { position: fixed; inset: 0; z-index: 200; pointer-events: none; }
.vm-offcanvas.is-open { pointer-events: auto; }
.vm-offcanvas__overlay { position: absolute; inset: 0; background: rgba(4,8,12,0.6); opacity: 0; pointer-events: none; transition: opacity .3s ease; }
.vm-offcanvas.is-open .vm-offcanvas__overlay { opacity: 1; pointer-events: auto; }
.vm-offcanvas__panel {
	position: absolute; top: 0; right: 0; height: 100%; width: 100%;
	background: #0a1017; border-left: 1px solid var(--line);
	display: flex; flex-direction: column; padding: 20px 24px 28px;
	transform: translateX(100%);
	transition: transform .34s cubic-bezier(.22,.61,.36,1);
	will-change: transform;
}
.vm-offcanvas.is-open .vm-offcanvas__panel { transform: translateX(0); }
.vm-offcanvas__top { display: flex; align-items: center; justify-content: space-between; padding-bottom: 18px; border-bottom: 1px solid var(--line); }
.vm-offcanvas__logo { height: 42px; width: auto; }
.vm-offcanvas__close { width: 46px; height: 46px; font-size: 30px; line-height: 1; color: var(--vm-text); background: rgba(255,255,255,0.06); border: 1px solid var(--line-16); border-radius: 10px; cursor: pointer; display: flex; align-items: center; justify-content: center; }
.vm-offcanvas__close:hover { border-color: var(--accent); color: var(--accent); }
.vm-offcanvas__menu { list-style: none; margin: 0; padding: 20px 0; flex: 1; overflow-y: auto; }
.vm-offcanvas__menu > li { border-bottom: 1px solid rgba(255,255,255,0.06); }
.vm-offcanvas__menu > li > a { display: block; padding: 16px 4px; font-size: 22px; font-weight: 500; color: var(--vm-text); letter-spacing: -.01em; }
.vm-offcanvas__menu > li > a:hover { color: var(--accent); }
.vm-offcanvas__menu .sub-menu { list-style: none; margin: 0 0 10px; padding: 4px 0 0 16px; }
.vm-offcanvas__menu .sub-menu a { display: block; padding: 9px 4px; font-size: 15px; color: var(--vm-muted); }
.vm-offcanvas__menu .sub-menu a:hover { color: var(--accent); }
.vm-offcanvas__bottom { border-top: 1px solid var(--line); padding-top: 20px; }
.vm-offcanvas__follow { font-size: 12px; letter-spacing: 2px; text-transform: uppercase; color: var(--vm-dim); }
.vm-offcanvas__social { margin-top: 14px; display: flex; gap: 18px; }
.vm-offcanvas__social a { display: inline-flex; align-items: center; gap: 10px; color: var(--vm-text); font-weight: 500; }
.vm-offcanvas__social a:hover { color: var(--accent); }
@media (prefers-reduced-motion: reduce){ .vm-offcanvas__panel, .vm-offcanvas__overlay { transition: none; } }

/* =========================================================
   Section head (başlık + link)
   ========================================================= */
.vm-sec-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin-bottom: 40px; flex-wrap: wrap; }
.vm-sec-head__link { color: var(--vm-muted); font-size: 14px; }
.vm-sec-head__link:hover { color: var(--accent); }
.k-sec-head { margin-bottom: clamp(28px, 4vw, 44px); max-width: 820px; }
.k-sec-head.center { margin-inline: auto; text-align: center; }

/* =========================================================
   Kartlar / grid genel
   ========================================================= */
.k-grid { display: grid; gap: 18px; }
.k-grid--3 { grid-template-columns: repeat(3, 1fr); }
.k-grid--2 { grid-template-columns: repeat(2, 1fr); }
@media (max-width: 900px){ .k-grid--3 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 620px){ .k-grid--3, .k-grid--2 { grid-template-columns: 1fr; } }

/* Hizmet önizleme kartı (anasayfa) */
.vm-scard {
	display: block; padding: 30px 26px; border: 1px solid var(--line); border-radius: 14px;
	background: rgba(255,255,255,0.015); transition: border-color .18s ease, background .18s ease, transform .18s ease;
}
.vm-scard:hover { border-color: var(--acc-40); background: var(--acc-04); transform: translateY(-3px); }
.vm-scard__no { font-family: var(--mono); font-size: 13px; color: var(--accent); margin-bottom: 20px; }
.vm-scard h3 { font-size: 18px; font-weight: 600; margin: 0 0 10px; }
.vm-scard p { font-size: 14px; line-height: 1.6; color: var(--vm-muted2); margin: 0; }

/* Hizmet liste satırı (Hizmetler sayfası) */
.vm-slist { border-top: 1px solid var(--line); }
.vm-srow { display: grid; grid-template-columns: 90px 1fr 1.2fr; gap: 30px; padding: 34px 6px; border-bottom: 1px solid var(--line); align-items: baseline; transition: background .16s ease; }
.vm-srow:hover { background: rgba(27,160,207,0.03); }
.vm-srow__no { font-family: var(--mono); font-size: 14px; color: var(--accent); }
.vm-srow h3 { font-size: clamp(22px, 2.4vw, 30px); font-weight: 600; margin: 0; letter-spacing: -0.01em; }
.vm-srow p { font-size: 15px; line-height: 1.7; color: var(--vm-muted2); margin: 0; }
@media (max-width: 720px){ .vm-srow { grid-template-columns: 60px 1fr; } .vm-srow p { grid-column: 1 / -1; } }

/* Proje / iş kutusu (görselli) */
.vm-ptile { position: relative; display: block; border-radius: 16px; overflow: hidden; border: 1px solid var(--line); aspect-ratio: 16/10; background: var(--surface); transition: border-color .18s ease; }
.vm-ptile:hover { border-color: rgba(27,160,207,0.5); }
.vm-ptile img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.vm-ptile:hover img { transform: scale(1.05); }
.vm-ptile__ov { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: space-between; padding: 22px; background: linear-gradient(180deg, transparent 40%, rgba(6,11,16,0.85)); z-index: 1; }
.vm-ptile__cat { align-self: flex-start; font-size: 11px; letter-spacing: 2px; text-transform: uppercase; color: #eaf6fb; border: 1px solid var(--acc-40); padding: 5px 12px; border-radius: 999px; background: rgba(6,11,16,0.68); backdrop-filter: blur(7px); -webkit-backdrop-filter: blur(7px); box-shadow: 0 2px 10px rgba(0,0,0,0.28); }
.vm-ptile__row { display: flex; justify-content: space-between; align-items: flex-start; }
.vm-ptile__year { font-family: var(--mono); font-size: 12px; color: #dfeaf1; text-shadow: 0 1px 6px rgba(0,0,0,0.75); }
.vm-ptile h3 { font-size: 22px; font-weight: 600; margin: 0 0 6px; }
.vm-ptile p { font-size: 14px; line-height: 1.55; color: var(--vm-muted); margin: 0; }

/* ---------- Hero video slider ---------- */
.vm-hero__media.is-hslider video { transition: opacity .25s ease; }
.vm-hero__media.is-switching video { opacity: .35; }
.vm-hs__nav { position: absolute; top: 50%; transform: translateY(-50%); z-index: 3; width: 44px; height: 44px; padding: 0; border-radius: 999px; border: 1px solid var(--line-16); background: rgba(8,14,20,0.55); color: #fff; line-height: 0; display: flex; align-items: center; justify-content: center; cursor: pointer; backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); transition: background .18s, border-color .18s; }
.vm-hs__nav svg { display: block; }
.vm-hs__nav:hover { background: var(--accent); border-color: var(--accent); }
.vm-hs__prev { left: 14px; }
.vm-hs__next { right: 14px; }
.vm-hs__counter { position: absolute; top: 18px; right: 18px; z-index: 3; font-family: var(--mono); font-size: 12px; letter-spacing: 1px; color: #cfe0ea; background: rgba(8,14,20,0.55); border: 1px solid var(--line-16); border-radius: 999px; padding: 4px 10px; backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); }
.vm-hs__counter b { color: #fff; font-weight: 700; }

/* ---------- Proje ekibi (credits) — otomatik hizalı sütun ---------- */
.vm-credits { margin: 10px 0 6px; }
.vm-credits__title { font-size: 22px; font-weight: 600; margin: 0 0 14px; }
.vm-credits__list { list-style: none; margin: 0; padding: 0; max-width: 640px; display: grid; grid-template-columns: auto 1fr; border-top: 1px solid var(--line); }
.vm-credits__row { display: contents; }
.vm-credits__role, .vm-credits__name { display: flex; align-items: center; padding-top: 9px; padding-bottom: 9px; border-bottom: 1px solid var(--line); }
.vm-credits__role { justify-content: flex-end; padding-right: 28px; white-space: nowrap; font-size: 12px; letter-spacing: 1.5px; text-transform: uppercase; color: var(--accent); }
.vm-credits__name { font-size: 16px; font-weight: 600; color: var(--vm-text); }
@media (max-width: 560px){ .vm-credits__role { padding-right: 16px; } }

/* ---------- Takım Arkadaşları (giriş yapınca) ---------- */
.vm-team { margin-top: 64px; }
.vm-team__head { display: flex; align-items: baseline; gap: 14px; flex-wrap: wrap; margin-bottom: 26px; }
.vm-team__note { font-size: 12px; color: var(--vm-dim); border: 1px dashed var(--line-16); border-radius: 999px; padding: 3px 10px; }
.vm-team__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 18px; }
.vm-team__card { border: 1px solid var(--line); border-radius: 16px; overflow: hidden; background: var(--surface); transition: border-color .18s ease; }
.vm-team__card:hover { border-color: rgba(27,160,207,0.5); }
.vm-team__photo { aspect-ratio: 1/1; background: #0e1720; }
.vm-team__photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.vm-team__body { padding: 14px 16px 16px; position: relative; }
.vm-team__role { font-size: 11px; letter-spacing: 1.5px; text-transform: uppercase; color: var(--accent); }
.vm-team__name { font-size: 18px; font-weight: 600; margin: 4px 0 0; }
.vm-team__ig { position: absolute; top: 14px; right: 14px; color: var(--vm-muted); display: inline-flex; }
.vm-team__ig:hover { color: var(--accent); }

/* =========================================================
   CTA bandı
   ========================================================= */
.vm-ctaband, .k-ctaband {
	margin: 60px 0 0; padding: 64px 48px; border-radius: 22px;
	border: 1px solid var(--acc-28);
	background: linear-gradient(135deg, rgba(27,160,207,0.10), rgba(27,160,207,0.02));
	text-align: center;
}
.vm-ctaband p, .k-ctaband p { font-family: var(--serif); font-style: italic; font-size: clamp(28px, 4vw, 50px); line-height: 1.15; margin: 0 auto; max-width: 760px; color: var(--vm-text); }
.k-ctaband h2 { font-family: var(--serif); font-style: italic; font-weight: 400; color: var(--vm-text); }

/* =========================================================
   Prose (iç içerik)
   ========================================================= */
.k-prose { max-width: 780px; color: var(--vm-muted); }
.k-prose h2 { font-size: 26px; margin: 1.5em 0 .5em; color: var(--vm-text); font-weight: 600; }
.k-prose h3 { font-size: 20px; margin: 1.3em 0 .4em; color: var(--vm-text); font-weight: 600; }
.k-prose p { line-height: 1.8; margin: 0 0 1em; color: var(--vm-muted); }
.k-prose strong { color: var(--vm-text); }
.k-prose em { font-family: var(--serif); font-style: italic; color: var(--accent); }
.k-prose ul { line-height: 1.7; padding-left: 1.1em; }
.k-prose li { margin-bottom: .5em; }
.k-prose a { color: var(--accent); }

/* İç sayfa hero */
.k-pagehero { padding: 92px 0 10px; }
.k-pagehero__inner { max-width: 860px; }
.k-pagehero h1 { font-size: clamp(34px, 4.6vw, 60px); line-height: 1.05; font-weight: 500; margin: 14px 0 0; }
.k-pagehero p { font-size: 18px; line-height: 1.7; color: var(--vm-muted); margin: 24px 0 0; max-width: 620px; }
.k-breadcrumb { font-family: var(--mono); font-size: 12px; color: var(--vm-dim); }
.k-breadcrumb a { color: var(--vm-dim); }
.k-breadcrumb a:hover { color: var(--accent); }

/* =========================================================
   FOOTER
   ========================================================= */
/* GeneratePress'in sayfa başı dev öne-çıkan-görsel banner'ını kapat.
   Görselleri kendi tasarımımızda (hizmet yan görseli, proje medyası) gösteriyoruz. */
.page-header-image, .featured-image.page-header-image { display: none !important; }

.site-info { display: none !important; }
.kivanc-footer { position: relative; z-index: 1; border-top: 1px solid rgba(255,255,255,0.07); margin-top: 20px; background: transparent; }
.kivanc-footer__bar { max-width: var(--maxw); margin: 0 auto; padding: 48px 28px; display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap; }
.kivanc-footer img { height: 30px; width: auto; opacity: .9; }
.kivanc-footer__slogan { font-family: var(--serif); font-style: italic; font-size: 18px; color: var(--vm-dim); margin: 0; }
.kivanc-footer__meta { display: flex; gap: 22px; font-size: 13px; color: var(--vm-dim); align-items: center; }
.kivanc-footer__meta a { color: var(--vm-muted2); }
.kivanc-footer__meta a:hover { color: var(--accent); }
.kivanc-footer img { height: 40px; }
.kivanc-footer__credit { border-top: 1px solid rgba(255,255,255,0.05); text-align: center; padding: 18px 28px; font-size: 12px; color: var(--vm-dim2); letter-spacing: .3px; }
.kivanc-footer__credit a { color: var(--vm-muted2); }
.kivanc-footer__credit a:hover { color: var(--accent); }

/* =========================================================
   HAKKIMIZDA
   ========================================================= */
.vm-about-paras { display: grid; grid-template-columns: 1fr 1fr; gap: 40px; margin-top: 56px; }
@media (max-width: 760px){ .vm-about-paras { grid-template-columns: 1fr; } }
.vm-about-paras p { font-size: 17px; line-height: 1.8; color: var(--vm-muted); margin: 0; }
.vm-vgrid { display: grid; grid-template-columns: repeat(3,1fr); gap: 18px; margin-top: 64px; }
@media (max-width: 820px){ .vm-vgrid { grid-template-columns: 1fr; } }
.vm-vcard { padding: 34px 28px; border: 1px solid var(--line); border-radius: 16px; background: rgba(255,255,255,0.015); }
.vm-vcard__no { font-family: var(--serif); font-size: 40px; color: var(--accent); line-height: 1; margin-bottom: 18px; }
.vm-vcard h3 { font-size: 19px; font-weight: 600; margin: 0 0 12px; }
.vm-vcard p { font-size: 14px; line-height: 1.65; color: var(--vm-muted2); margin: 0; }
.vm-neden { margin-top: 72px; padding: 56px 44px; border-radius: 20px; border: 1px solid var(--line); background: var(--surface); display: grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items: center; }
@media (max-width: 760px){ .vm-neden { grid-template-columns: 1fr; } }
.vm-neden__q { font-family: var(--serif); font-style: italic; font-size: 30px; line-height: 1.25; margin: 0; color: var(--vm-text); }
.vm-neden ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 18px; }
.vm-neden li { display: flex; gap: 14px; font-size: 15px; line-height: 1.6; color: #C6D2DB; }
.vm-neden li::before { content: "—"; color: var(--accent); }

/* =========================================================
   HİZMET DETAY (checklist + FAQ + yan)
   ========================================================= */
.vm-svc { display: grid; grid-template-columns: 1fr 320px; gap: 44px; align-items: start; margin-top: 10px; }
@media (max-width: 860px){ .vm-svc { grid-template-columns: 1fr; } }
.vm-svc__side { position: sticky; top: 92px; display: grid; gap: 18px; }
.vm-svc__side img { width: 100%; height: 220px; object-fit: cover; border-radius: 14px; border: 1px solid var(--line); }
.vm-svc__cta { padding: 24px; border: 1px solid var(--line); border-radius: 16px; background: var(--surface); }
.vm-svc__cta h3 { font-size: 18px; margin: 0 0 6px; }
.vm-svc__cta p { color: var(--vm-muted); font-size: 14px; margin: 0 0 14px; }

/* Mobil: görsel en üstte, sidebar gizli, sabit alt teklif barı */
.vm-svc__mobileimg { display: none; }
.vm-mobcta { display: none; }
@media (max-width: 860px){
	.vm-svc__mobileimg { display: block; width: 100%; height: auto; max-height: 300px; object-fit: cover; border-radius: 14px; border: 1px solid var(--line); margin-bottom: 22px; }
	.vm-svc__side { display: none; }
	.vm-mobcta {
		display: flex; position: fixed; bottom: 0; left: 0; right: 0; z-index: 60;
		align-items: center; justify-content: space-between; gap: 14px; padding: 11px 16px;
		background: rgba(8,14,20,0.94); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
		border-top: 1px solid var(--line-16);
	}
	.vm-mobcta__txt { display: flex; flex-direction: column; line-height: 1.25; }
	.vm-mobcta__txt strong { color: var(--vm-text); font-size: 15px; }
	.vm-mobcta__txt span { color: var(--vm-muted); font-size: 12px; }
	.vm-mobcta .vm-btn { padding: 12px 22px; font-size: 14px; white-space: nowrap; }
	.vm-svc-single .kivanc-footer { padding-bottom: 84px; }
}
.vm-checklist { list-style: none; margin: .5em 0; padding: 0; display: grid; gap: 12px; }
.vm-checklist li { position: relative; padding-left: 28px; line-height: 1.55; color: var(--vm-muted); }
.vm-checklist li::before { content: "→"; position: absolute; left: 0; color: var(--accent); font-weight: 700; }
.vm-faq { display: grid; gap: 10px; margin-top: .6em; }
.vm-faq__item { border: 1px solid var(--line); border-radius: 12px; background: rgba(255,255,255,0.015); overflow: hidden; }
.vm-faq__item summary { cursor: pointer; list-style: none; padding: 16px 20px; font-weight: 600; color: var(--vm-text); display: flex; justify-content: space-between; gap: 12px; align-items: center; }
.vm-faq__item summary::-webkit-details-marker { display: none; }
.vm-faq__item summary::after { content: "+"; color: var(--accent); font-size: 20px; transition: transform .2s ease; }
.vm-faq__item[open] summary::after { transform: rotate(45deg); }
.vm-faq__a { padding: 0 20px 16px; color: var(--vm-muted); line-height: 1.6; }

/* =========================================================
   BLOG (design list)
   ========================================================= */
.vm-blist { display: flex; flex-direction: column; border-top: 1px solid var(--line); }
.vm-brow { display: grid; grid-template-columns: 108px 1fr auto; gap: 24px; padding: 22px 6px; border-bottom: 1px solid var(--line); align-items: center; transition: background .16s ease; }
.vm-brow:hover { background: rgba(27,160,207,0.03); }
.vm-brow__thumb { width: 108px; height: 76px; border-radius: 10px; overflow: hidden; background: var(--surface); border: 1px solid var(--line); display: block; }
.vm-brow__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .3s ease; }
.vm-brow:hover .vm-brow__thumb img { transform: scale(1.06); }
.vm-brow__body { display: grid; gap: 6px; }
.vm-brow__tag { font-size: 11px; letter-spacing: 1px; text-transform: uppercase; color: var(--accent); }
.vm-brow h3 { font-size: clamp(18px,1.8vw,22px); font-weight: 600; margin: 0; letter-spacing: -.01em; }
.vm-brow p { font-size: 14px; color: var(--vm-muted2); margin: 0; }
.vm-brow__read { font-family: var(--mono); font-size: 12px; color: var(--vm-dim2); white-space: nowrap; }
@media (max-width: 640px){ .vm-brow { grid-template-columns: 84px 1fr; gap: 14px; } .vm-brow__thumb { width: 84px; height: 64px; } .vm-brow__read { display: none; } }

/* =========================================================
   REFERANS öne çıkan video
   ========================================================= */
.vm-featvideo { display: grid; grid-template-columns: 300px 1fr; gap: 40px; align-items: center; padding: 30px; border: 1px solid var(--line); border-radius: 18px; background: var(--surface); }
@media (max-width: 800px){ .vm-featvideo { grid-template-columns: 1fr; text-align: center; justify-items: center; } }
.vm-featvideo video { width: 100%; max-height: 500px; border-radius: 12px; background: #000; display: block; }
.vm-featvideo__tags { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 16px; }
.vm-featvideo__tags span { font-size: .82rem; font-weight: 500; color: #cfe6f3; background: rgba(255,255,255,0.06); border: 1px solid var(--line-12); padding: 6px 12px; border-radius: 999px; }
@media (max-width: 800px){ .vm-featvideo__tags { justify-content: center; } }

/* Projeler grid (16/11) */
.vm-pgrid { display: grid; grid-template-columns: repeat(2,1fr); gap: 20px; }
@media (max-width: 640px){ .vm-pgrid { grid-template-columns: 1fr; } }
.vm-pgrid .vm-ptile { aspect-ratio: 16/11; }

/* =========================================================
   Sektör şeridi (anasayfa)
   ========================================================= */
.vm-sectorline { margin-top: 40px; padding-top: 28px; border-top: 1px solid var(--line); display: flex; align-items: center; gap: 24px; flex-wrap: wrap; }
.vm-sectorline__label { font-size: 12px; letter-spacing: 2px; text-transform: uppercase; color: var(--vm-dim); white-space: nowrap; }
.vm-sectorline__items { display: flex; flex-wrap: wrap; gap: 10px; }
.vm-sectorline__items span { font-size: 14px; color: var(--vm-muted); border: 1px solid var(--line); border-radius: 999px; padding: 7px 14px; }

/* =========================================================
   Marka logoları şeridi
   ========================================================= */
.vm-marka__label { text-align: center; font-size: 12px; letter-spacing: 2px; text-transform: uppercase; color: var(--vm-dim); margin: 0 0 28px; }
.vm-marka { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 16px; }
/* Eşit boyutlu kartlar — logo içinde ortalanıp sığar (simetri) */
.vm-marka a, .vm-marka span { display: inline-flex; align-items: center; justify-content: center; width: 200px; height: 104px; padding: 18px 26px; background: #fff; border-radius: 14px; border: 1px solid rgba(255,255,255,0.08); transition: transform .18s ease, box-shadow .18s ease; }
.vm-marka a:hover, .vm-marka span:hover { transform: translateY(-3px); box-shadow: 0 14px 34px -14px rgba(0,0,0,.6); }
.vm-marka img { max-height: 100%; max-width: 100%; width: auto; height: auto; object-fit: contain; display: block; }
@media (max-width: 560px){ .vm-marka a, .vm-marka span { width: 100%; max-width: 320px; } }

/* =========================================================
   CPT tekil medya
   ========================================================= */
.vm-single-video { width: 100%; max-height: 620px; border-radius: 16px; background: #000; display: block; }
.vm-embed { position: relative; border-radius: 16px; overflow: hidden; border: 1px solid var(--line); }
.vm-embed iframe { width: 100%; aspect-ratio: 16/9; height: auto; display: block; border: 0; }

/* =========================================================
   Galeri + Lightbox
   ========================================================= */
.vm-gallery { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
@media (max-width: 640px){ .vm-gallery { grid-template-columns: repeat(2, 1fr); } }
.vm-gallery__item { display: block; border-radius: 12px; overflow: hidden; border: 1px solid var(--line); aspect-ratio: 4/3; background: var(--surface); cursor: zoom-in; }
.vm-gallery__item img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease, opacity .2s ease; display: block; }
.vm-gallery__item:hover img { transform: scale(1.06); }

.vm-lb { position: fixed; inset: 0; z-index: 9999; display: none; align-items: center; justify-content: center; background: rgba(4,8,12,0.92); backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px); }
.vm-lb.is-open { display: flex; animation: vmFade .2s ease both; }
.vm-lb__img { max-width: 90vw; max-height: 86vh; border-radius: 10px; box-shadow: 0 30px 80px -20px rgba(0,0,0,.8); }
.vm-lb__btn { position: absolute; background: rgba(255,255,255,0.08); border: 1px solid var(--line-16); color: #fff; cursor: pointer; border-radius: 999px; transition: background .16s ease, border-color .16s ease; display: flex; align-items: center; justify-content: center; }
.vm-lb__btn:hover { background: rgba(27,160,207,0.25); border-color: var(--accent); }
.vm-lb__close { top: 22px; right: 22px; width: 46px; height: 46px; font-size: 26px; }
.vm-lb__prev, .vm-lb__next { top: 50%; transform: translateY(-50%); width: 54px; height: 54px; font-size: 30px; }
.vm-lb__prev { left: 22px; }
.vm-lb__next { right: 22px; }
@media (max-width: 600px){ .vm-lb__prev { left: 10px; } .vm-lb__next { right: 10px; } .vm-lb__prev, .vm-lb__next { width: 44px; height: 44px; } }

/* =========================================================
   Animasyon
   ========================================================= */
@keyframes vmUp { from { opacity: 0; transform: translateY(22px); } to { opacity: 1; transform: none; } }
@keyframes vmFade { from { opacity: 0; } to { opacity: 1; } }
@keyframes vmGlow { 0%,100% { opacity: .55; } 50% { opacity: .9; } }
@keyframes vmMarquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
.reveal { opacity: 0; transform: translateY(22px); transition: opacity .7s ease, transform .7s ease; }
.reveal.is-in { opacity: 1; transform: none; }
.reveal[data-delay="1"]{ transition-delay: .08s; }
.reveal[data-delay="2"]{ transition-delay: .16s; }
.reveal[data-delay="3"]{ transition-delay: .24s; }
.reveal[data-delay="4"]{ transition-delay: .32s; }
@media (prefers-reduced-motion: reduce) {
	.reveal { opacity: 1 !important; transform: none !important; transition: none !important; }
	*, *::before { animation: none !important; scroll-behavior: auto !important; }
}

/* =========================================================
   İletişim + Form (koyu tasarım)
   ========================================================= */
.vita-contact { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: start; }
@media (max-width: 820px){ .vita-contact { grid-template-columns: 1fr; gap: 34px; } }
.vita-contact__info { }
.vita-contact__info h3 { font-size: 20px; margin: 0 0 16px; color: var(--vm-text); }
.vita-contact__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.vita-contact__list li { display: grid; gap: 3px; padding: 18px 22px; border: 1px solid var(--line); border-radius: 14px; }
.vita-contact__list span { font-size: 12px; text-transform: uppercase; letter-spacing: 1px; color: var(--vm-dim); }
.vita-contact__list a, .vita-contact__list li { color: var(--vm-text); }
.vita-contact__soft { color: var(--vm-muted); font-size: 14px; line-height: 1.6; margin-top: 14px; }

.vita-form { padding: 36px; border: 1px solid rgba(255,255,255,0.09); border-radius: 20px; background: var(--surface); display: grid; gap: 18px; }
.vita-form .vita-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
@media (max-width: 560px){ .vita-form .vita-row { grid-template-columns: 1fr; } }
.vita-form label { display: grid; gap: 8px; font-size: 12px; letter-spacing: 1px; text-transform: uppercase; color: var(--vm-dim); font-weight: 500; }
.vita-form input[type=text], .vita-form input[type=email], .vita-form input[type=tel], .vita-form select, .vita-form textarea {
	width: 100%; font-family: var(--sans); font-size: 15px; color: var(--vm-text);
	background: rgba(255,255,255,0.03); border: 1px solid var(--line-12); border-radius: 10px; padding: 14px 16px;
	transition: border-color .16s ease;
}
.vita-form input::placeholder, .vita-form textarea::placeholder { color: #5b6b78; }
.vita-form input:focus, .vita-form select:focus, .vita-form textarea:focus { outline: none; border-color: var(--accent); }
.vita-form select option { background: #0C131B; }
.vita-form textarea { resize: vertical; min-height: 120px; }
.vita-form .vita-file span { text-transform: none; letter-spacing: 0; color: var(--vm-dim); font-size: 12px; }
.vita-form input[type=file] { color: var(--vm-muted); font-size: 14px; padding: 12px; background: rgba(255,255,255,0.02); border: 1px dashed var(--line-16); border-radius: 10px; cursor: pointer; }
.vita-form .vita-consent { flex-direction: row; align-items: flex-start; gap: 10px; display: flex; text-transform: none; letter-spacing: 0; font-size: 13px; color: var(--vm-muted); }
.vita-form .vita-consent input { margin-top: 3px; }
.vita-form button[type=submit] { margin-top: 6px; justify-self: start; }
.vita-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
.vita-form__msg { font-size: 14px; font-weight: 500; }
.vita-form__msg.ok { color: #7fe0a8; background: rgba(38,166,91,0.12); border: 1px solid rgba(38,166,91,0.3); padding: 12px 14px; border-radius: 10px; }
.vita-form__msg.err { color: #ff9b8f; background: rgba(179,38,30,0.12); border: 1px solid rgba(179,38,30,0.35); padding: 12px 14px; border-radius: 10px; }