/* =========================================================
   Whosoft — site stilleri (v2)
   Kurumsal Kimlik Kılavuzu esas alınmıştır:
   %60 kâğıt zemin, %25 kırmızı, %15 pembe / mor / yeşil.
   Düz renk; gradyan ve gölge yok. Beyaz kullanılmaz.
   ========================================================= */

@font-face { font-family: "Bricolage"; src: url("../fonts/BricolageGrotesque-ExtraBold.woff2") format("woff2"); font-weight: 800; font-display: swap; }
@font-face { font-family: "Bricolage"; src: url("../fonts/BricolageGrotesque-Bold.woff2") format("woff2"); font-weight: 700; font-display: swap; }
@font-face { font-family: "Jakarta"; src: url("../fonts/PlusJakartaSans-Regular.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Jakarta"; src: url("../fonts/PlusJakartaSans-Medium.woff2") format("woff2"); font-weight: 500; font-display: swap; }
@font-face { font-family: "Jakarta"; src: url("../fonts/PlusJakartaSans-Bold.woff2") format("woff2"); font-weight: 600 700; font-display: swap; }
@font-face { font-family: "Jakarta"; src: url("../fonts/PlusJakartaSans-ExtraBold.woff2") format("woff2"); font-weight: 800; font-display: swap; }

:root {
  --kagit: #FAF7F3;
  --kagit-koyu: #F1ECE4;
  --murekkep: #16131F;
  --soluk: #6D687B;
  --kirmizi: #EB4213;
  --pembe: #FF99DC;
  --mor: #826DEE;
  --yesil: #D8F382;
  --yesil-acik: #F0F9D2;
  --pembe-acik: #FFE5F6;
  --mor-acik: #ECE8FD;
  --kirmizi-acik: #FCE3D9;
  --cizgi: rgba(22, 19, 31, .12);
  --cizgi-acik: rgba(250, 247, 243, .18);
  --kenarlik: 2px solid var(--murekkep);

  --kose-buyuk: 40px;
  --kose: 26px;
  --kose-kucuk: 16px;
  --hap: 999px;

  --baslik: "Bricolage", "Arial Black", system-ui, sans-serif;
  --metin: "Jakarta", system-ui, -apple-system, "Segoe UI", sans-serif;

  --kap: 1320px;
  --kenar: clamp(16px, 4vw, 48px);
  --bolum: clamp(80px, 10vw, 150px);
  --ust-yukseklik: 78px;
}

*, *::before, *::after { box-sizing: border-box; }
html { overflow-x: clip; -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: calc(var(--ust-yukseklik) + 16px); }
body {
  margin: 0; background: var(--kagit); color: var(--murekkep);
  font: 400 17px/1.6 var(--metin); -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
  overflow-x: hidden;
  overflow-x: clip;
}
img, svg, video { display: block; max-width: 100%; }
img { height: auto; }
a { color: inherit; }
p { margin: 0 0 1em; }
h1, h2, h3, h4 { font-family: var(--baslik); font-weight: 800; margin: 0; line-height: 1.02; letter-spacing: -.028em; text-wrap: balance; }
ul, ol { margin: 0; padding: 0; list-style: none; }
button { font: inherit; color: inherit; }
:focus-visible { outline: 3px solid var(--mor); outline-offset: 3px; border-radius: 6px; }
::selection { background: var(--yesil); color: var(--murekkep); }

.gizli { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.atla { position: absolute; left: 16px; top: -60px; z-index: 100; background: var(--murekkep); color: var(--kagit); padding: 10px 16px; border-radius: var(--hap); }
.atla:focus { top: 12px; }

.kap { width: 100%; max-width: calc(var(--kap) + var(--kenar) * 2); margin: 0 auto; padding: 0 var(--kenar); }
.bolum { padding: var(--bolum) 0; }
.bolum-kucuk { padding: calc(var(--bolum) * .55) 0; }
.yuvarlak { margin-inline: clamp(8px, 1.2vw, 18px); border-radius: var(--kose-buyuk); }

/* ---------- Yazı ölçeği ---------- */
.manset-orta { font-size: clamp(44px, 7vw, 104px); line-height: .94; letter-spacing: -.04em; }
.b1 { font-size: clamp(36px, 4.6vw, 66px); line-height: .98; letter-spacing: -.035em; }
.b2 { font-size: clamp(28px, 3vw, 42px); line-height: 1.04; letter-spacing: -.03em; }
.b3 { font-size: clamp(22px, 2vw, 28px); line-height: 1.12; letter-spacing: -.02em; }
.giris { font-size: clamp(18px, 1.45vw, 21px); line-height: 1.5; font-weight: 500; max-width: 42ch; }
.soluk { color: var(--soluk); }
.etiket { font: 700 14px/1.2 var(--metin); color: var(--soluk); margin: 0 0 14px; }
.metin-genis { max-width: 62ch; }

.vurgu { background: linear-gradient(transparent 60%, var(--yesil) 60%, var(--yesil) 92%, transparent 92%); padding: 0 .05em; -webkit-box-decoration-break: clone; box-decoration-break: clone; }
.vurgu.vurgu-pembe { background-image: linear-gradient(transparent 60%, var(--pembe) 60%, var(--pembe) 92%, transparent 92%); }
.vurgu.vurgu-mor { background-image: linear-gradient(transparent 60%, var(--mor) 60%, var(--mor) 92%, transparent 92%); }
.vurgu.vurgu-kagit { background-image: linear-gradient(transparent 60%, var(--kagit) 60%, var(--kagit) 92%, transparent 92%); }

/* ---------- Zeminler ---------- */
.zemin-kirmizi { background: var(--kirmizi); color: var(--murekkep); }
.zemin-pembe { background: var(--pembe); color: var(--murekkep); }
.zemin-mor { background: var(--mor); color: var(--murekkep); }
.zemin-yesil { background: var(--yesil); color: var(--murekkep); }
.zemin-murekkep { background: var(--murekkep); color: var(--kagit); }
.zemin-kagit { background: var(--kagit); color: var(--murekkep); }
.zemin-kirmizi :is(h1, h2), .zemin-mor :is(h1, h2) { color: var(--kagit); }

/* ---------- Butonlar ---------- */
.btn {
  --btn-zemin: var(--murekkep); --btn-yazi: var(--kagit);
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  min-height: 52px; padding: 0 26px; border-radius: var(--hap); border: 2px solid var(--btn-zemin);
  background: var(--btn-zemin); color: var(--btn-yazi);
  font: 700 16px/1 var(--metin); text-decoration: none; cursor: pointer; white-space: nowrap;
  transition: transform .18s ease, background-color .18s ease, color .18s ease;
}
.btn:hover { transform: translateY(-2px); }
.btn:active { transform: translateY(0); }
.btn .ikon { width: 20px; height: 20px; flex: none; }
.btn-koyu { --btn-zemin: var(--murekkep); --btn-yazi: var(--kagit); }
.btn-kirmizi { --btn-zemin: var(--kirmizi); --btn-yazi: var(--murekkep); }
.btn-yesil { --btn-zemin: var(--yesil); --btn-yazi: var(--murekkep); }
.btn-kagit { --btn-zemin: var(--kagit); --btn-yazi: var(--murekkep); }
.btn-cizgi { background: transparent; color: var(--murekkep); border-color: var(--murekkep); }
.btn-cizgi:hover { background: var(--murekkep); color: var(--kagit); }
.btn-cizgi-acik { background: transparent; color: inherit; border-color: currentColor; }
.btn-kucuk { min-height: 44px; padding: 0 20px; font-size: 15px; }
.btn-buyuk { min-height: 60px; padding: 0 32px; font-size: 17px; }
.btn-blok { width: 100%; }
.btn-grup { display: flex; flex-wrap: wrap; gap: 12px; }
.ok-baglanti { display: inline-flex; align-items: center; gap: 10px; font-weight: 700; text-decoration: none; border-bottom: 2px solid currentColor; padding-bottom: 2px; }
.ok-baglanti .ikon { width: 18px; height: 18px; transition: transform .18s ease; }
.ok-baglanti:hover .ikon { transform: translateX(4px); }

/* ---------- Üst menü ---------- */
.ust { position: fixed; inset: 0 0 auto; z-index: 50; height: var(--ust-yukseklik); transition: background-color .25s ease, box-shadow .25s ease; }
.ust.dolu { background: var(--kagit); box-shadow: 0 1px 0 var(--cizgi); }
.ust-ic { height: 100%; display: flex; align-items: center; gap: 28px; }
.logo { flex: none; display: block; line-height: 0; }
.logo svg { width: 154px; height: auto; }
.menu { flex: 1; display: flex; justify-content: center; }
.menu ul { display: flex; gap: 4px; }
.menu a { display: block; padding: 10px 16px; border-radius: var(--hap); text-decoration: none; font-weight: 600; font-size: 15.5px; transition: background-color .15s ease; }
.menu a:hover { background: rgba(22, 19, 31, .06); }
.menu a[aria-current="page"] { background: var(--murekkep); color: var(--kagit); }
.menu-alt { display: none; }
.ust-sag { display: flex; align-items: center; gap: 10px; }
.menu-ac { display: none; width: 46px; height: 46px; border: 0; border-radius: 50%; background: var(--murekkep); cursor: pointer; position: relative; }
.menu-ac span:not(.gizli) { position: absolute; left: 14px; right: 14px; height: 2.5px; border-radius: 2px; background: var(--kagit); transition: transform .2s ease, top .2s ease; }
.menu-ac span:nth-child(1) { top: 18px; }
.menu-ac span:nth-child(2) { top: 26px; }
.menu-acik .menu-ac span:nth-child(1) { top: 22px; transform: rotate(45deg); }
.menu-acik .menu-ac span:nth-child(2) { top: 22px; transform: rotate(-45deg); }

.logo-zemin { display: none; }
body:is(.ust-kirmizi, .ust-mor, .ust-murekkep) .ust:not(.dolu) .logo-normal { display: none; }
body:is(.ust-kirmizi, .ust-mor, .ust-murekkep) .ust:not(.dolu) .logo-zemin { display: block; }
body:is(.ust-kirmizi, .ust-mor, .ust-murekkep):not(.menu-acik) .ust:not(.dolu) .menu-ac { background: var(--kagit); }
body:is(.ust-kirmizi, .ust-mor, .ust-murekkep):not(.menu-acik) .ust:not(.dolu) .menu-ac span:not(.gizli) { background: var(--murekkep); }
.menu-acik .logo-normal { display: block !important; }
.menu-acik .logo-zemin { display: none !important; }

@media (min-width: 981px) {
  body:is(.ust-kirmizi, .ust-mor, .ust-murekkep) .ust:not(.dolu) .menu a { color: var(--kagit); }
  body:is(.ust-kirmizi, .ust-mor, .ust-murekkep) .ust:not(.dolu) .menu a:hover { background: rgba(250, 247, 243, .14); }
  body:is(.ust-kirmizi, .ust-mor, .ust-murekkep) .ust:not(.dolu) .menu a[aria-current="page"] { background: var(--kagit); color: var(--murekkep); }
  body.ust-murekkep .ust:not(.dolu) .ust-wa { --btn-zemin: var(--yesil); --btn-yazi: var(--murekkep); }
}
@media (max-width: 980px) {
  .menu-ac { display: block; }
  .ust-wa { display: none; }
  .menu {
    position: fixed; inset: var(--ust-yukseklik) 0 0; background: var(--kagit); flex-direction: column; justify-content: space-between;
    padding: 24px var(--kenar) 32px; transform: translateY(-8px); opacity: 0; visibility: hidden; transition: opacity .2s ease, transform .2s ease, visibility .2s;
    overflow-y: auto;
  }
  .menu ul { flex-direction: column; gap: 0; }
  .menu a { font: 800 clamp(34px, 9vw, 46px)/1.1 var(--baslik); letter-spacing: -.03em; padding: 8px 0; border-radius: 0; }
  .menu a:hover { background: none; }
  .menu a[aria-current="page"] { background: none; color: var(--kirmizi); }
  .menu-alt { display: block; margin-top: 32px; }
  .menu-alt p { margin: 16px 0 0; color: var(--soluk); font-size: 15px; }
  .menu-acik .menu { opacity: 1; visibility: visible; transform: none; }
  .menu-acik .ust { background: var(--kagit); }
  .menu-acik { overflow: hidden; }
}

/* =========================================================
   ANASAYFA
   ========================================================= */

/* ---------- Açılış ---------- */
.acilis { padding: calc(var(--ust-yukseklik) + clamp(36px, 5vw, 72px)) 0 0; overflow: hidden; }
.acilis-ust { display: flex; flex-wrap: wrap; gap: 10px; margin: 0 0 clamp(22px, 2.6vw, 34px); }
.acilis-ust span { display: inline-block; padding: 8px 16px; border-radius: var(--hap); border: var(--kenarlik); font-weight: 700; font-size: 14.5px; line-height: 1.2; }
.acilis-ust span:nth-child(1) { background: var(--yesil); transform: rotate(-2.5deg); }
.acilis-ust span:nth-child(2) { background: var(--kagit); transform: rotate(1deg); }
.acilis-ust span:nth-child(3) { background: var(--pembe); transform: rotate(-1deg); }
.acilis-baslik { font-size: clamp(40px, 8.3vw, 132px); line-height: .94; letter-spacing: -.048em; margin: 0; }
.etiketli { display: inline-block; background: var(--kirmizi); color: var(--kagit); padding: .02em .14em .08em; margin-top: .06em; border-radius: .14em; transform: rotate(-1.6deg); transform-origin: 10% 60%; }
.acilis-alt { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 24px 48px; align-items: end; margin-top: clamp(28px, 3.4vw, 48px); }
.acilis-alt .giris { margin: 0; }

/* Reels kartları */
.reels {
  --gen: clamp(168px, calc((min(100vw, 1680px) - 2 * var(--kenar) - 6 * 18px) / 7), 230px);
  display: flex; justify-content: center; gap: 18px;
  padding: clamp(44px, 5vw, 72px) var(--kenar) clamp(36px, 4vw, 56px);
}
.reel {
  position: relative; flex: 0 0 var(--gen); aspect-ratio: 9 / 16; border-radius: 22px; overflow: hidden; margin: 0;
  transform: rotate(var(--egim, 0deg)); transition: transform .35s cubic-bezier(.3, 1.3, .5, 1);
  border: var(--kenarlik);
}
.reel:hover { transform: rotate(0deg) translateY(-12px) scale(1.03); z-index: 2; }
.reel-foto img { width: 100%; height: 100%; object-fit: cover; }
.reel-bar { position: absolute; top: 10px; left: 10px; right: 10px; display: flex; gap: 4px; z-index: 1; }
.reel-bar i { flex: 1; height: 3px; border-radius: 3px; background: rgba(250, 247, 243, .45); }
.reel-bar i:first-child { background: var(--kagit); }
.reel-metin .reel-bar i { background: rgba(22, 19, 31, .2); }
.reel-metin .reel-bar i:first-child { background: var(--murekkep); }
.reel-foto figcaption { position: absolute; left: 10px; right: 10px; bottom: 10px; background: var(--kagit); border-radius: 14px; padding: 9px 12px; line-height: 1.25; }
.reel-foto figcaption b { display: block; font: 800 15px/1.15 var(--baslik); letter-spacing: -.01em; }
.reel-foto figcaption span { font-size: 12.5px; color: var(--soluk); font-weight: 500; }
.reel-metin { display: flex; flex-direction: column; justify-content: space-between; padding: 30px 16px 18px; }
.reel-etiket { align-self: flex-start; font: 700 13px/1 var(--metin); padding: 7px 11px; border-radius: var(--hap); background: var(--kagit); color: var(--murekkep); }
.reel-buyuk { display: block; font: 800 clamp(44px, 4.2vw, 64px)/.9 var(--baslik); letter-spacing: -.05em; margin-bottom: 12px; }
.reel-metin p { margin: 0; font: 700 clamp(15px, 1.15vw, 17px)/1.25 var(--baslik); letter-spacing: -.01em; }
.reel-metin.zemin-kirmizi .reel-buyuk, .reel-metin.zemin-mor .reel-buyuk { color: var(--kagit); }
.reel-metin.zemin-murekkep .reel-bar i { background: rgba(250, 247, 243, .3); }
.reel-metin.zemin-murekkep .reel-bar i:first-child { background: var(--kagit); }
.reel-metin.zemin-murekkep .reel-buyuk { color: var(--yesil); }
.reel-metin.zemin-kagit .reel-etiket { background: var(--murekkep); color: var(--kagit); }
.js .reel { animation: reel-gir .7s cubic-bezier(.25, 1.2, .45, 1) both; animation-delay: calc(var(--sira) * 75ms + 120ms); }
@keyframes reel-gir { from { opacity: 0; transform: translateY(70px) rotate(calc(var(--egim) * -2)); } }

/* ---------- Marka duvarı ---------- */
.markalar { padding: clamp(40px, 5vw, 72px) 0 clamp(24px, 3vw, 40px); border-top: var(--kenarlik); border-bottom: var(--kenarlik); }
.markalar-bas { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px 32px; flex-wrap: wrap; margin-bottom: clamp(20px, 3vw, 36px); }
.markalar-bas h2 { max-width: 20ch; }
.kayan { display: flex; overflow: hidden; }
.kayan ul { display: flex; flex-shrink: 0; align-items: center; animation: kay 70s linear infinite; }
.kayan.ters ul { animation-direction: reverse; animation-duration: 80s; }
.kayan:hover ul { animation-play-state: paused; }
.marka { display: flex; align-items: center; gap: clamp(28px, 3.4vw, 52px); padding-right: clamp(28px, 3.4vw, 52px); height: clamp(64px, 7vw, 96px); font: 800 clamp(26px, 3.2vw, 46px)/1 var(--baslik); letter-spacing: -.035em; white-space: nowrap; }
.marka::after { content: ""; flex: none; width: .34em; height: .34em; border-radius: 50%; background: var(--kirmizi); }
.marka:nth-child(4n+2)::after { background: var(--mor); border-radius: 30%; }
.marka:nth-child(4n+3)::after { background: var(--pembe); }
.marka:nth-child(4n+4)::after { background: var(--yesil); border-radius: 30%; }
.marka-logo { height: clamp(38px, 4vw, 56px); width: auto; filter: brightness(0); }
@keyframes kay { to { transform: translateX(-100%); } }

/* ---------- Rakamlar (destek şekilleri) ---------- */
.rakamlar { display: grid; grid-template-columns: auto minmax(0, 1.5fr) minmax(0, 1fr) minmax(0, 1fr); gap: clamp(10px, 1.4vw, 20px); align-items: stretch; }
.rakam { padding: clamp(22px, 2.6vw, 36px); display: flex; flex-direction: column; justify-content: space-between; height: clamp(210px, 19vw, 270px); }
.rakam strong { font: 800 clamp(48px, 5.8vw, 88px)/.9 var(--baslik); letter-spacing: -.05em; display: block; }
.rakam span { font-weight: 600; font-size: 15.5px; line-height: 1.35; max-width: 20ch; }
.rakam-daire { background: var(--pembe); border-radius: 50%; aspect-ratio: 1; justify-content: center; align-items: center; text-align: center; }
.rakam-hap { background: var(--yesil); border-radius: var(--hap); padding-left: clamp(36px, 4.4vw, 64px); justify-content: center; gap: 12px; }
.rakam-blok { background: var(--mor); border-radius: var(--kose-buyuk); }
.rakam-blok strong { color: var(--kagit); }
.rakam-yarim { background: var(--kirmizi); border-radius: 999px 999px var(--kose) var(--kose); justify-content: flex-end; text-align: center; align-items: center; gap: 8px; }
.rakam-yarim strong { color: var(--kagit); }

/* ---------- Bölüm başlıkları ---------- */
.bolum-basi { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: 20px 48px; align-items: end; margin-bottom: clamp(36px, 4.6vw, 64px); }
.bolum-basi p { margin: 0; color: var(--soluk); font-size: 18px; max-width: 46ch; }

/* ---------- Ana hizmetler ---------- */
.ana-hizmet { display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(0, 1fr); gap: 20px; }
.ah { border-radius: var(--kose-buyuk); padding: clamp(28px, 3.4vw, 52px); display: flex; flex-direction: column; gap: 20px; }
.ah-sosyal { background: var(--kirmizi); color: var(--murekkep); }
.ah-prod { background: var(--murekkep); color: var(--kagit); }
.ah-ust { align-self: flex-start; margin: 0; padding: 7px 14px; border-radius: var(--hap); font: 700 14px/1.2 var(--metin); background: var(--kagit); color: var(--murekkep); }
.ah-prod .ah-ust { background: var(--yesil); }
.ah h3 { font-size: clamp(40px, 4.4vw, 66px); line-height: .95; letter-spacing: -.045em; }
.ah-sosyal h3 { color: var(--kagit); }
.ah-metin { margin: 0; font-size: 18px; font-weight: 500; max-width: 40ch; }
.ah-prod .ah-metin { color: rgba(250, 247, 243, .8); }
.ah-adet { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-top: 8px; }
.ah-adet li { background: var(--kagit); border-radius: 24px; padding: 18px 20px 16px; display: flex; flex-direction: column; gap: 4px; }
.ah-adet b { font: 800 clamp(48px, 4.6vw, 72px)/.9 var(--baslik); letter-spacing: -.05em; }
.ah-adet span { font-weight: 700; font-size: 15px; }
.ah-not { margin: 0; font-size: 14.5px; font-weight: 600; }
.ah-cip { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 4px; }
.ah-cip li { padding: 9px 15px; border-radius: var(--hap); border: 1.5px solid var(--cizgi-acik); font-size: 14.5px; font-weight: 600; }
.ah-buyuk { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 14px; padding: 18px 0 0; border-top: 1.5px solid var(--cizgi-acik); }
.ah-buyuk b { font: 800 clamp(44px, 4.4vw, 68px)/1 var(--baslik); letter-spacing: -.05em; color: var(--yesil); }
.ah-buyuk span { color: rgba(250, 247, 243, .8); font-weight: 600; max-width: 18ch; }
.ah .btn-grup { margin-top: auto; padding-top: 8px; }

.diger-bas { display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap; margin: clamp(56px, 6vw, 88px) 0 24px; }
.diger-hizmet { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.dh {
  position: relative; display: flex; flex-direction: column; gap: 12px; min-height: 270px; padding: 30px 30px 26px;
  border: var(--kenarlik); border-radius: var(--kose); text-decoration: none; transition: background-color .22s ease;
}
.dh .sekil { width: 44px; height: 44px; background: var(--renk); margin-bottom: 18px; transition: background-color .22s ease; }
.dh h3 { font-size: clamp(24px, 2.1vw, 30px); letter-spacing: -.03em; }
.dh p { margin: 0; color: var(--soluk); font-size: 15.5px; line-height: 1.55; transition: color .22s ease; }
.dh-ok { margin-top: auto; align-self: flex-end; width: 46px; height: 46px; border-radius: 50%; border: var(--kenarlik); display: grid; place-items: center; transition: background-color .22s ease, color .22s ease; }
.dh-ok .ikon { width: 20px; height: 20px; }
.dh:hover { background: var(--renk); }
.dh:hover p { color: var(--murekkep); }
.dh:hover .sekil { background: var(--murekkep); }
.dh:hover .dh-ok { background: var(--murekkep); color: var(--kagit); }
.sekil-daire { border-radius: 50%; }
.sekil-hap { border-radius: var(--hap); width: 64px !important; height: 32px !important; }
.sekil-blok { border-radius: 12px; }
.sekil-yarim { border-radius: 999px 999px 0 0; width: 48px !important; height: 24px !important; }

/* ---------- Sonuçlar (bento) ---------- */
.bento { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 20px; }
.b-kart { border-radius: var(--kose-buyuk); padding: clamp(26px, 3.2vw, 48px); display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.b-vaka { grid-column: span 5; }
.b-vaka.b-genis { grid-column: span 7; }
.b-bas { display: flex; justify-content: space-between; align-items: center; gap: 12px; font-weight: 700; }
.b-marka { padding: 7px 14px; border-radius: var(--hap); background: var(--kagit); font-size: 14.5px; }
.b-logo { height: 46px; width: auto; filter: brightness(0); }
.b-degisim { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 18px; margin-top: clamp(24px, 4vw, 64px); }
.b-once, .b-sonra { font: 800 clamp(56px, 7vw, 116px)/.86 var(--baslik); letter-spacing: -.055em; color: var(--kagit); }
.b-once { opacity: .55; }
.b-ok { width: clamp(36px, 4vw, 60px); height: clamp(36px, 4vw, 60px); color: var(--kagit); }
.b-sure { margin: 0 0 clamp(16px, 3vw, 40px) !important; font: 800 clamp(20px, 1.8vw, 26px)/1.1 var(--baslik) !important; letter-spacing: -.02em; }
.b-kart h3 { font-size: clamp(24px, 2.2vw, 32px); letter-spacing: -.03em; }
.b-kart p { margin: 0; font-weight: 500; }
.b-vaka .etiketler { margin-top: auto; padding-top: 8px; }
.b-kisisel { grid-column: 1 / -1; background: var(--murekkep); color: var(--kagit); display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 32px clamp(32px, 5vw, 80px); align-items: end; }
.b-etiket { align-self: flex-start; display: inline-block; margin: 0 0 18px !important; padding: 7px 14px; border-radius: var(--hap); background: var(--yesil); color: var(--murekkep); font-weight: 700 !important; font-size: 14.5px; }
.b-ad { font-size: clamp(40px, 5.4vw, 84px) !important; line-height: .94 !important; letter-spacing: -.045em !important; }
.b-kisisel .b-ad { color: var(--kagit); }
.b-unvan { margin: 16px 0 0 !important; font: 800 clamp(22px, 2vw, 28px)/1.1 var(--baslik) !important; color: var(--pembe); letter-spacing: -.02em; }
.b-uzun { font-size: 18px; color: rgba(250, 247, 243, .86); margin: 0 0 18px !important; }
.b-kisisel .etiketler li { background: rgba(250, 247, 243, .1); }
.b-davet { margin: 22px 0 18px !important; font-weight: 700 !important; }
.b-esnaf { grid-column: span 6; min-height: 300px; justify-content: space-between; }
.b-esnaf .b-etiket { background: var(--kagit); }
.b-esnaf p:last-child { max-width: 46ch; font-size: 17px; }
.etiketler { display: flex; flex-wrap: wrap; gap: 8px; }
.etiketler li { font-size: 14px; font-weight: 600; padding: 8px 14px; border-radius: var(--hap); background: rgba(22, 19, 31, .08); }

/* ---------- Zaman çizelgesi ---------- */
.takvim-bolum { background: var(--murekkep); color: var(--kagit); }
.takvim-bolum h2 { color: var(--kagit); }
.takvim-bolum .bolum-basi p { color: rgba(250, 247, 243, .72); }
.takvim { position: relative; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 24px; }
.takvim::before { content: ""; position: absolute; left: 0; right: 0; top: 22px; height: 2px; background: var(--cizgi-acik); }
.takvim li { position: relative; }
.t-zaman { position: relative; display: inline-block; margin-bottom: 24px; padding: 11px 18px; border-radius: var(--hap); background: var(--renk); color: var(--murekkep); font: 800 17px/1 var(--baslik); letter-spacing: -.01em; }
.takvim h3 { font-size: clamp(22px, 1.9vw, 27px); color: var(--kagit); margin-bottom: 12px; letter-spacing: -.025em; }
.takvim p { margin: 0; color: rgba(250, 247, 243, .72); font-size: 15.5px; }

/* ---------- Değerler ---------- */
.degerler { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.deger { position: relative; overflow: hidden; border-radius: 32px; padding: 30px 28px; min-height: 400px; display: flex; flex-direction: column; justify-content: flex-end; gap: 18px; }
.deger > * { position: relative; }
.deger > .d-sekil { position: absolute; z-index: 0; }
.d-daire { width: 150px; height: 150px; border-radius: 50%; right: -40px; top: -40px; }
.d-blok { width: 130px; height: 130px; border-radius: 32px; right: -34px; top: -34px; transform: rotate(14deg); }
.d-hap { width: 190px; height: 76px; border-radius: var(--hap); right: -60px; top: 18px; transform: rotate(-24deg); }
.d-yarim { width: 170px; height: 85px; border-radius: 0 0 999px 999px; right: -20px; top: 0; }
.d-vurgu { display: block; font: 800 clamp(52px, 5vw, 80px)/.9 var(--baslik); letter-spacing: -.055em; }
.deger h3 { font-size: clamp(24px, 2vw, 30px); letter-spacing: -.03em; margin-bottom: 12px; }
.deger p { margin: 0; font-size: 15.5px; line-height: 1.55; font-weight: 500; }
.deger.zemin-kirmizi :is(.d-vurgu, h3), .deger.zemin-mor :is(.d-vurgu, h3) { color: var(--kagit); }

/* ---------- Fiyat paketleri ---------- */
.ortak { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 20px; padding: 18px 24px; border-radius: 24px; background: var(--kagit-koyu); margin-bottom: 16px; }
.ortak-bas { font: 800 18px/1 var(--baslik); letter-spacing: -.01em; }
.ortak ul { display: flex; flex-wrap: wrap; gap: 8px 22px; }
.ortak li { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; font-size: 15px; }
.ortak .ikon { width: 20px; height: 20px; color: var(--kirmizi); }
.paketler { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; align-items: stretch; }
.paket { display: flex; flex-direction: column; gap: 18px; padding: clamp(24px, 2.6vw, 34px); border: var(--kenarlik); border-radius: 32px; background: var(--kagit); }
.paket-vurgu { background: var(--yesil); }
.paket-bas { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; padding-bottom: 18px; border-bottom: var(--kenarlik); }
.paket-bas h3 { font-size: clamp(30px, 2.8vw, 40px); letter-spacing: -.035em; }
.paket-bas p { margin: 6px 0 0; color: var(--soluk); font-size: 15px; max-width: 30ch; font-weight: 500; }
.paket-vurgu .paket-bas p { color: var(--murekkep); }
.paket-fiyat { font: 800 clamp(34px, 3.4vw, 50px)/1 var(--baslik); letter-spacing: -.05em; white-space: nowrap; text-align: right; }
.paket-fiyat small { display: block; margin-top: 6px; font: 600 14px/1 var(--metin); letter-spacing: 0; color: var(--soluk); }
.paket-vurgu .paket-fiyat small { color: var(--murekkep); }
.paket-aciklama { margin: 0; color: var(--soluk); font-size: 14.5px; }
.paket h4 { font: 700 15px/1.3 var(--metin); margin: 0; }
.paket .btn { margin-top: auto; }
.tik-liste li { display: grid; grid-template-columns: 20px minmax(0, 1fr); gap: 10px; padding: 5px 0; font-weight: 500; font-size: 15.5px; line-height: 1.45; break-inside: avoid; }
.tik-liste .ikon { width: 20px; height: 20px; margin-top: 1px; }
.paket-vurgu .tik-liste .ikon { --tik: var(--yesil); }
.tik-liste.iki-sutun { columns: 2; column-gap: 28px; }
.fiyat-not { color: var(--soluk); font-size: 14.5px; max-width: 72ch; margin: 18px 0 0; }
.fiyat-sekmeler { display: inline-flex; gap: 6px; padding: 6px; border-radius: var(--hap); border: var(--kenarlik); margin-bottom: 32px; flex-wrap: wrap; }
.fiyat-sekmeler button { border: 0; background: none; padding: 12px 22px; border-radius: var(--hap); font-weight: 700; cursor: pointer; }
.fiyat-sekmeler button[aria-selected="true"] { background: var(--murekkep); color: var(--kagit); }
.fiyat-grup[hidden] { display: none; }

/* ---------- Yazılım bandı ---------- */
.yazilim-bant { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 24px 48px; align-items: center; padding: clamp(26px, 3vw, 40px); border: var(--kenarlik); border-radius: 32px; }
.yazilim-bant h2 { margin-bottom: 10px; }
.yazilim-bant .soluk { margin: 0; max-width: 46ch; }
.yb-urunler { display: grid; gap: 10px; }
.yb-urun { display: grid; grid-template-columns: 44px minmax(0, 1fr) 22px; gap: 14px; align-items: center; padding: 14px 18px 14px 14px; border-radius: 20px; background: var(--kagit-koyu); text-decoration: none; transition: background-color .18s ease; }
.yb-urun:hover { background: var(--yesil-acik); }
.yb-urun .urun-isaret { width: 44px; height: 44px; border-radius: 12px; }
.yb-urun b { display: block; font: 800 20px/1.1 var(--baslik); letter-spacing: -.02em; }
.yb-urun small { color: var(--soluk); font-size: 14px; font-weight: 500; }
.yb-urun .ikon { width: 20px; height: 20px; }

/* ---------- Portfolyo ---------- */
.is-izgara { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.is-kart { text-decoration: none; display: flex; flex-direction: column; gap: 14px; }
.is-gorsel { border-radius: var(--kose); overflow: hidden; aspect-ratio: 4 / 3; position: relative; display: grid; }
.is-gorsel img { width: 100%; height: 100%; object-fit: cover; transition: transform .5s cubic-bezier(.3, .9, .3, 1); }
.is-kart:hover .is-gorsel img { transform: scale(1.04); }
.is-yer { align-self: end; padding: 22px; font: 800 clamp(24px, 2.2vw, 32px)/1 var(--baslik); letter-spacing: -.03em; }
.is-gorsel.zemin-kirmizi .is-yer, .is-gorsel.zemin-mor .is-yer { color: var(--kagit); }
.is-kart h3 { font-size: 24px; letter-spacing: -.02em; }
.is-kart p { margin: 0; color: var(--soluk); font-size: 15px; }
.filtre { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 32px; }
.filtre a { text-decoration: none; font-weight: 700; font-size: 15px; padding: 10px 18px; border-radius: var(--hap); border: var(--kenarlik); }
.filtre a[aria-current="true"] { background: var(--murekkep); color: var(--kagit); }
.galeri { display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px; margin-top: 48px; }
.galeri img { width: 100%; border-radius: var(--kose); }
.galeri img:only-child, .galeri img:nth-child(3n+1):last-child { grid-column: 1 / -1; }

.ig-davet { border-radius: var(--kose-buyuk); padding: clamp(28px, 4vw, 56px); display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 32px 56px; align-items: center; }
.ig-davet h2 { color: var(--kagit); }
.ig-profil { background: var(--kagit); border-radius: 28px; padding: 24px; border: var(--kenarlik); }
.ig-profil-ust { display: flex; align-items: center; gap: 16px; }
.ig-avatar { width: 76px; height: 76px; border-radius: 50%; flex: none; border: 3px solid var(--kirmizi); padding: 3px; }
.ig-avatar svg { width: 100%; height: 100%; border-radius: 50%; }
.ig-profil b { display: block; font: 800 20px/1.1 var(--baslik); }
.ig-profil small { color: var(--soluk); font-weight: 500; }
.ig-kareler { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px; border-radius: 14px; overflow: hidden; margin-top: 18px; }
.ig-kareler img { aspect-ratio: 3 / 4; width: 100%; height: 100%; object-fit: cover; }

/* ---------- Blog ---------- */
.yazi-izgara { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.yazi-kart { text-decoration: none; display: flex; flex-direction: column; border-radius: var(--kose); border: var(--kenarlik); overflow: hidden; background: var(--kagit); transition: transform .2s ease; }
.yazi-kart:hover { transform: translateY(-4px); }
.yazi-kapak { aspect-ratio: 16 / 9; display: grid; overflow: hidden; border-bottom: var(--kenarlik); }
.yazi-kapak img { width: 100%; height: 100%; object-fit: cover; grid-area: 1 / 1; }
.yazi-kapak .kapak-baslik { align-self: end; padding: 22px; font: 800 clamp(28px, 2.6vw, 40px)/1 var(--baslik); letter-spacing: -.04em; }
.yazi-kapak.zemin-mor .kapak-baslik, .yazi-kapak.zemin-kirmizi .kapak-baslik { color: var(--kagit); }
.yazi-kart-ic { padding: 22px; display: flex; flex-direction: column; gap: 10px; flex: 1; }
.yazi-kart h3 { font-size: 23px; letter-spacing: -.02em; line-height: 1.12; }
.yazi-kart p { margin: 0; color: var(--soluk); font-size: 15px; }
.yazi-meta { font-size: 13.5px; color: var(--soluk); font-weight: 600; display: flex; gap: 14px; flex-wrap: wrap; margin-top: auto; padding-top: 8px; }

.makale-bas { padding: calc(var(--ust-yukseklik) + clamp(40px, 6vw, 80px)) 0 clamp(32px, 4vw, 48px); }
.makale-bas h1 { font-size: clamp(40px, 6vw, 84px); line-height: .96; letter-spacing: -.04em; max-width: 18ch; margin: 18px 0 22px; }
.makale-kapak { border-radius: var(--kose-buyuk); overflow: hidden; margin-bottom: 48px; aspect-ratio: 21 / 9; }
.makale-kapak img { width: 100%; height: 100%; object-fit: cover; }
.yazi-icerik { max-width: 720px; margin: 0 auto; font-size: 18.5px; line-height: 1.7; }
.yazi-icerik h2 { font-size: clamp(28px, 3vw, 36px); letter-spacing: -.025em; margin: 1.6em 0 .55em; }
.yazi-icerik h3 { font-size: 24px; margin: 1.5em 0 .5em; letter-spacing: -.015em; }
.yazi-icerik ul, .yazi-icerik ol { padding-left: 1.3em; margin: 0 0 1em; }
.yazi-icerik ul { list-style: disc; }
.yazi-icerik ol { list-style: decimal; }
.yazi-icerik li { margin: .3em 0; }
.yazi-icerik li::marker { color: var(--kirmizi); }
.yazi-icerik a { color: var(--kirmizi); text-decoration-thickness: 2px; text-underline-offset: 3px; }
.yazi-icerik blockquote { margin: 1.5em 0; padding: 22px 26px; border-radius: var(--kose); background: var(--yesil-acik); font-weight: 500; }
.yazi-icerik img { border-radius: var(--kose); margin: 1.5em 0; }
.yazi-icerik > :first-child { margin-top: 0; }

/* ---------- Ekip ve hakkımızda ---------- */
.ekip-izgara { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.kisi { display: flex; flex-direction: column; gap: 16px; }
.kisi-foto { border-radius: var(--kose-buyuk); overflow: hidden; aspect-ratio: 4 / 5; background: var(--renk); position: relative; }
.kisi-foto img { width: 100%; height: 100%; object-fit: cover; }
.kisi-unvan { position: absolute; left: 16px; bottom: 16px; background: var(--kagit); color: var(--murekkep); font-weight: 700; font-size: 14px; padding: 8px 14px; border-radius: var(--hap); }
.kisi h3 { font-size: 28px; letter-spacing: -.03em; }
.kisi p { margin: 0; color: var(--soluk); font-size: 15.5px; }
.kurucu { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(32px, 5vw, 80px); align-items: start; }
.kurucu-foto { border-radius: var(--kose-buyuk); overflow: hidden; aspect-ratio: 4 / 5; background: var(--kirmizi); position: sticky; top: 100px; }
.kurucu-foto img { width: 100%; height: 100%; object-fit: cover; }
.kurucu-metin { font-size: clamp(19px, 1.6vw, 22px); line-height: 1.6; }
.kurucu-metin .imza { font: 700 20px/1.2 var(--baslik); margin-top: 32px; }
.kurucu-metin .imza small { display: block; font: 500 15px/1.4 var(--metin); color: var(--soluk); margin-top: 4px; }
.vizyon { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.vizyon > div { border-radius: var(--kose-buyuk); padding: clamp(28px, 4vw, 56px); min-height: 320px; display: flex; flex-direction: column; justify-content: space-between; gap: 32px; }
.vizyon h2 { font-size: clamp(30px, 3.4vw, 50px); letter-spacing: -.035em; line-height: 1; }
.vizyon .etiket { color: inherit; opacity: .8; }

/* ---------- SSS ---------- */
.sss { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(32px, 5vw, 80px); align-items: start; }
.sss-liste details { border-bottom: var(--kenarlik); }
.sss-liste details:first-child { border-top: var(--kenarlik); }
.sss-liste summary { list-style: none; cursor: pointer; display: grid; grid-template-columns: 1fr 36px; gap: 16px; align-items: center; padding: 22px 0; font: 700 clamp(19px, 1.6vw, 22px)/1.25 var(--baslik); letter-spacing: -.015em; }
.sss-liste summary::-webkit-details-marker { display: none; }
.sss-liste summary .ikon { width: 36px; height: 36px; padding: 7px; border-radius: 50%; border: var(--kenarlik); transition: transform .25s ease, background-color .2s ease; }
.sss-liste details[open] summary .ikon { transform: rotate(45deg); background: var(--murekkep); color: var(--kagit); }
.sss-liste details p { margin: 0 0 24px; color: var(--soluk); max-width: 62ch; }

/* ---------- Bant ---------- */
.bant { border-radius: var(--kose-buyuk); padding: clamp(30px, 5vw, 72px); display: grid; grid-template-columns: 1.4fr 1fr; gap: 32px; align-items: end; }
.bant h2 { font-size: clamp(34px, 4.6vw, 64px); letter-spacing: -.035em; line-height: .98; }
.bant p { margin: 0 0 24px; font-weight: 500; }

/* ---------- İç sayfa başı ---------- */
.sayfa-basi { padding: calc(var(--ust-yukseklik) + clamp(48px, 8vw, 120px)) 0 clamp(48px, 6vw, 88px); }
.sayfa-basi h1 { max-width: 16ch; margin-bottom: 26px; }
.sayfa-basi .giris { max-width: 52ch; }
.sayfa-basi.zemin-kirmizi, .sayfa-basi.zemin-mor, .sayfa-basi.zemin-murekkep, .sayfa-basi.zemin-yesil, .sayfa-basi.zemin-pembe { border-radius: 0 0 var(--kose-buyuk) var(--kose-buyuk); }
.sayfa-basi.zemin-mor h1, .sayfa-basi.zemin-kirmizi h1, .sayfa-basi.zemin-murekkep h1 { color: var(--kagit); }
.sayfa-basi.zemin-murekkep .giris { color: rgba(250, 247, 243, .78); }
.ic-menu { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 36px; }
.ic-menu a { text-decoration: none; font-weight: 700; font-size: 15px; padding: 10px 16px; border-radius: var(--hap); background: rgba(22, 19, 31, .08); }
.ic-menu a:hover { background: var(--murekkep); color: var(--kagit); }

/* Hizmet detay blokları */
.hizmet-detay { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(28px, 5vw, 80px); padding: clamp(48px, 6vw, 88px) 0; border-top: var(--kenarlik); }
.hizmet-detay:first-child { border-top: 0; }
.hizmet-detay h2 { font-size: clamp(34px, 4.4vw, 60px); letter-spacing: -.04em; margin-bottom: 22px; }
.hizmet-detay .sekil { width: 56px; height: 56px; background: var(--renk); margin-bottom: 26px; }
.hizmet-detay .sekil-hap { width: 84px !important; height: 44px !important; }
.hizmet-detay .sekil-yarim { width: 64px !important; height: 32px !important; }
.hizmet-detay.ana { background: var(--acik); border-radius: var(--kose-buyuk); padding-inline: clamp(24px, 4vw, 56px); border: 0; margin-bottom: 20px; }
.hizmet-detay.ana + .hizmet-detay { border-top: 0; }
.hizmet-kapsam { border-radius: var(--kose); padding: clamp(24px, 3vw, 36px); background: var(--acik); align-self: start; }
.hizmet-detay.ana .hizmet-kapsam { background: var(--kagit); }
.hizmet-kapsam h3 { font-size: 22px; margin-bottom: 14px; }
.hizmet-kapsam .btn-grup { margin-top: 22px; }

/* Süreç (yazılım sayfaları) */
.surec { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.adim { border-top: var(--kenarlik); padding-top: 26px; }
.adim-no { font: 800 clamp(80px, 9vw, 132px)/.8 var(--baslik); letter-spacing: -.06em; display: block; margin-bottom: 28px; }
.adim:nth-child(1) .adim-no { color: var(--kirmizi); }
.adim:nth-child(2) .adim-no { color: var(--mor); }
.adim h3 { margin-bottom: 14px; }
.adim p { color: var(--soluk); margin: 0; }

/* ---------- Yazılım ürünleri ---------- */
.yazilim-vitrin { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.urun { border-radius: var(--kose-buyuk); padding: clamp(26px, 3vw, 44px); display: flex; flex-direction: column; gap: 22px; overflow: hidden; text-decoration: none; position: relative; }
.urun-ajanskit { background: var(--yesil); color: var(--murekkep); }
.urun-acentenot { background: #CFF3EC; color: var(--murekkep); }
.urun-ozel { background: transparent; color: var(--kagit); border: 2px solid var(--cizgi-acik); grid-column: 1 / -1; flex-direction: row; align-items: center; justify-content: space-between; flex-wrap: wrap; }
.urun-ust { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; }
.urun-ad { display: flex; align-items: center; gap: 12px; font: 800 30px/1 var(--baslik); letter-spacing: -.03em; }
.urun-ad .urun-isaret { width: 40px; height: 40px; border-radius: 11px; }
.urun-kime { font: 700 14px/1.2 var(--metin); letter-spacing: 0; padding: 8px 14px; border-radius: var(--hap); background: var(--murekkep); color: var(--kagit); }
.urun h3 { font-size: clamp(30px, 3.4vw, 48px); letter-spacing: -.035em; max-width: 14ch; }
.urun p { margin: 0; max-width: 46ch; }
.urun .ok-baglanti { align-self: flex-start; }
.urun-acilis { padding: calc(var(--ust-yukseklik) + clamp(40px, 6vw, 88px)) 0 clamp(48px, 6vw, 80px); border-radius: 0 0 var(--kose-buyuk) var(--kose-buyuk); }
.urun-acilis-ic { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: clamp(28px, 4vw, 64px); align-items: center; }
.urun-acilis .urun-ad { font-size: 22px; margin-bottom: 26px; flex-wrap: wrap; }
.urun-acilis .urun-ad .urun-isaret { width: 44px; height: 44px; border-radius: 12px; }
.urun-acilis h1 { font-size: clamp(42px, 6vw, 88px); line-height: .94; letter-spacing: -.045em; margin-bottom: 24px; }
.urun-not { display: flex; flex-wrap: wrap; gap: 6px 18px; margin: 20px 0 0; font-size: 14.5px; font-weight: 600; }
.urun-not span { display: inline-flex; align-items: center; gap: 8px; }
.urun-not span::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--murekkep); }
.modul-izgara { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; border-top: var(--kenarlik); border-left: var(--kenarlik); }
.modul { padding: 28px; border-right: var(--kenarlik); border-bottom: var(--kenarlik); }
.modul h3 { font-size: 23px; margin-bottom: 10px; letter-spacing: -.02em; }
.modul p { margin: 0; color: var(--soluk); font-size: 15.5px; }
.modul-ikon { width: 46px; height: 46px; border-radius: 14px; background: var(--renk); display: grid; place-items: center; margin-bottom: 18px; }
.modul-ikon .ikon { width: 22px; height: 22px; color: var(--murekkep); }
.modul[style*="#115E59"] .modul-ikon .ikon { color: var(--kagit); }
.guven { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; }
.guven li { border-radius: var(--kose); padding: 24px; background: rgba(250, 247, 243, .08); font-weight: 600; line-height: 1.45; display: flex; flex-direction: column; gap: 18px; }
.guven li .ikon { width: 28px; height: 28px; color: var(--yesil); --tik: var(--murekkep); }

/* Panel önizlemeleri (Ajanskit ve Acentenot) */
.ekran2 { --cerceve: var(--mor); background: var(--cerceve); border-radius: 28px; padding: 10px; color: var(--murekkep); font-size: 12px; line-height: 1.35; margin-top: auto; }
.ekran2-acentenot { --cerceve: #14B8A6; }
.ekran2-ic { background: #FFFDFB; border-radius: 20px; display: grid; grid-template-columns: 150px minmax(0, 1fr); overflow: hidden; min-height: 290px; }
.ekran2-yan { border-right: 1.5px solid var(--cizgi); padding: 14px 10px; display: flex; flex-direction: column; gap: 2px; }
.ekran2-logo { display: flex; align-items: center; gap: 8px; font: 800 16px/1 var(--baslik); letter-spacing: -.03em; margin: 2px 4px 12px; }
.ekran2-logo svg { width: 24px; height: 24px; border-radius: 6px; }
.ekran2-yan span { padding: 7px 10px; border-radius: 99px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ekran2-yan span.secili { background: var(--yesil); }
.ekran2-acentenot .ekran2-yan span.secili { background: #115E59; color: var(--kagit); }
.ekran2-ana { padding: 16px; display: grid; gap: 12px; align-content: start; min-width: 0; }
.ekran2-ana h4 { font: 800 18px/1.1 var(--baslik); letter-spacing: -.025em; margin: 0; display: flex; align-items: center; gap: 6px; }
.ekran2-ana h4 .yildiz { width: 16px; height: 16px; }
.ekran2-kartlar { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.ekran2-kartlar > div { border-radius: 12px; padding: 10px 11px; }
.ekran2-kartlar small { display: block; font-weight: 500; color: var(--soluk); font-size: 10.5px; }
.ekran2-kartlar strong { font: 800 17px/1.15 var(--baslik); letter-spacing: -.03em; white-space: nowrap; }
.ekran2-paneller { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.ekran2-panel { border: 1.5px solid var(--cizgi); border-radius: 14px; padding: 10px 12px; min-width: 0; }
.ekran2-panel h5 { font: 700 12px/1.2 var(--metin); margin: 0 0 6px; }
.ekran2-panel li { display: grid; grid-template-columns: 20px minmax(0, 1fr) auto; gap: 8px; align-items: center; padding: 6px 0; border-top: 1px solid var(--cizgi); font-weight: 500; font-size: 11px; }
.ekran2-panel li:first-child { border-top: 0; }
.ekran2-panel li span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ekran2-panel li i { width: 20px; height: 20px; border-radius: 6px; display: grid; place-items: center; font-style: normal; font-weight: 700; font-size: 10px; background: #E6F7F3; }
.ekran2-panel li em { font-style: normal; letter-spacing: .12em; background: var(--yesil-acik); padding: 2px 7px; border-radius: 6px; font-size: 10px; }
.ekran2-acentenot .ekran2-panel li em { letter-spacing: 0; font-weight: 700; background: #E6F7F3; }
.ekran2-panel li em.sicak { background: var(--kirmizi-acik); color: #9C2A0A; }
.ekran2-panel li em.ilik { background: #FDF0C9; }
.ekran2-panel li b { font-size: 10.5px; }
.ekran2-panel li b.art { color: #4A6B00; }
.ekran2-panel li b.eks { color: #B3330E; }
.urun .ekran2 { margin-top: 8px; }
.urun .ekran2-paneller { grid-template-columns: 1fr; }
.urun .ekran2-panel:last-child { display: none; }
.urun-acilis .ekran2 { margin-top: 0; }

/* ---------- İletişim ---------- */
.iletisim-izgara { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.iletisim-kart { border-radius: var(--kose); padding: 28px; display: flex; flex-direction: column; gap: 14px; min-height: 230px; text-decoration: none; }
.iletisim-kart h2, .iletisim-kart h3 { font-size: 22px; letter-spacing: -.02em; }
.iletisim-kart p { margin: 0; font-weight: 500; }
.iletisim-kart strong { font: 800 clamp(24px, 2.4vw, 32px)/1.1 var(--baslik); letter-spacing: -.03em; margin-top: auto; word-break: break-word; }
.harita { border-radius: var(--kose-buyuk); overflow: hidden; border: var(--kenarlik); aspect-ratio: 21 / 9; background: var(--mor-acik); }
.harita iframe { width: 100%; height: 100%; border: 0; display: block; filter: grayscale(.4); }

/* ---------- Alt kısım ---------- */
.alt { background: var(--murekkep); color: var(--kagit); margin-top: var(--bolum); }
.alt-cta { background: var(--kirmizi); color: var(--murekkep); border-radius: 0 0 var(--kose-buyuk) var(--kose-buyuk); padding: clamp(64px, 8vw, 120px) 0 clamp(48px, 6vw, 88px); overflow: hidden; }
.alt-cta-ust { font-weight: 700; font-size: 18px; margin: 0; }
.alt-slogan { font-size: clamp(54px, 11.2vw, 184px); line-height: .86; letter-spacing: -.055em; color: var(--kagit); margin: 18px 0 clamp(32px, 4vw, 56px); }
.alt-slogan span { display: block; white-space: nowrap; }
.alt-slogan span + span { padding-left: .9em; }
.alt-cta-alt { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px 48px; flex-wrap: wrap; }
.alt-cta-alt p { margin: 0; font-size: 18px; font-weight: 500; max-width: 46ch; }
.alt-izgara { display: grid; grid-template-columns: 1.4fr 1fr 1.1fr 1fr; gap: 40px; padding-top: 72px; padding-bottom: 56px; }
.alt h3 { font: 700 14px/1 var(--metin); color: rgba(250, 247, 243, .55); margin: 0 0 16px; letter-spacing: .01em; }
.alt ul + h3 { margin-top: 32px; }
.alt li a { display: inline-block; padding: 5px 0; text-decoration: none; font-weight: 500; }
.alt li a:hover { color: var(--yesil); }
.alt-marka svg { width: 176px; height: auto; }
.alt-marka p { margin: 20px 0 14px; color: rgba(250, 247, 243, .75); max-width: 30ch; }
.alt-marka address { font-style: normal; color: rgba(250, 247, 243, .55); font-size: 14.5px; max-width: 34ch; }
.alt-son { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 12px; padding-top: 24px; padding-bottom: 32px; border-top: 1px solid var(--cizgi-acik); font-size: 14px; color: rgba(250, 247, 243, .6); }
.alt-son p { margin: 0; }
.alt-son a:hover { color: var(--yesil); }

/* ---------- 404 / boş ---------- */
.bulunamadi { min-height: 80vh; display: grid; place-items: center; text-align: center; padding: calc(var(--ust-yukseklik) + 40px) var(--kenar) 40px; }
.bulunamadi .fig { width: 120px; margin: 0 auto 24px; }
.bulunamadi p { color: var(--soluk); margin: 20px auto 28px; max-width: 40ch; }
.bos { border: 2px dashed var(--cizgi); border-radius: var(--kose); padding: 48px; text-align: center; color: var(--soluk); }

/* =========================================================
   Duyarlı
   ========================================================= */
@media (max-width: 1180px) {
  .rakamlar { grid-template-columns: 1fr 1fr; }
  .rakam { height: auto; min-height: 210px; }
  .rakam-daire { aspect-ratio: auto; border-radius: 999px; }
  .degerler { grid-template-columns: 1fr 1fr; }
  .deger { min-height: 320px; }
  .guven { grid-template-columns: 1fr 1fr; }
  .takvim { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 48px; }
  .takvim::before { display: none; }
  .diger-hizmet { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 900px) {
  :root { --ust-yukseklik: 68px; }
  .bolum-basi, .ana-hizmet, .sss, .bant, .kurucu, .vizyon, .ig-davet, .urun-acilis-ic, .hizmet-detay, .yazilim-vitrin, .yazilim-bant, .acilis-alt { grid-template-columns: 1fr; }
  .bento { grid-template-columns: 1fr; }
  .b-vaka, .b-vaka.b-genis, .b-esnaf, .b-kisisel { grid-column: auto; }
  .b-kisisel { grid-template-columns: 1fr; }
  .surec { grid-template-columns: 1fr; gap: 40px; }
  .is-izgara, .yazi-izgara, .ekip-izgara { grid-template-columns: 1fr 1fr; }
  .paketler { grid-template-columns: 1fr; }
  .modul-izgara { grid-template-columns: 1fr 1fr; }
  .iletisim-izgara { grid-template-columns: 1fr; }
  .alt-izgara { grid-template-columns: 1fr 1fr; }
  .kurucu-foto { position: relative; top: 0; max-width: 420px; }
  .urun-ozel { flex-direction: column; align-items: flex-start; }
  .harita { aspect-ratio: 4 / 3; }
  .reels { justify-content: flex-start; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; padding-top: 40px; }
  .reels::-webkit-scrollbar { display: none; }
  .reel { scroll-snap-align: center; --gen: 200px; flex-basis: 200px; }
}
@media (max-width: 640px) {
  body { font-size: 16px; }
  .acilis-ust span { font-size: 13px; padding: 7px 12px; }
  .etiketli { transform: rotate(-1.2deg); }
  .rakamlar { grid-template-columns: 1fr; }
  .rakam { min-height: 170px; }
  .degerler, .is-izgara, .yazi-izgara, .ekip-izgara, .modul-izgara, .guven, .alt-izgara, .diger-hizmet, .takvim { grid-template-columns: 1fr; }
  .takvim { row-gap: 32px; }
  .ah-adet li { padding: 14px; border-radius: 18px; }
  .dh { min-height: 0; }
  .paket-bas { flex-direction: column; }
  .paket-fiyat { text-align: left; }
  .tik-liste.iki-sutun { columns: 1; }
  .ekran2-ic { grid-template-columns: 1fr; }
  .ekran2-yan { display: none; }
  .ekran2-kartlar { grid-template-columns: 1fr 1fr; }
  .ekran2-paneller { grid-template-columns: 1fr; }
  .ekran2-panel:last-child { display: none; }
  .btn-grup .btn { flex: 1 1 auto; }
  .fiyat-sekmeler { display: flex; border-radius: var(--kose); }
  .fiyat-sekmeler button { flex: 1; padding: 12px 10px; }
  .sss-liste summary { grid-template-columns: 1fr 32px; }
  .sss-liste summary .ikon { width: 32px; height: 32px; }
  .alt-slogan span + span { padding-left: 0; }
  .alt-slogan span { white-space: normal; }
  .galeri { grid-template-columns: 1fr; }
  .reel { --gen: 180px; flex-basis: 180px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
  .kayan { flex-wrap: wrap; }
  .kayan ul { animation: none; flex-wrap: wrap; }
  .kayan ul[aria-hidden] { display: none; }
}
.reel-buyuk { white-space: nowrap; }
.reel-buyuk.uzun { font-size: clamp(30px, 2.5vw, 40px); }

/* =========================================================
   Abonelik satışı
   ========================================================= */
.abo-ust { display: flex; justify-content: space-between; align-items: center; gap: 16px 32px; flex-wrap: wrap; margin-bottom: 24px; }
.abo-ust .soluk { margin: 0; max-width: 46ch; font-size: 15px; }
.sure-secici { display: inline-flex; flex-wrap: wrap; gap: 6px; padding: 6px; border: var(--kenarlik); border-radius: var(--hap); background: var(--kagit); }
.sure-secici button { display: inline-flex; align-items: center; gap: 8px; border: 0; background: none; cursor: pointer; padding: 12px 20px; border-radius: var(--hap); font: 700 15.5px/1 var(--metin); color: var(--murekkep); transition: background-color .15s ease; }
.sure-secici button:hover { background: rgba(22, 19, 31, .06); }
.sure-secici button[aria-checked="true"] { background: var(--murekkep); color: var(--kagit); }
.sure-secici em { font-style: normal; font-size: 12.5px; padding: 4px 8px; border-radius: var(--hap); background: var(--yesil); color: var(--murekkep); }

.abo-kartlar { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; align-items: stretch; margin-bottom: 16px; }
.abo-kart { display: flex; flex-direction: column; gap: 18px; padding: clamp(24px, 2.4vw, 32px); border: var(--kenarlik); border-radius: 32px; background: var(--kagit); }
.abo-vurgu { background: var(--yesil); }
.abo-ad { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.abo-ad h3 { font-size: clamp(32px, 3vw, 42px); letter-spacing: -.04em; }
.abo-rozet { font: 700 13px/1 var(--metin); padding: 7px 11px; border-radius: var(--hap); background: var(--murekkep); color: var(--kagit); }
.abo-bas p { margin: 10px 0 0; font-size: 15px; color: var(--soluk); font-weight: 500; min-height: 3em; }
.abo-vurgu .abo-bas p { color: var(--murekkep); }
.abo-fiyat { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 10px; padding-top: 18px; border-top: var(--kenarlik); }
.abo-fiyat s { width: 100%; font: 700 18px/1 var(--baslik); color: var(--soluk); text-decoration-thickness: 2px; text-decoration-color: var(--kirmizi); }
.abo-vurgu .abo-fiyat s { color: rgba(22, 19, 31, .55); }
.abo-fiyat b { font: 800 clamp(42px, 4vw, 58px)/1 var(--baslik); letter-spacing: -.05em; }
.abo-fiyat span { font-weight: 700; font-size: 15px; }
.abo-donem { margin: 0; font-size: 14.5px; min-height: 2.9em; line-height: 1.45; }
.abo-kazanc { display: inline-block; margin-top: 4px; font-weight: 700; color: var(--kirmizi); }
.abo-vurgu .abo-kazanc { color: var(--murekkep); background: var(--kagit); padding: 2px 8px; border-radius: 8px; }
.abo-kart .tik-liste { border-top: 1.5px solid var(--cizgi); padding-top: 14px; }
.abo-vurgu .tik-liste .ikon { --tik: var(--yesil); }
.abo-guven { display: flex; align-items: center; gap: 10px; margin: 18px 0 0; font-size: 14.5px; color: var(--soluk); }
.abo-guven .ikon { width: 20px; height: 20px; color: var(--murekkep); flex: none; }
.abo-guven b { color: var(--murekkep); }

/* Ödeme sayfası */
.odeme-bolum { padding: calc(var(--ust-yukseklik) + clamp(28px, 4vw, 56px)) 0 0; }
.ok-baglanti.geri { border: 0; color: var(--soluk); }
.odeme-izgara { display: grid; grid-template-columns: minmax(0, 1fr) minmax(320px, 420px); gap: clamp(24px, 4vw, 56px); align-items: start; }
.odeme-form fieldset { border: 0; margin: 0 0 32px; padding: 0; }
.odeme-form legend { display: flex; align-items: center; gap: 12px; font: 800 26px/1 var(--baslik); letter-spacing: -.03em; margin-bottom: 18px; padding: 0; }
.odeme-form legend span { width: 34px; height: 34px; border-radius: 50%; background: var(--murekkep); color: var(--kagit); display: grid; place-items: center; font-size: 16px; }
.f-iki { display: grid; grid-template-columns: 1fr 1fr; gap: 0 14px; }
.f { display: flex; flex-direction: column; gap: 7px; margin-bottom: 14px; font-weight: 700; font-size: 14.5px; }
.f small { font-weight: 500; color: var(--soluk); }
.f input, .f textarea { width: 100%; font: 500 16px/1.4 var(--metin); color: var(--murekkep); background: #FFFDFB; border: 2px solid rgba(22, 19, 31, .18); border-radius: 14px; padding: 13px 15px; transition: border-color .15s ease; }
.f textarea { resize: vertical; }
.f input:focus, .f textarea:focus { outline: none; border-color: var(--murekkep); }
.f-secim { display: flex; gap: 8px; margin-bottom: 16px; flex-wrap: wrap; }
.f-secim label { cursor: pointer; }
.f-secim input { position: absolute; opacity: 0; }
.f-secim span { display: inline-block; padding: 11px 18px; border-radius: var(--hap); border: var(--kenarlik); font-weight: 700; font-size: 15px; }
.f-secim input:checked + span { background: var(--murekkep); color: var(--kagit); }
.f-secim input:focus-visible + span { outline: 3px solid var(--mor); outline-offset: 2px; }
.js [data-fatura][hidden] { display: none; }
.f-onay { display: grid; grid-template-columns: 22px 1fr; gap: 12px; align-items: start; margin-bottom: 14px; font-size: 15px; font-weight: 500; cursor: pointer; }
.f-onay input { width: 20px; height: 20px; margin: 2px 0 0; accent-color: var(--murekkep); }
.f-onay a { font-weight: 700; }
.form-hata { margin-bottom: 28px; padding: 18px 22px; border-radius: 20px; background: var(--kirmizi-acik); color: #8C2408; }
.form-hata ul { list-style: disc; padding-left: 1.2em; margin-top: 6px; }

.odeme-ozet { position: sticky; top: calc(var(--ust-yukseklik) + 16px); }
.oz-kart { border: var(--kenarlik); border-radius: 28px; padding: 24px; background: var(--kagit); display: flex; flex-direction: column; gap: 16px; }
.oz-paket { margin: 0; font-size: 16px; }
.oz-paket b { font: 800 26px/1 var(--baslik); letter-spacing: -.03em; margin-right: 4px; }
.oz-sureler { display: grid; gap: 8px; }
.oz-sure { display: grid; grid-template-columns: 20px 1fr auto; gap: 10px; align-items: center; padding: 12px 14px; border-radius: 16px; border: 2px solid var(--cizgi); cursor: pointer; transition: border-color .15s ease, background-color .15s ease; }
.oz-sure:has(input:checked) { border-color: var(--murekkep); background: var(--yesil-acik); }
.oz-sure input { accent-color: var(--murekkep); width: 18px; height: 18px; margin: 0; }
.oz-sure b { font-size: 15.5px; }
.oz-sure em { font-style: normal; font-size: 12px; font-weight: 700; margin-left: 8px; padding: 3px 7px; border-radius: var(--hap); background: var(--yesil); }
.oz-aylik { font: 800 17px/1 var(--baslik); white-space: nowrap; }
.oz-aylik small { font: 600 12px var(--metin); color: var(--soluk); }
.oz-dokum { margin: 0; display: grid; gap: 8px; padding-top: 14px; border-top: 1.5px solid var(--cizgi); }
.oz-dokum div { display: flex; justify-content: space-between; gap: 12px; font-size: 15px; }
.oz-dokum dt { color: var(--soluk); }
.oz-dokum dd { margin: 0; font-weight: 700; text-align: right; }
.oz-dokum [data-oz="tasarruf"] { color: var(--kirmizi); }
.oz-toplam { padding-top: 10px; border-top: var(--kenarlik); }
.oz-toplam dt { color: var(--murekkep); font-weight: 700; }
.oz-toplam dd { font: 800 28px/1 var(--baslik); letter-spacing: -.03em; }
.oz-not { margin: 0; font-size: 13px; color: var(--soluk); line-height: 1.5; }
.oz-guven { margin-top: 16px; display: grid; gap: 8px; font-size: 14px; font-weight: 600; }
.oz-guven li { display: flex; align-items: center; gap: 10px; }
.oz-guven .ikon { width: 18px; height: 18px; flex: none; }

/* Sipariş sonucu */
.siparis-izgara { display: grid; grid-template-columns: minmax(0, 1fr) minmax(300px, 400px); gap: clamp(24px, 4vw, 56px); align-items: start; }
.sonuc { border-radius: var(--kose-buyuk); padding: clamp(28px, 4vw, 52px); }
.sonuc-tamam { background: var(--yesil); }
.sonuc-bekle { background: var(--pembe); }
.sonuc-hata { background: var(--kirmizi-acik); }
.sonuc-etiket { display: inline-block; margin: 0 0 18px; padding: 7px 14px; border-radius: var(--hap); background: var(--murekkep); color: var(--kagit); font-weight: 700; font-size: 14px; }
.sonuc h1 { font-size: clamp(34px, 4.2vw, 58px); letter-spacing: -.04em; line-height: .98; margin-bottom: 18px; }
.sonuc p { font-size: 17px; max-width: 54ch; }
.sonuc .btn-grup { margin-top: 24px; }

.yasal { max-width: 780px; margin: 0; font-size: 17px; }
.yasal h2 { font-size: 24px; }
.alt-odeme { display: inline-flex; align-items: center; gap: 8px; }
.alt-odeme .ikon { width: 16px; height: 16px; }

/* iyzico resmi logoları */
.iyzico-logo { display: block; width: auto; max-width: 100%; height: 24px; flex: none; }
.alt-odeme .iyzico-logo { height: 26px; }
.abo-guven { flex-wrap: wrap; row-gap: 8px; column-gap: 16px; }
.abo-guven .iyzico-logo { height: 26px; }
.oz-iyzico { display: flex; justify-content: center; padding: 4px 0 0; }
.oz-iyzico .iyzico-logo { height: 24px; }
@media (max-width: 600px) {
  .alt-son { flex-direction: column; align-items: flex-start; }
  .alt-odeme .iyzico-logo, .abo-guven .iyzico-logo { height: auto; width: 100%; max-width: 340px; }
}

@media (max-width: 1080px) {
  .abo-kartlar { grid-template-columns: 1fr; max-width: 560px; }
  .abo-bas p, .abo-donem { min-height: 0; }
}
@media (max-width: 900px) {
  .odeme-izgara, .siparis-izgara { grid-template-columns: 1fr; }
  .odeme-ozet { position: static; }
}
@media (max-width: 640px) {
  .f-iki { grid-template-columns: 1fr; }
  .sure-secici { display: grid; grid-template-columns: 1fr 1fr; border-radius: 24px; width: 100%; }
  .sure-secici button { justify-content: center; padding: 12px 8px; flex-wrap: wrap; }
}
[hidden] { display: none !important; }

/* Tek sayfa: paket özeti */
.po-izgara { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.po-kart { display: flex; flex-direction: column; gap: 18px; padding: clamp(24px, 2.4vw, 32px); border-radius: 32px; text-decoration: none; color: var(--murekkep); transition: transform .2s ease; }
.po-kart:hover { transform: translateY(-4px); }
.po-cizgi { border: var(--kenarlik); }
.po-ad { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; font: 800 clamp(30px, 2.8vw, 40px)/1 var(--baslik); letter-spacing: -.04em; }
.po-ad em { font: 700 12.5px/1 var(--metin); font-style: normal; letter-spacing: 0; padding: 7px 11px; border-radius: var(--hap); background: var(--murekkep); color: var(--kagit); }
.po-fiyat { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 8px; }
.po-fiyat b { font: 800 clamp(36px, 3.4vw, 48px)/1 var(--baslik); letter-spacing: -.05em; }
.po-fiyat small { font-weight: 700; font-size: 14px; }
.po-kart ul { display: flex; flex-wrap: wrap; gap: 6px; }
.po-kart li { padding: 6px 11px; border-radius: var(--hap); border: 1.5px solid var(--murekkep); font-weight: 600; font-size: 14px; }
.po-ok { margin-top: auto; font-weight: 700; border-bottom: 2px solid currentColor; align-self: flex-start; padding-bottom: 2px; }
.po-ok::after { content: " →"; }

/* Paket kartında ortak maddeler */
.abo-kart .tik-liste .abo-ortak:first-of-type { margin-top: 0; }
.abo-kart .tik-liste li:not(.abo-ortak) + .abo-ortak { margin-top: 10px; padding-top: 14px; border-top: 1.5px dashed var(--cizgi); }
.abo-vurgu .tik-liste li:not(.abo-ortak) + .abo-ortak { border-top-color: rgba(22, 19, 31, .25); }

/* Tek sayfa: hakkımızda ve iletişim */
.etiket-ust { font: 700 14px/1 var(--metin); display: inline-block; padding: 8px 14px; border-radius: var(--hap); background: var(--murekkep); color: var(--kagit); margin: 0 0 20px; }
.ofis { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 16px; margin-top: 16px; }
.ofis .harita { margin: 0; }
.ofis-bilgi { border: var(--kenarlik); border-radius: var(--kose); padding: 28px; display: flex; flex-direction: column; gap: 16px; }
.ofis-bilgi h3 { font-size: 24px; letter-spacing: -.02em; }
.ofis-bilgi address { font-style: normal; font-weight: 500; }
.kariyer-not { margin-top: auto; padding-top: 20px; border-top: 1.5px solid var(--cizgi); }
.kariyer-not h3 { font-size: 20px; margin-bottom: 8px; }
.kariyer-not p { font-size: 15px; color: var(--soluk); margin: 0 0 12px; }
@media (max-width: 1080px) { .po-izgara { grid-template-columns: 1fr; max-width: 560px; } }
@media (max-width: 900px) { .ofis { grid-template-columns: 1fr; } }
.ofis .harita { aspect-ratio: auto; min-height: 380px; }

/* Paketler sayfası: türler arası atlama ve tek seferlik paketler */
.paket-atla { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 28px; }
.paket-atla a { padding: 12px 20px; border-radius: var(--hap); border: var(--kenarlik); font-weight: 700; text-decoration: none; color: var(--murekkep); }
.paket-atla a:hover { background: var(--murekkep); color: var(--kagit); }
.proje-bolum { padding-top: clamp(40px, 5vw, 72px); }
.proje-bolum .abo-donem b { font-weight: 700; }
.po-ek { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 16px; margin-top: 16px; }
.po-ek-kart { display: flex; flex-direction: column; gap: 10px; padding: 26px 30px; border-radius: 32px; text-decoration: none; color: var(--murekkep); transition: transform .2s ease; }
.po-ek-kart:hover { transform: translateY(-4px); }
.po-ek-ad { font: 800 clamp(26px, 2.4vw, 34px)/1 var(--baslik); letter-spacing: -.04em; }
.po-ek-kart .po-ok { margin-top: 6px; }
.oz-icerik { display: grid; gap: 6px; font-size: 14.5px; }
.oz-icerik li { display: grid; grid-template-columns: 18px 1fr; gap: 8px; }
.oz-icerik .ikon { width: 18px; height: 18px; margin-top: 1px; }
@media (max-width: 900px) { .po-ek { grid-template-columns: 1fr; } }
.po-fiyat .po-alt { width: 100%; font-weight: 600; color: var(--soluk); }

/* Ekip: açılır kapanır */
.ekip-ac { border: var(--kenarlik); border-radius: var(--kose-buyuk); }
.ekip-ac summary { list-style: none; cursor: pointer; display: flex; align-items: center; gap: 20px 28px; padding: clamp(20px, 2.4vw, 28px) clamp(20px, 3vw, 36px); flex-wrap: wrap; }
.ekip-ac summary::-webkit-details-marker { display: none; }
.ekip-ozet-yuzler { display: flex; }
.ekip-ozet-yuzler img { width: 56px; height: 56px; border-radius: 50%; object-fit: cover; border: 3px solid var(--kagit); background: var(--pembe); margin-left: -14px; }
.ekip-ozet-yuzler img:first-child { margin-left: 0; }
.ekip-ozet-metin { display: flex; flex-direction: column; gap: 4px; flex: 1; min-width: 200px; }
.ekip-ozet-metin b { font: 800 clamp(24px, 2.4vw, 32px)/1 var(--baslik); letter-spacing: -.03em; }
.ekip-ozet-metin small { font-size: 15px; color: var(--soluk); font-weight: 500; }
.ekip-ozet-dugme { display: inline-flex; align-items: center; min-height: 48px; padding: 0 24px; border-radius: var(--hap); background: var(--murekkep); color: var(--kagit); font-weight: 700; }
.ekip-ac .kapa-yazi, .ekip-ac[open] .ac-yazi { display: none; }
.ekip-ac[open] .kapa-yazi { display: inline; }
.ekip-ac[open] .ekip-ozet-dugme { background: none; color: var(--murekkep); border: var(--kenarlik); }
.ekip-liste { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px 32px; padding: 8px clamp(20px, 3vw, 36px) clamp(24px, 3vw, 40px); border-top: 1.5px solid var(--cizgi); padding-top: 32px; }
.ekip-kisi { display: grid; grid-template-columns: 96px 1fr; gap: 18px; align-items: start; }
.ekip-foto { width: 96px; height: 96px; border-radius: 50%; overflow: hidden; background: var(--renk, var(--pembe)); display: block; }
.ekip-foto img { width: 100%; height: 100%; object-fit: cover; }
.ekip-kisi h3 { font-size: 20px; letter-spacing: -.02em; }
.ekip-unvan { display: inline-block; margin: 6px 0 8px; font-size: 13px; font-weight: 700; padding: 4px 10px; border-radius: var(--hap); background: var(--murekkep); color: var(--kagit); }
.ekip-kisi p:last-child { margin: 0; font-size: 14.5px; color: var(--soluk); line-height: 1.5; }
@media (max-width: 1080px) { .ekip-liste { grid-template-columns: 1fr 1fr; } }
@media (max-width: 640px) { .ekip-liste { grid-template-columns: 1fr; } .ekip-kisi { grid-template-columns: 72px 1fr; } .ekip-foto { width: 72px; height: 72px; } }

/* Kazanç kutusu: indirim + zam koruması */
.abo-kazanc-kap:empty { display: none; }
.kazanc { margin: 0; display: grid; gap: 6px; padding: 14px 16px; border-radius: 18px; background: var(--yesil-acik); border: 1.5px dashed rgba(22, 19, 31, .3); }
.abo-vurgu .kazanc { background: var(--kagit); }
.kazanc div { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; font-size: 14.5px; }
.kazanc dt { font-weight: 600; }
.kazanc dt small { display: block; font-size: 12.5px; font-weight: 500; color: var(--soluk); margin-top: 2px; line-height: 1.35; }
.kazanc dd { margin: 0; font-weight: 700; white-space: nowrap; }
.kazanc-toplam { padding-top: 8px; margin-top: 2px; border-top: 1.5px solid rgba(22, 19, 31, .2); }
.kazanc-toplam dt, .kazanc-toplam dd { font: 800 17px/1.1 var(--baslik); color: var(--kirmizi); }
.abo-vurgu .kazanc-toplam dt, .abo-vurgu .kazanc-toplam dd { color: var(--murekkep); }

/* Paketler: tür seçici ve tür panelleri */
.tur-secici { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; margin-top: 32px; }
.tur { display: flex; flex-direction: column; gap: 6px; padding: 20px 22px; border-radius: 24px; text-decoration: none; color: var(--murekkep); border: 2px solid transparent; transition: transform .18s ease, border-color .18s ease; }
.tur:hover { transform: translateY(-3px); border-color: var(--murekkep); }
.tur::after { content: "Göster ↓"; align-self: flex-start; margin-top: 6px; font-size: 12.5px; font-weight: 700; padding: 4px 10px; border-radius: var(--hap); background: var(--murekkep); color: var(--kagit); }
.tur b { font: 800 clamp(22px, 2.1vw, 30px)/1.05 var(--baslik); letter-spacing: -.035em; }
.tur-etiket { font-size: 13px; font-weight: 700; text-transform: none; opacity: .85; margin: 0; }
.tur-fiyat { font-weight: 600; font-size: 14.5px; }
.tur[aria-current="true"] { border-color: var(--murekkep); }
.tur-panel { padding: clamp(28px, 4vw, 48px) 0 clamp(24px, 3vw, 40px); scroll-margin-top: calc(var(--ust-yukseklik) + 8px); }
.tur-bas { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: 16px 48px; align-items: end; padding: clamp(24px, 3vw, 40px); border-radius: var(--kose-buyuk); margin-bottom: 24px; }
.tur-bas h2 { font-size: clamp(36px, 4.4vw, 64px); letter-spacing: -.045em; line-height: .95; margin-top: 10px; }
.tur-bas > p { margin: 0; font-size: 16.5px; font-weight: 500; max-width: 56ch; }
.tur-bas .tur-etiket { display: inline-block; padding: 6px 12px; border-radius: var(--hap); background: var(--murekkep); color: var(--kagit); opacity: 1; }
.tur-mor .tur-bas, .tur-mor .tur-bas h2 { color: var(--murekkep); }
/* Vurgulu kart rengi türe göre */
.tur-pembe .abo-vurgu { background: var(--pembe); }
.tur-mor .abo-vurgu { background: var(--mor); }
.tur-pembe .abo-kart:not(.abo-vurgu), .tur-mor .abo-kart:not(.abo-vurgu) { border-style: solid; }
.tur-pembe .tik-liste .ikon { color: var(--murekkep); }
.tur-panel .takvim, .tur-panel > section { margin-top: clamp(32px, 4vw, 56px); }
@media (max-width: 900px) {
  .tur-secici { grid-template-columns: 1fr; }
  .tur { flex-direction: row; flex-wrap: wrap; align-items: baseline; gap: 4px 12px; padding: 16px 18px; }
  .tur b { width: 100%; order: -1; font-size: 24px; }
  .tur::after { display: none; }
  .tur-bas { grid-template-columns: 1fr; }
}

/* Tek paketli dönemlik hizmet (Meta reklam) */
.abo-tek { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); max-width: 1000px; }
.abo-yan { border-radius: 32px; padding: clamp(24px, 2.4vw, 32px); background: var(--kagit-koyu, rgba(22, 19, 31, .05)); display: flex; flex-direction: column; gap: 16px; align-self: start; }
.abo-yan h3 { font-size: 24px; letter-spacing: -.03em; line-height: 1.1; }
.abo-yan p { margin: 0; font-size: 15.5px; }
.abo-yan .ok-baglanti { align-self: flex-start; }
.abo-yan-liste { display: grid; gap: 10px; margin-top: 8px; padding-top: 16px; border-top: 1.5px solid var(--cizgi); font-size: 14.5px; }
.tur-kirmizi .tur-bas, .tur-kirmizi .tur-bas h2 { color: var(--murekkep); }
@media (max-width: 1080px) { .abo-tek { grid-template-columns: 1fr; } }
.abo-hediye-kap:empty { display: none; }
.hediye { margin: 0; display: flex; align-items: center; gap: 10px; padding: 12px 14px; border-radius: 16px; background: var(--pembe); font-weight: 700; font-size: 15px; }
.hediye span { font-size: 12.5px; padding: 4px 10px; border-radius: var(--hap); background: var(--murekkep); color: var(--kagit); }
.hediye-ipucu { background: none; border: 1.5px dashed rgba(22, 19, 31, .3); font-weight: 500; font-size: 14px; }
.abo-uyari { margin: 12px 0 0 !important; min-height: 0 !important; padding: 10px 12px; border-radius: 14px; border: 1.5px solid var(--kirmizi); color: var(--murekkep) !important; font-size: 13.5px !important; font-weight: 600 !important; background: var(--kirmizi-acik); }
.abo-kartlar:has(> .abo-kart:nth-child(2)):has(> .abo-yan) { grid-template-columns: repeat(3, minmax(0, 1fr)); max-width: none; }
.hediye-ipucu { display: block; }

/* =========================================================
   Paket kartı: "Her pakette dahil" kutusu en altta, kartlar arasında hizalı
   ========================================================= */
.abo-kart .tik-liste.abo-ozel { border-top: 1.5px solid var(--cizgi); padding-top: 14px; }
.abo-ortak-kutu { margin-top: auto; border-radius: 22px; padding: 16px 18px 12px; background: rgba(22, 19, 31, .055); border: 1.5px dashed rgba(22, 19, 31, .22); }
.abo-vurgu .abo-ortak-kutu { background: var(--kagit); border-style: solid; border-color: var(--murekkep); }
.abo-ortak-bas { margin: 0 0 6px; font: 800 13px/1 var(--metin); letter-spacing: .02em; display: inline-flex; padding: 6px 10px; border-radius: var(--hap); background: var(--murekkep); color: var(--kagit); }
.abo-ortak-kutu .tik-liste { border: 0; padding: 0; }
.abo-ortak-kutu .tik-liste li { font-size: 14.5px; padding: 4px 0; }
.abo-kart { position: relative; }

/* =========================================================
   HAREKET: animasyonlar ve etkileşimler
   ========================================================= */
:root { --yay: cubic-bezier(.2, .8, .2, 1); --sert: cubic-bezier(.7, 0, .2, 1); }

/* Kaydırma ilerleme çubuğu */
.ilerleme { position: fixed; left: 0; top: 0; height: 4px; width: 100%; background: var(--kirmizi); transform-origin: 0 50%; transform: scaleX(0); z-index: 60; pointer-events: none; }

/* Üst menü: aşağı kayınca saklan, yukarıda görün */
.ust { transition: background-color .25s ease, box-shadow .25s ease, transform .45s var(--yay); }
.ust.sakla:not(.menu-acik-ust) { transform: translateY(-100%); }
.menu a { position: relative; }
.menu a::after { content: ""; position: absolute; left: 16px; right: 16px; bottom: 6px; height: 2px; background: var(--kirmizi); transform: scaleX(0); transform-origin: 100% 50%; transition: transform .35s var(--sert); }
.menu a:hover::after { transform: scaleX(1); transform-origin: 0 50%; }
.menu a:hover { background: transparent; }

/* Düğmeler: alttan dolan renk */
.btn { position: relative; overflow: hidden; isolation: isolate; transition: transform .25s var(--yay), color .3s ease, border-color .3s ease; }
.btn::before { content: ""; position: absolute; inset: -2px; border-radius: inherit; background: var(--btn-dolgu, var(--kirmizi)); transform: translateY(102%); transition: transform .45s var(--sert); z-index: -1; }
.btn:hover::before { transform: translateY(0); }
.btn:hover { transform: translateY(-3px); color: var(--btn-dolgu-yazi, var(--murekkep)); border-color: var(--btn-dolgu, var(--kirmizi)); }
.btn-koyu { --btn-dolgu: var(--kirmizi); --btn-dolgu-yazi: var(--murekkep); }
.btn-kirmizi { --btn-dolgu: var(--murekkep); --btn-dolgu-yazi: var(--kagit); }
.btn-yesil { --btn-dolgu: var(--kagit); --btn-dolgu-yazi: var(--murekkep); }
.btn-kagit { --btn-dolgu: var(--yesil); --btn-dolgu-yazi: var(--murekkep); }
.btn-cizgi { --btn-dolgu: var(--murekkep); --btn-dolgu-yazi: var(--kagit); }
.btn-cizgi:hover { background: transparent; }
.btn-cizgi-acik { --btn-dolgu: var(--kagit); --btn-dolgu-yazi: var(--murekkep); }
.btn .ikon { transition: transform .35s var(--yay); }
.btn:hover .ikon { transform: rotate(-12deg) scale(1.15); }

/* Kayarak görünme */
.js .gor { opacity: 0; transform: translateY(46px); transition: opacity .9s var(--yay), transform .9s var(--yay); transition-delay: var(--gecikme, 0ms); }
.js .gor.gor-sol { transform: translateX(-46px); }
.js .gor.gor-olcek { transform: scale(.92) translateY(30px); }
.js .gor.gorundu { opacity: 1; transform: none; }

/* Başlıklar: kelime kelime yukarı kayar */
.js .kelimeli .k { display: inline-block; overflow: hidden; vertical-align: top; padding: .12em 0 .1em; margin: -.12em 0 -.1em; }
.js .kelimeli .k > span { display: inline-block; transform: translateY(105%) rotate(4deg); transition: transform .9s var(--yay); transition-delay: calc(var(--i) * 55ms + var(--gecikme, 0ms)); }
.js .kelimeli.gorundu .k > span { transform: none; }

/* Açılış */
.js .acilis-ust span { animation: cip-gir .7s var(--yay) both; }
.js .acilis-ust span:nth-child(2) { animation-delay: .08s; }
.js .acilis-ust span:nth-child(3) { animation-delay: .16s; }
.js .acilis-ust span:nth-child(4) { animation-delay: .24s; }
@keyframes cip-gir { from { opacity: 0; transform: translateY(24px) scale(.7) rotate(-8deg); } }
.acilis-ust span { transition: transform .3s var(--yay); }
.acilis-ust span:hover { transform: rotate(0) scale(1.08) !important; }
.js .etiketli { animation: etiket-gir 1s .45s var(--sert) backwards; }
@keyframes etiket-gir { from { clip-path: inset(0 100% 0 0 round .14em); } to { clip-path: inset(0 0 0 0 round .14em); } }
.acilis-alt { animation: yukari-gir .9s .7s var(--yay) both; }
@keyframes yukari-gir { from { opacity: 0; transform: translateY(30px); } }

/* Kayan büyük yazı bandı */
.buyuk-bant { overflow: hidden; padding: clamp(18px, 2.4vw, 30px) 0; border-block: var(--kenarlik); transform: rotate(-1.2deg); margin: 0 -2vw clamp(24px, 4vw, 56px); }
.buyuk-bant.bant-sag { transform: rotate(1.2deg); }
.buyuk-bant-ic { display: flex; width: max-content; animation: bant-kay 38s linear infinite; }
.bant-sag .buyuk-bant-ic { animation-direction: reverse; }
.buyuk-bant:hover .buyuk-bant-ic { animation-play-state: paused; }
.buyuk-bant ul { display: flex; align-items: center; flex-shrink: 0; }
.buyuk-bant li { display: flex; align-items: center; gap: clamp(18px, 2.2vw, 34px); padding-right: clamp(18px, 2.2vw, 34px); }
.bant-kelime { font: 800 clamp(40px, 6.4vw, 104px)/1 var(--baslik); letter-spacing: -.045em; white-space: nowrap; }
.zemin-murekkep .bant-kelime { color: var(--kagit); }
.zemin-murekkep .bant-cizgili { color: var(--yesil); }
.zemin-yesil .bant-cizgili { color: var(--kirmizi); }
.bant-yildiz { width: clamp(28px, 3.4vw, 54px); aspect-ratio: 1; background: var(--y); flex: none; clip-path: polygon(50% 0, 61% 35%, 100% 50%, 61% 65%, 50% 100%, 39% 65%, 0 50%, 39% 35%); animation: yildiz-don 6s linear infinite; }
@keyframes bant-kay { to { transform: translateX(-50%); } }
@keyframes yildiz-don { to { transform: rotate(360deg); } }
.zemin-murekkep { background: var(--murekkep); }

/* Kartlar: üzerine gelince canlanır */
.abo-kart, .po-kart, .po-ek-kart, .iletisim-kart, .tur, .deger, .abo-yan, .ofis-bilgi { transition: transform .45s var(--yay), border-color .3s ease, opacity .9s var(--yay); will-change: transform; }
.abo-kart:hover { border-color: var(--murekkep); }
.abo-kart .abo-fiyat b { display: inline-block; transition: transform .45s var(--yay); }
.abo-kart:hover .abo-fiyat b { transform: scale(1.06) rotate(-2deg); transform-origin: 0 100%; }
.abo-rozet { animation: rozet-sallan 3.2s ease-in-out infinite; transform-origin: 50% 0; }
@keyframes rozet-sallan { 0%, 100% { transform: rotate(-3deg); } 50% { transform: rotate(3deg) translateY(-2px); } }
.tik-liste li .ikon { transition: transform .35s var(--yay); }
.tik-liste li:hover .ikon { transform: scale(1.25) rotate(-12deg); }
.deger .d-sekil { transition: transform .8s var(--yay); }
.deger:hover .d-sekil { transform: rotate(160deg) scale(1.12); }
.deger:hover { transform: translateY(-8px) rotate(-1deg); }

/* Rakamlar */
.rakam { transition: transform .5s var(--yay); }
.rakam:hover { transform: rotate(-3deg) scale(1.03); }

/* Takvim: çizgi soldan sağa çizilir, noktalar yanar */
.js .takvim::before { transform: scaleX(0); transform-origin: 0 50%; transition: transform 1.8s var(--yay); }
.js .takvim.gorundu::before { transform: scaleX(1); }
.takvim li > :first-child { transition: transform .4s var(--yay); }
.takvim li:hover > :first-child { transform: translateY(-4px) rotate(-3deg) scale(1.06); }

/* Fotoğraflar: perde açılır */
.kurucu-foto img, .ig-kareler img, .kisi-foto img { transition: transform 1.2s var(--yay); }
.kurucu-foto:hover img { transform: scale(1.05); }
.ig-kareler img:hover { transform: scale(1.08); }
.ig-kareler { isolation: isolate; }
.ig-kareler img { position: relative; }

/* Ekip yüzleri */
.ekip-ozet-yuzler img { transition: transform .35s var(--yay), margin .35s var(--yay); }
.ekip-ac summary:hover .ekip-ozet-yuzler img { margin-left: -4px; }
.ekip-ac summary:hover .ekip-ozet-yuzler img:first-child { margin-left: 0; }
.ekip-ozet-yuzler img:hover { transform: translateY(-6px) scale(1.15); z-index: 1; position: relative; }
.ekip-ac[open] .ekip-kisi { animation: yukari-gir .6s var(--yay) both; animation-delay: calc(var(--i, 0) * 60ms); }
.ekip-foto { transition: transform .4s var(--yay), border-radius .4s var(--yay); }
.ekip-kisi:hover .ekip-foto { transform: rotate(-6deg) scale(1.06); border-radius: 30%; }

/* SSS */
.sss summary { transition: padding .3s var(--yay); }
.sss summary:hover { padding-left: 10px; }

/* Özel imleç (sadece fare kullanan cihazlarda) */
.imlec { position: fixed; left: 0; top: 0; width: 14px; height: 14px; margin: -7px 0 0 -7px; border-radius: 50%; background: var(--kirmizi); pointer-events: none; z-index: 70; transition: width .3s var(--yay), height .3s var(--yay), margin .3s var(--yay), background-color .3s ease, opacity .3s ease; opacity: 0; }
.imlec.aktif { opacity: 1; }
.imlec.buyuk { width: 56px; height: 56px; margin: -28px 0 0 -28px; background: var(--yesil); mix-blend-mode: multiply; }
.imlec.gizle { opacity: 0; }

/* Kayan marka şeridi: üzerine gelince yavaşlar */
.kayan:hover ul { animation-play-state: paused; }
.marka-logo, .marka-ogesi { transition: transform .35s var(--yay), opacity .3s ease; }
.marka-ogesi:hover { transform: scale(1.1) rotate(-3deg); }

/* Tür kutuları */
.tur:hover { transform: translateY(-6px) rotate(-1.2deg); }
.tur:nth-child(even):hover { transform: translateY(-6px) rotate(1.2deg); }
.tur b { transition: letter-spacing .4s var(--yay); }
.tur:hover b { letter-spacing: -.02em; }

/* Alt kısım dev slogan */
.alt-slogan span { display: block; }
.js .alt-slogan.kelimeli .k > span { transition-duration: 1.1s; }

@keyframes yavas-don { to { transform: rotate(360deg); } }

@media (prefers-reduced-motion: reduce) {
  .js .gor, .js .kelimeli .k > span, .js .perde { opacity: 1 !important; transform: none !important; clip-path: none !important; }
  .buyuk-bant-ic, .bant-yildiz, .abo-rozet { animation: none !important; }
  .imlec, .ilerleme { display: none; }
}
@media (hover: none), (pointer: coarse) { .imlec { display: none; } }

/* =========================================================
   Uçan objeler: süzülür, fareden kaçar, tutup fırlatılabilir
   ========================================================= */
.acilis, .ucan-kap { position: relative; }
.ucan-kap > .kap, .acilis > .kap, .acilis > .reels { position: relative; z-index: 2; }
.ucanlar { position: absolute; inset: 0; z-index: 1; pointer-events: none; overflow: hidden; border-radius: inherit; }
.alt-cta .ucanlar, .acilis .ucanlar { overflow: visible; }
.ucan { position: absolute; width: var(--boy); height: var(--boy); pointer-events: auto; cursor: grab; touch-action: none; user-select: none; will-change: transform; }
.ucan:active { cursor: grabbing; }
.ucan-ic { position: absolute; inset: 0; display: grid; place-items: center; background: var(--renk); transform: rotate(var(--don)); animation: suzul var(--sure) ease-in-out infinite; animation-delay: var(--gec); transition: scale .3s var(--yay); }
.ucan:hover .ucan-ic { scale: 1.12; }
.ucan.tutuldu .ucan-ic { scale: 1.2; animation-play-state: paused; }
@keyframes suzul { 0%, 100% { translate: 0 0; rotate: 0deg; } 33% { translate: 6px -14px; rotate: 8deg; } 66% { translate: -8px 6px; rotate: -6deg; } }
.ucan-yildiz .ucan-ic { clip-path: polygon(50% 0, 61% 35%, 100% 50%, 61% 65%, 50% 100%, 39% 65%, 0 50%, 39% 35%); animation-name: suzul-don; }
@keyframes suzul-don { 0% { translate: 0 0; rotate: 0deg; } 50% { translate: 0 -16px; rotate: 180deg; } 100% { translate: 0 0; rotate: 360deg; } }
.ucan-daire .ucan-ic { border-radius: 50%; }
.ucan-hap { height: calc(var(--boy) * .42); }
.ucan-hap .ucan-ic { border-radius: 999px; }
.ucan-yarim { height: calc(var(--boy) * .5); }
.ucan-yarim .ucan-ic { border-radius: 999px 999px 0 0; }
.ucan-kare .ucan-ic { border-radius: 28%; }
.ucan-ucgen .ucan-ic { clip-path: polygon(50% 4%, 96% 92%, 4% 92%); border-radius: 12px; }
.ucan-cicek .ucan-ic { clip-path: polygon(50% 0, 63% 20%, 85% 15%, 80% 37%, 100% 50%, 80% 63%, 85% 85%, 63% 80%, 50% 100%, 37% 80%, 15% 85%, 20% 63%, 0 50%, 20% 37%, 15% 15%, 37% 20%); animation-name: suzul-don; animation-duration: 14s; }
.ucan-w .ucan-ic { border-radius: 30%; }
.ucan-w b { font: 800 calc(var(--boy) * .62)/1 var(--baslik); color: var(--kagit); letter-spacing: -.06em; translate: 0 -4%; }
.ucan-dalga { height: calc(var(--boy) * .34); }
.ucan-dalga .ucan-ic { background: none; color: var(--renk); }
.ucan-dalga svg { width: 100%; height: 100%; overflow: visible; }
/* Göz: fareyi takip eder, ara sıra kırpar */
.ucan-goz { height: calc(var(--boy) * .6); }
.ucan-goz .ucan-ic { background: var(--renk); border-radius: 999px; display: flex; justify-content: center; align-items: center; gap: 8%; padding: 0 10%; border: 2.5px solid var(--murekkep); }
.goz-beyaz { position: relative; flex: 1; aspect-ratio: 1; border-radius: 50%; background: var(--kagit); border: 2.5px solid var(--murekkep); overflow: hidden; animation: kirp 5.5s infinite; animation-delay: var(--gec); }
.bebek { position: absolute; left: 50%; top: 50%; width: 46%; height: 46%; margin: -23% 0 0 -23%; border-radius: 50%; background: var(--murekkep); transition: transform .12s linear; }
@keyframes kirp { 0%, 92%, 100% { scale: 1 1; } 95% { scale: 1 .08; } }
.takvim-bolum .ucan-goz .ucan-ic, .takvim-bolum .goz-beyaz, .takvim-bolum .bebek { border-color: var(--murekkep); }
@media (max-width: 900px) { .ucan.masaustu { display: none; } .ucan { --boy: 46px !important; } }
@media (prefers-reduced-motion: reduce) { .ucan-ic, .goz-beyaz { animation: none !important; } }

/* Perde: kırpma resmin kendisinde, gözcü kapsayıcıda */
.js .perde-ic { clip-path: inset(100% 0 0 0); transition: clip-path 1.3s var(--sert); }
.js .perde-acik .perde-ic { clip-path: inset(0 0 0 0); }

/* Google kartındaki uyarı en altta */
.abo-kart > .abo-uyari { margin: 0 !important; }

/* =========================================================
   İllüstrasyonlar: kutuların kenarına oturan karakterler
   ========================================================= */
.ill { position: absolute; top: 0; z-index: 4; pointer-events: none; transform: translateY(calc(-1 * var(--cizgi))); line-height: 0; }
.ill svg { width: 100%; height: auto; overflow: visible; display: block; }
.ill .bacak, .ill .kafa, .ill .megafon, .ill .ses, .ill .kalem, .ill .parmak, .ill .kalp { transform-box: fill-box; }
.ill .bacak { transform-origin: 50% 6%; animation: bacak-salla 2.2s ease-in-out infinite; }
.ill .bacak.b2 { animation-delay: -1.1s; }
@keyframes bacak-salla { 0%, 100% { transform: rotate(-12deg); } 50% { transform: rotate(14deg); } }
.ill .kafa { transform-origin: 50% 100%; animation: kafa-salla 3.4s ease-in-out infinite; }
@keyframes kafa-salla { 0%, 100% { transform: rotate(-4deg); } 50% { transform: rotate(5deg) translateY(-2px); } }
.ill .kalp { transform-origin: 50% 100%; animation: kalp-uc 2.6s ease-out infinite; }
@keyframes kalp-uc { 0% { transform: translate(0, 10px) scale(.4); opacity: 0; } 30% { opacity: 1; } 100% { transform: translate(14px, -40px) scale(1.1) rotate(18deg); opacity: 0; } }
.ill .megafon { transform-origin: 0% 50%; animation: megafon 1.6s ease-in-out infinite; }
@keyframes megafon { 0%, 100% { transform: rotate(-4deg); } 50% { transform: rotate(4deg) scale(1.04); } }
.ill .ses { transform-origin: 0% 50%; animation: ses 1.6s ease-out infinite; }
@keyframes ses { 0% { opacity: 0; transform: translateX(-8px) scale(.8); } 40% { opacity: 1; } 100% { opacity: 0; transform: translateX(10px) scale(1.15); } }
.ill .kalem { transform-origin: 50% 70%; animation: kalem-salla 2.8s ease-in-out infinite; }
@keyframes kalem-salla { 0%, 100% { transform: rotate(-3deg); } 50% { transform: rotate(3deg) translateY(-3px); } }
.ill .parmak { animation: parmak 3s ease-in-out infinite; }
.ill .parmak.p2 { animation-delay: -.4s; }
@keyframes parmak { 0%, 80%, 100% { transform: none; } 86% { transform: translateY(-3px); } 92% { transform: none; } 96% { transform: translateY(-2px); } }
.ill-bakan .kafa { animation: bakan-cik 4.5s var(--yay) infinite; transform-origin: 50% 100%; }
@keyframes bakan-cik { 0%, 100% { transform: translateY(6px); } 20%, 75% { transform: translateY(0) rotate(-3deg); } 45% { transform: translateY(-2px) rotate(4deg); } }
.bebek-ill { transition: transform .12s linear; }

/* Yerleşim */
.tur-panel { padding-top: clamp(150px, 15vw, 210px); }
.tur-bas { position: relative; }
.tur-bas .ill { right: 7%; width: clamp(120px, 13vw, 176px); }
.tur-bas .ill-bakan { width: clamp(130px, 14vw, 190px); right: 9%; }
.tur-bas .ill-kalem { width: clamp(140px, 15vw, 200px); }
.etiketli { position: relative; }
.ill-etiket { right: .35em; width: .95em; }
.po-kart { position: relative; }
.ill-po { left: 38%; width: 120px; }
.takvim-bolum { margin-top: clamp(140px, 13vw, 190px); overflow: visible; }
.ill-takvim { right: 9%; width: clamp(130px, 12vw, 170px); }
.alt-cta { position: relative; }
@media (max-width: 900px) {
  .tur-bas .ill { right: 6%; width: 110px; }
  .ill-po { width: 96px; left: auto; right: 20px; }
  .ill-alt { width: 110px; right: 0; opacity: .95; }
}
@media (max-width: 560px) { .ill-etiket { display: none; } }
@media (prefers-reduced-motion: reduce) { .ill * { animation: none !important; } }
.abo-kart:hover, .js .abo-kart.gor.gorundu:hover { transform: translateY(-6px); }
@media (max-width: 900px) { .ill-alt { display: none; } }
.tur-panel { padding-top: clamp(140px, 13vw, 180px); }

/* Oturan karakterler (v2) */
.alt { position: relative; }
.ill-alt { right: 8%; width: clamp(150px, 13vw, 200px); z-index: 5; }
.tur-bas .ill { width: clamp(150px, 14vw, 200px); right: 6%; }
.tur-bas .ill-bakan { width: clamp(130px, 14vw, 190px); right: 9%; }
.ill-etiket { width: 1.05em; right: .2em; }
.ill-takvim { width: clamp(150px, 13vw, 200px); }
.ill .buhar { animation: buhar 2.4s ease-in-out infinite; transform-box: fill-box; transform-origin: 50% 100%; }
@keyframes buhar { 0% { opacity: 0; transform: translateY(6px) scaleY(.6); } 40% { opacity: 1; } 100% { opacity: 0; transform: translateY(-8px) scaleY(1.1); } }
.ill .cubuk { transform-box: fill-box; transform-origin: 50% 100%; animation: cubuk 2.6s var(--yay) infinite; }
.ill .cubuk.c2 { animation-delay: .15s; } .ill .cubuk.c3 { animation-delay: .3s; }
@keyframes cubuk { 0%, 15% { transform: scaleY(.3); } 45%, 85% { transform: scaleY(1); } 100% { transform: scaleY(.3); } }
.ill .grafik { transform-box: fill-box; transform-origin: 0 100%; animation: suzul-ill 4s ease-in-out infinite; }
@keyframes suzul-ill { 0%, 100% { transform: translateY(0) rotate(-2deg); } 50% { transform: translateY(-6px) rotate(2deg); } }
.ill .bildirim { transform-box: fill-box; transform-origin: 50% 100%; animation: bildirim 3.6s var(--yay) infinite; }
.ill .bildirim.b2 { animation-delay: 1.2s; } .ill .bildirim.b3 { animation-delay: 2.4s; }
@keyframes bildirim { 0% { opacity: 0; transform: translateY(14px) scale(.5); } 12%, 70% { opacity: 1; transform: none; } 85%, 100% { opacity: 0; transform: translateY(-10px) scale(.9); } }
.ill .ciz-el { transform-box: fill-box; transform-origin: 100% 0; animation: ciz 1.8s ease-in-out infinite; }
@keyframes ciz { 0%, 100% { transform: translate(0, 0) rotate(0); } 25% { transform: translate(-6px, -4px) rotate(-4deg); } 50% { transform: translate(-2px, 3px); } 75% { transform: translate(-8px, 1px) rotate(3deg); } }
.ill .logo-ciz { stroke-dasharray: 1; animation: logo-ciz 3.6s ease-in-out infinite; }
@keyframes logo-ciz { 0% { stroke-dashoffset: 1; } 45%, 85% { stroke-dashoffset: 0; } 100% { stroke-dashoffset: 1; } }
.ill .telefon { transform-box: fill-box; transform-origin: 0 100%; animation: telefon 3s ease-in-out infinite; }
@keyframes telefon { 0%, 100% { transform: rotate(0); } 50% { transform: rotate(-6deg) translateY(-3px); } }
.ill .atkuyrugu { transform-box: fill-box; transform-origin: 0 0; animation: atkuyrugu 2.2s ease-in-out infinite; }
@keyframes atkuyrugu { 0%, 100% { transform: rotate(-3deg); } 50% { transform: rotate(5deg); } }
.ill .bacak { animation-duration: 2.6s; }
@keyframes bacak-salla { 0%, 100% { transform: rotate(-9deg); } 50% { transform: rotate(10deg); } }
@media (max-width: 900px) { .ill-alt { display: none; } .tur-bas .ill { width: 120px; } }
.ill-etiket { width: 1.3em; }

/* Oturan karakterler kaldırıldı: boşluklar normale döndü, yerlerinde uçan objeler */
.tur-panel { padding-top: clamp(90px, 9vw, 130px); }
.takvim-bolum { margin-top: 0; }
.tur-panel > .ucanlar { overflow: visible; }

/* =========================================================
   Kasım 2026 düzenlemeleri
   ========================================================= */

/* Gizli kart grupları (amca oğlu geçişi) */
.abo-kartlar[hidden] { display: none !important; }

/* Kırmızı zeminde koyu düğme: üzerine gelince kaybolmasın */
.zemin-kirmizi .btn-koyu { --btn-dolgu: var(--kagit); --btn-dolgu-yazi: var(--murekkep); }

/* Uçan kahveler */
.ucan-kahve .ucan-ic { background: none; color: var(--renk); }
.ucan-kahve svg { width: 100%; height: 100%; overflow: visible; }
.kahve-buhar path { animation: buhar 2.6s ease-in-out infinite; transform-box: fill-box; transform-origin: bottom; }
.kahve-buhar path:nth-child(2) { animation-delay: .4s; }
.kahve-buhar path:nth-child(3) { animation-delay: .8s; }
@media (prefers-reduced-motion: reduce) { .kahve-buhar path { animation: none; } }

/* Ofis kutusunda sade iletişim bilgileri */
.ofis-iletisim { margin: 0; display: grid; gap: 0; }
.ofis-iletisim div { display: grid; grid-template-columns: 130px minmax(0, 1fr); gap: 12px; padding: 11px 0; border-top: 1.5px solid var(--cizgi); }
.ofis-iletisim div:first-child { border-top: 0; padding-top: 0; }
.ofis-iletisim dt { font-size: 14px; font-weight: 600; color: var(--soluk); }
.ofis-iletisim dd { margin: 0; font-weight: 600; min-width: 0; overflow-wrap: anywhere; }
.ofis-iletisim address { font-style: normal; font-weight: 500; }
.ofis-iletisim a { color: inherit; text-decoration: none; border-bottom: 1.5px solid var(--cizgi); }
.ofis-iletisim a:hover { border-bottom-color: var(--kirmizi); }
@media (max-width: 520px) { .ofis-iletisim div { grid-template-columns: 1fr; gap: 2px; } }

/* Reklam yönetimi: renkli bilgilendirme kutusu, "Her pakette dahil" kutusu listenin hemen altında */
.tur-kirmizi .abo-yan { background: var(--yesil); border: var(--kenarlik); }
.tur-kirmizi .abo-yan-liste { border-top-color: rgba(22, 19, 31, .2); }

/* Kurumsal kimlik: mor üstünde okunurluk için açık mor vurgulu kart */
.tur-mor .abo-vurgu { background: #D3CAFB; }
.zemin-mor { background: #B9ABF7; }
/* Açık mor zeminde tüm yazılar koyu (beyaz başlıklar okunmuyordu) */
.zemin-mor :is(h1, h2, h3), .reel-metin.zemin-mor .reel-buyuk, .deger.zemin-mor :is(.d-vurgu, h3), .is-gorsel.zemin-mor .is-yer, .yazi-kapak.zemin-mor .kapak-baslik, .sayfa-basi.zemin-mor h1 { color: var(--murekkep); }

/* Proje kartı notu (alan adı, sunucu, destek hariç) */
.abo-not { margin: 0; padding: 10px 12px; border-radius: 14px; background: rgba(22, 19, 31, .06); font-size: 13.5px; font-weight: 600; line-height: 1.45; }
.abo-vurgu .abo-not { background: var(--kagit); }

/* Süre seçicide basılı düğme */
.sure-secici button[aria-pressed="true"] { background: var(--murekkep); color: var(--kagit); }

/* Şaka paket: amca oğlu */
.amca-kart { background: var(--pembe-acik); border-style: dashed; transform: rotate(-.6deg); }
.amca-kart .abo-rozet { background: var(--kirmizi); color: var(--kagit); }
.amca-kart .abo-fiyat b { text-decoration: line-through; text-decoration-thickness: 3px; text-decoration-color: var(--kirmizi); }
.amca-kayip { margin: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; padding: 12px 14px; border-radius: 16px; background: var(--kagit); border: 2px solid var(--kirmizi); font-weight: 700; color: var(--kirmizi); }
.amca-kayip span { font-size: 12.5px; padding: 4px 10px; border-radius: var(--hap); background: var(--kirmizi); color: var(--kagit); }
.amca-liste li { display: flex; gap: 10px; align-items: flex-start; }
.amca-x { flex: none; display: grid; place-items: center; width: 22px; height: 22px; margin-top: 1px; border-radius: 50%; background: var(--kirmizi); color: var(--kagit); font-weight: 800; font-size: 16px; line-height: 1; }
.amca-kart .abo-ortak-kutu { background: var(--kagit); border-style: dashed; }
.amca-yan { background: var(--yesil); border: var(--kenarlik); }
.amca-geri { border: 0; border-bottom: 2px solid currentColor; background: none; padding: 0 0 2px; font: inherit; font-weight: 700; color: inherit; cursor: pointer; }
.amca-secici em { background: var(--pembe); }

/* Anasayfa paket özeti: iki paket varsa iki sütun */
.po-izgara:has(> :nth-child(2):last-child) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 1080px) { .po-izgara:has(> :nth-child(2):last-child) { grid-template-columns: 1fr; } }
@media (max-width: 1080px) { .abo-kartlar { margin-left: auto; margin-right: auto; } }

/* Sosyal medya: "Her pakette dahil" sütunu */
.abo-dahil { background: var(--pembe) !important; border: var(--kenarlik); }
.abo-dahil h3 { font-size: 26px; }
.abo-dahil > p { font-weight: 500; }
.abo-dahil .tik-liste { margin-top: 6px; padding-top: 16px; border-top: 1.5px solid rgba(22, 19, 31, .18); }
.abo-dahil .tik-liste .ikon { color: var(--murekkep); --tik: var(--pembe); }
@media (max-width: 1080px) { .abo-kartlar:has(> .abo-dahil) > .abo-dahil { grid-column: 1 / -1; } }
@media (max-width: 1080px) {
  .abo-kartlar:has(> .abo-kart:nth-child(2)):has(> .abo-yan) { grid-template-columns: 1fr; max-width: 560px; }
  .abo-kartlar:has(> .abo-kart:nth-child(2)):has(> .abo-yan) > .abo-yan { grid-column: auto; }
}

/* =========================================================
   Apple düzeni + Whosoft kimliği (2026-11)
   Ortalanmış başlıklar, ferah aralıklar, büyük karolar;
   renkler, yazı tipleri, çerçeveler ve uçan nesneler markanın.
   ========================================================= */

/* Ortalanmış bölüm başlıkları */
.bolum-basi.orta { display: block; max-width: 900px; margin-left: auto; margin-right: auto; text-align: center; }
.bolum-basi.orta h2 { margin-bottom: 20px; }
.bolum-basi.orta p { margin: 0 auto; max-width: 52ch; font-size: clamp(18px, 1.6vw, 21px); font-weight: 500; }
.bolum-gri { background: var(--kagit-koyu); }

/* Açılış: ortada */
.acilis-orta { text-align: center; padding-bottom: clamp(24px, 3vw, 48px); }
.acilis-orta .kap { max-width: calc(1120px + var(--kenar) * 2); }
.acilis-orta .acilis-ust { justify-content: center; }
.acilis-orta .acilis-alt { display: flex; flex-direction: column; align-items: center; gap: 28px; }
.acilis-orta .acilis-alt .giris { max-width: 46ch; font-size: clamp(19px, 1.7vw, 23px); }
.acilis-orta .btn-grup { justify-content: center; }

/* Kayan vitrin (çekimler) */
.vitrin { position: relative; z-index: 2; display: flex; width: 100%; margin-top: clamp(48px, 6vw, 80px); overflow: hidden; padding: 12px 0 28px; }
.vitrin ul { display: flex; flex: none; gap: clamp(14px, 1.6vw, 22px); padding-right: clamp(14px, 1.6vw, 22px); animation: kay 70s linear infinite; }
.vitrin li { flex: none; width: clamp(210px, 22vw, 320px); aspect-ratio: 3 / 4; border-radius: var(--kose); overflow: hidden; border: var(--kenarlik); background: var(--kagit-koyu); transform: rotate(var(--egim, -1.5deg)); transition: transform .5s var(--yay); }
.vitrin li:nth-child(even) { --egim: 1.8deg; margin-top: clamp(20px, 2.6vw, 40px); }
.vitrin li:nth-child(3n) { --egim: -.8deg; }
.vitrin li:hover { transform: rotate(0deg) scale(1.03); }
.vitrin img { width: 100%; height: 100%; object-fit: cover; }
.vitrin li.vitrin-uclu { width: calc(clamp(210px, 22vw, 320px) * 3); aspect-ratio: 9 / 4; display: grid; grid-template-columns: repeat(3, 1fr); --egim: -1deg; }
.vitrin-uclu img { min-width: 0; }
@keyframes kay { to { transform: translateX(-100%); } }
@media (prefers-reduced-motion: reduce) { .vitrin { overflow-x: auto; } .vitrin ul { animation: none; } .vitrin ul + ul { display: none; } }

/* Rakam karoları */
.rakam-izgara { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.rk { position: relative; overflow: hidden; display: flex; flex-direction: column; justify-content: space-between; gap: 28px; min-height: 240px; padding: clamp(24px, 2.6vw, 34px); border: var(--kenarlik); border-radius: var(--kose-buyuk); }
.rk-etiket { align-self: flex-start; font: 700 14px/1 var(--metin); padding: 8px 13px; border-radius: var(--hap); background: var(--kagit); color: var(--murekkep); }
.rk-buyuk { display: block; font: 800 clamp(56px, 6vw, 92px)/.9 var(--baslik); letter-spacing: -.05em; margin-bottom: 12px; }
.rk-buyuk.uzun { font-size: clamp(46px, 4.6vw, 70px); }
.rk p { margin: 0; font: 700 clamp(17px, 1.4vw, 20px)/1.25 var(--baslik); letter-spacing: -.01em; max-width: 24ch; }
.rk.zemin-kirmizi .rk-buyuk, .rk.zemin-mor .rk-buyuk { color: var(--kagit); }
.rk.zemin-murekkep .rk-buyuk { color: var(--yesil); }
.rk.zemin-murekkep p { color: var(--kagit); }
.rk.zemin-kagit .rk-etiket { background: var(--murekkep); color: var(--kagit); }
.rk-0 { grid-column: span 2; grid-row: span 2; }
.rk-0 .rk-buyuk { font-size: clamp(130px, 15vw, 230px); }
.rk-0 p { font-size: clamp(20px, 1.9vw, 26px); }
.rk-0 .rk-etiket, .rk-0 .rk-govde { position: relative; z-index: 1; max-width: 56%; }
.rk-0 .rk-gorsel { position: absolute; right: 7%; top: 50%; width: 34%; transform: translateY(-50%) rotate(5deg); border-radius: var(--kose); overflow: hidden; border: 2px solid var(--kagit); box-shadow: 0 30px 60px rgba(0, 0, 0, .45); transition: transform .6s var(--yay); }
.rk-0:hover .rk-gorsel { transform: translateY(-50%) rotate(0deg) scale(1.04); }
.rk-0 .rk-gorsel img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; }
.rk-3, .rk-4 { grid-column: span 2; }
@media (max-width: 980px) { .rakam-izgara { grid-template-columns: repeat(2, minmax(0, 1fr)); } .rk-0 { grid-column: span 2; grid-row: span 1; min-height: 380px; } }
@media (max-width: 560px) {
  .rakam-izgara { gap: 12px; }
  .rk { min-height: 0; padding: 22px 20px; gap: 18px; }
  .rk-buyuk { font-size: 46px; } .rk-buyuk.uzun { font-size: 38px; }
  .rk p { font-size: 15.5px; }
  .rk-0 { min-height: 300px; } .rk-0 .rk-buyuk { font-size: 120px; } .rk-0 .rk-gorsel { width: 38%; right: 6%; }
}

/* Hizmet karoları */
.hizmet-izgara { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.hizmet { position: relative; overflow: hidden; display: flex; flex-direction: column; align-items: center; text-align: center; min-height: clamp(520px, 46vw, 640px); padding: clamp(32px, 3.6vw, 52px) clamp(24px, 3vw, 44px) 0; border: var(--kenarlik); border-radius: var(--kose-buyuk); text-decoration: none; color: var(--murekkep); }
.hizmet.zemin-murekkep { color: var(--kagit); }
.hz-etiket { display: inline-block; margin-bottom: 18px; font: 700 14px/1 var(--metin); padding: 8px 14px; border-radius: var(--hap); background: var(--murekkep); color: var(--kagit); }
.hizmet.zemin-murekkep .hz-etiket { background: var(--yesil); color: var(--murekkep); }
.hizmet h3 { font-size: clamp(34px, 3.6vw, 52px); letter-spacing: -.035em; line-height: 1; margin-bottom: 14px; }
.hizmet > p { margin: 0 auto; max-width: 30ch; font-size: clamp(17px, 1.5vw, 20px); font-weight: 500; }
.hizmet .hz-fiyat { margin-top: 12px; font-size: 16px; font-weight: 600; }
.hizmet .hz-fiyat b { font-weight: 800; }
.hizmet.zemin-murekkep > p { color: rgba(250, 247, 243, .78); }
.hizmet.zemin-murekkep .hz-fiyat b { color: var(--yesil); }
.hizmet .btn { margin-top: 24px; }
.hz-gorsel { margin-top: auto; width: 100%; padding-top: 36px; display: flex; justify-content: center; align-items: flex-end; }
.hg-sosyal { gap: 14px; }
.hg-sosyal img { width: 30%; max-width: 180px; aspect-ratio: 3 / 4; object-fit: cover; border: var(--kenarlik); border-bottom: 0; border-radius: 20px 20px 0 0; transform: translateY(8px) rotate(-3deg); transition: transform .5s var(--yay); }
.hg-sosyal img:nth-child(2) { width: 34%; max-width: 210px; transform: translateY(0) rotate(0deg); }
.hg-sosyal img:nth-child(3) { transform: translateY(8px) rotate(3deg); }
.hizmet:hover .hg-sosyal img { transform: translateY(-6px) rotate(0deg); }
.hg-reklam { position: relative; }
.hg-reklam svg { width: 100%; max-width: 520px; height: auto; }
.hg-reklam-etiketler { position: absolute; top: 32px; left: 50%; transform: translateX(-50%); display: flex; gap: 8px; }
.hg-reklam-etiketler span { padding: 7px 14px; border-radius: var(--hap); border: 2px solid var(--kagit); font-size: 14px; font-weight: 700; color: var(--kagit); }
.hg-reklam-etiketler span:first-child { background: var(--pembe); color: var(--murekkep); border-color: var(--pembe); }
.hg-web { padding-left: 6%; padding-right: 6%; }
.tarayici { width: 100%; max-width: 520px; border: var(--kenarlik); border-bottom: 0; border-radius: 18px 18px 0 0; background: var(--kagit); overflow: hidden; text-align: left; transition: transform .5s var(--yay); }
.hizmet:hover .tarayici { transform: translateY(-6px); }
.tarayici-ust { display: flex; align-items: center; gap: 6px; padding: 12px 14px; border-bottom: var(--kenarlik); }
.tarayici-ust i { width: 11px; height: 11px; border-radius: 50%; background: var(--kirmizi); border: 1.5px solid var(--murekkep); }
.tarayici-ust i:nth-child(2) { background: var(--yesil); } .tarayici-ust i:nth-child(3) { background: var(--mor); }
.tarayici-ust span { flex: 1; margin: 0 20px; padding: 4px 10px; border-radius: 8px; background: var(--kagit-koyu); font-size: 12px; font-weight: 600; text-align: center; }
.tarayici-ic { padding: 22px 22px 0; display: grid; gap: 12px; }
.tarayici-ic b { display: block; height: 10px; border-radius: 6px; background: var(--kagit-koyu); }
.tarayici-ic .t-bas { height: 24px; width: 70%; background: var(--murekkep); border-radius: 8px; }
.tarayici-ic .t-alt { width: 50%; }
.tarayici-ic .t-dugme { width: 96px; height: 28px; border-radius: 99px; background: var(--kirmizi); }
.tarayici-ic .t-gorsel { height: 120px; border-radius: 14px 14px 0 0; background: var(--yesil); border: var(--kenarlik); border-bottom: 0; }
.hg-kimlik { flex-direction: column; align-items: center; gap: 22px; padding-bottom: clamp(36px, 4vw, 56px); }
.hg-kimlik .isaret-buyuk { width: clamp(120px, 13vw, 160px) !important; height: auto; transform: rotate(-6deg); transition: transform .6s var(--yay); }
.hizmet:hover .hg-kimlik .isaret-buyuk { transform: rotate(4deg) scale(1.06); }
.renk-ornekleri { display: flex; gap: 10px; }
.renk-ornekleri i { width: 36px; height: 36px; border-radius: 50%; border: var(--kenarlik); }
@media (max-width: 860px) { .hizmet-izgara { grid-template-columns: 1fr; } .hizmet { min-height: 540px; } }

/* Paket karşılaştırma: kutulu, dolgun */
.karsilastir { display: grid; grid-template-columns: repeat(var(--sutun, 2), minmax(0, 420px)); justify-content: center; gap: clamp(20px, 3vw, 40px); }
.ks { position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; padding: clamp(32px, 3.4vw, 44px) clamp(24px, 3vw, 40px); border: var(--kenarlik); border-radius: var(--kose-buyuk); background: var(--kagit); }
.ks-rozet { font: 700 13px/1 var(--metin); padding: 7px 12px; border-radius: var(--hap); background: var(--murekkep); color: var(--kagit); margin-bottom: 14px; }
.ks h3 { font-size: clamp(40px, 4vw, 56px); letter-spacing: -.04em; line-height: 1; }
.ks-alt { margin: 12px 0 0; font-size: 16px; font-weight: 500; color: var(--soluk); min-height: 3em; }
.ks-vurgu .ks-alt { color: var(--murekkep); }
.ks-fiyat { margin: 22px 0 22px; font-size: 16px; font-weight: 600; }
.ks-fiyat b { font: 800 clamp(36px, 3.4vw, 48px)/1 var(--baslik); letter-spacing: -.04em; display: block; margin-bottom: 4px; }
.ks .btn-grup { justify-content: center; }
.ks-liste { width: 100%; margin: 32px 0 28px; padding-top: 28px; border-top: var(--kenarlik); display: grid; gap: 22px; }
.ks-liste li { display: flex; flex-direction: column; align-items: center; gap: 8px; font-size: 17px; font-weight: 600; }
.ks-liste .ikon { width: 30px; height: 30px; }
.ks .ok-baglanti { margin-top: auto; }
.ill-ks { left: auto; right: 34px; width: 112px; }
@media (max-width: 760px) { .karsilastir { grid-template-columns: 1fr; } .ill-ks { width: 92px; right: 24px; } }

/* Karşılaştırma: telefonda kompakt liste, açılışta metne binen uçanları gizle */
@media (max-width: 640px) {
  .ks-liste { gap: 14px; text-align: left; }
  .ks-liste li { flex-direction: row; align-items: flex-start; gap: 12px; font-size: 16px; }
  .ks-liste .ikon { width: 24px; height: 24px; flex: none; }
  .acilis-orta .ucan-goz { display: none; }
}