/* Reklammarket Werbetechnik — marka stili (claude 26.10.2026).
   Renkler logodan: kırmızı #E31E24, gri #C8C8C8, zemin siyah. Yazı: Montserrat (başlık) + Inter (metin), kendi sunucumuzdan. */
:root {
  --zemin: #0a0a0b; --metin: #f4f4f5; --soluk: #a1a1aa; --koyu-soluk: #71717a; --kirmizi: #e31e24; --kirmizi2: #ff4046;
  --gri: #c8c8c8; --cizgi: rgba(255,255,255,.09); --wa: #25d366;
  --baslik: "Montserrat", "Segoe UI", system-ui, sans-serif; --govde: "Inter", "Segoe UI", system-ui, sans-serif;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: var(--govde); background: var(--zemin); color: var(--metin); -webkit-font-smoothing: antialiased; }
a { color: inherit; }

/* ── Ana sayfa: tek ekrana kilitli; kaydırma ve yakınlaştırma yok ── */
html:has(body.ana) { height: 100%; overflow: hidden; overscroll-behavior: none; }
body.ana { position: fixed; inset: 0; height: 100dvh; overflow: hidden; overscroll-behavior: none; touch-action: none;
           user-select: none; -webkit-user-select: none; -webkit-tap-highlight-color: transparent; }
body.ana a { touch-action: manipulation; }
#dunya { position: fixed; inset: 0; width: 100%; height: 100%; z-index: 0; }
.vinyet { position: fixed; inset: 0; z-index: 1; pointer-events: none;
          background: radial-gradient(ellipse at 50% 46%, rgba(10,10,11,0) 0%, rgba(10,10,11,.5) 55%, var(--zemin) 98%); }
.uygulama { position: relative; z-index: 2; height: 100dvh; display: grid; grid-template-rows: auto 1fr auto;
            padding: calc(env(safe-area-inset-top) + clamp(14px, 3vh, 32px)) 20px calc(env(safe-area-inset-bottom) + clamp(10px, 2vh, 22px)); }

/* Üst şerit */
.bas { display: flex; flex-direction: column; align-items: center; gap: 10px; }
.marka { display: flex; flex-direction: column; align-items: center; gap: 8px; text-decoration: none; }
.logo { width: clamp(60px, 10vh, 110px); height: auto; filter: drop-shadow(0 10px 36px rgba(227,30,36,.45)); animation: belir .9s ease both; }
.marka-ad { display: flex; flex-direction: column; align-items: center; line-height: 1.05; }
.marka-ad b { font-family: var(--baslik); font-weight: 800; font-size: 17px; letter-spacing: .04em; text-transform: uppercase; }
.marka-ad small { font-family: var(--govde); font-weight: 500; font-size: 11px; letter-spacing: .38em; text-transform: uppercase; color: var(--gri); margin-top: 3px; }
.rozet { display: none; }

/* Orta */
.orta { display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; min-height: 0; }
.ust { font-size: 11px; font-weight: 600; letter-spacing: .26em; text-transform: uppercase; color: var(--kirmizi2); animation: belir .9s .1s ease both; }
h1 { margin-top: clamp(10px, 1.8vh, 18px); font-family: var(--baslik); font-weight: 800; font-size: clamp(28px, min(8.4vw, 6.2vh), 74px);
     line-height: 1.08; letter-spacing: -.02em; animation: belir .9s .2s ease both; }
.donen { position: relative; display: block; height: 1.18em; overflow: hidden; margin-top: .08em; }
.kelime { position: absolute; left: 0; right: 0; display: block; white-space: nowrap;
          background: linear-gradient(90deg, var(--kirmizi), var(--kirmizi2) 50%, var(--kirmizi)); background-size: 200% 100%;
          -webkit-background-clip: text; background-clip: text; color: transparent; animation: parilti 5s linear infinite; }
.kelime.gir { animation: gir .6s cubic-bezier(.2,.8,.2,1) both, parilti 5s linear infinite; }
.kelime.cik { animation: cik .6s cubic-bezier(.4,0,.2,1) both; }
.alt { margin-top: clamp(10px, 1.8vh, 18px); max-width: 44ch; color: var(--soluk); font-size: clamp(13.5px, 1.8vh, 17px); line-height: 1.6;
       animation: belir .9s .3s ease both; }

/* WhatsApp: tek birincil eylem */
.wa { margin-top: clamp(16px, 3.2vh, 34px); display: inline-flex; align-items: center; gap: 14px; text-decoration: none; text-align: left;
      background: var(--wa); color: #fff; padding: clamp(11px, 1.7vh, 15px) 26px clamp(11px, 1.7vh, 15px) 18px; border-radius: 16px;
      box-shadow: 0 14px 44px rgba(37,211,102,.32), inset 0 1px 0 rgba(255,255,255,.25); transition: transform .2s ease, box-shadow .2s ease;
      animation: belir .9s .4s ease both; position: relative; }
.wa::after { content: ""; position: absolute; inset: -4px; border-radius: 20px; border: 2px solid rgba(37,211,102,.45); animation: nabiz 2.4s ease-out infinite; }
.wa:hover { transform: translateY(-2px); box-shadow: 0 18px 52px rgba(37,211,102,.45), inset 0 1px 0 rgba(255,255,255,.25); }
.wa:active { transform: scale(.98); }
.wa svg { width: 30px; height: 30px; flex: none; }
.wa b { display: block; font-family: var(--baslik); font-weight: 600; font-size: clamp(15px, 2vh, 17px); }
.wa small { display: block; font-size: 13px; opacity: .92; }

/* Sosyal medya: WhatsApp'ın altında, marka renkleriyle */
.sosyal { margin-top: clamp(12px, 2.2vh, 20px); display: flex; gap: 10px; animation: belir .9s .5s ease both; }
.sosyal a { height: 42px; min-width: 42px; padding: 0 12px; border-radius: 12px; display: inline-flex; align-items: center; justify-content: center; gap: 8px;
            color: #fff; text-decoration: none; font-size: 13px; font-weight: 600; transition: transform .2s ease, filter .2s ease; }
.sosyal a span { display: none; }
.sosyal svg { width: 19px; height: 19px; flex: none; }
.sosyal a:hover { transform: translateY(-2px); filter: brightness(1.08); }
.sosyal .ig { background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fdf497 5%, #fd5949 45%, #d6249f 60%, #285aeb 90%); }
.sosyal .fb { background: #0866ff; }
.sosyal .tt { background: #010101; box-shadow: -2px -2px 0 #25f4ee inset, 2px 2px 0 #fe2c55 inset; }

/* Alt bilgi */
.dip { display: flex; flex-direction: column; align-items: center; gap: 8px; text-align: center; }
.iletisim { font-style: normal; display: flex; flex-wrap: wrap; justify-content: center; gap: 2px 18px; color: var(--soluk); font-size: 13px; }
.iletisim a { text-decoration: none; color: var(--metin); }
.iletisim a:hover { color: var(--kirmizi2); }
.yasal-satir { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 16px; color: var(--koyu-soluk); font-size: 12px; }
.yasal-satir a { text-decoration: none; color: var(--soluk); }
.yasal-satir a:hover { color: var(--metin); }

/* Mobil */
@media (max-width: 599px) {
  .iletisim { flex-direction: column; }
  .wa { width: 100%; max-width: 340px; justify-content: center; }
}
/* Tablet */
@media (min-width: 600px) and (max-width: 1023px) {
  .uygulama { padding-left: 44px; padding-right: 44px; }
  .sosyal a span { display: inline; }
}
/* Masaüstü: iki sütun — solda içerik, sağda dünya; üst ve alt şerit kenara yaslı */
@media (min-width: 1024px) {
  .uygulama { padding: 32px clamp(48px, 6vw, 96px) 24px; }
  .bas { flex-direction: row; justify-content: space-between; align-items: center; }
  .marka { flex-direction: row; gap: 14px; }
  .logo { width: 58px; }
  .marka-ad { align-items: flex-start; }
  .marka-ad b { font-size: 18px; }
  .rozet { display: inline-flex; align-items: center; gap: 10px; font-size: 12px; font-weight: 500; letter-spacing: .08em; text-transform: uppercase;
           color: var(--gri); border: 1px solid var(--cizgi); border-radius: 999px; padding: 9px 16px; background: rgba(255,255,255,.03); backdrop-filter: blur(6px); }
  .rozet i { width: 8px; height: 8px; border-radius: 50%; background: var(--kirmizi); animation: nokta 1.8s ease-out infinite; }
  .orta { align-items: flex-start; text-align: left; max-width: min(54vw, 780px); }
  h1 .satir { white-space: nowrap; }
  .ust { font-size: 12px; }
  h1 { font-size: clamp(44px, min(4.6vw, 7.4vh), 78px); }
  .alt { font-size: 17px; max-width: 46ch; }
  .wa { margin-top: 34px; padding: 15px 28px 15px 20px; }
  .sosyal { margin-top: 18px; }
  .sosyal a { height: 40px; padding: 0 14px 0 12px; }
  .sosyal a span { display: inline; }
  .dip { flex-direction: row; justify-content: space-between; align-items: center; border-top: 1px solid var(--cizgi); padding-top: 16px; }
  .iletisim { justify-content: flex-start; gap: 6px 26px; }
  .vinyet { background: radial-gradient(ellipse at 70% 52%, rgba(10,10,11,0) 0%, rgba(10,10,11,.35) 45%, var(--zemin) 92%),
                        linear-gradient(90deg, rgba(10,10,11,.85) 0%, rgba(10,10,11,.4) 40%, rgba(10,10,11,0) 60%); }
}
/* Alçak ekran (yatay telefon) */
@media (max-height: 520px) {
  .ust, .alt, .marka-ad { display: none; }
  .logo { width: 48px; }
  .wa { margin-top: 10px; }
  .sosyal { margin-top: 8px; }
  .dip { flex-direction: row; flex-wrap: wrap; justify-content: center; gap: 6px 18px; }
  .iletisim { flex-direction: row; }
}

@keyframes belir { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@keyframes parilti { to { background-position: -200% 0; } }
@keyframes nabiz { 0% { opacity: .9; transform: scale(1); } 100% { opacity: 0; transform: scale(1.12); } }
@keyframes nokta { 0% { box-shadow: 0 0 0 0 rgba(227,30,36,.6); } 100% { box-shadow: 0 0 0 10px rgba(227,30,36,0); } }
@keyframes gir { from { opacity: 0; transform: translateY(60%); filter: blur(4px); } to { opacity: 1; transform: none; filter: none; } }
@keyframes cik { from { opacity: 1; transform: none; } to { opacity: 0; transform: translateY(-60%); filter: blur(4px); } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; } }

/* ── Yasal sayfalar: sözleşme düzeni — ana sayfayla aynı siyah zemin, küçük ve iki yana yaslı metin ── */
body.yasal { background: var(--zemin); color: #d4d4d8; }
.yasal-ust { position: sticky; top: 0; z-index: 2; display: flex; align-items: center; justify-content: space-between; gap: 12px;
             padding: 14px max(20px, calc((100% - 860px) / 2)); background: rgba(10,10,11,.92); backdrop-filter: blur(8px);
             border-bottom: 1px solid var(--cizgi); color: var(--metin); }
.yasal-ust a.marka { flex-direction: row; gap: 10px; font-family: var(--baslik); font-weight: 800; font-size: 14px; letter-spacing: .03em; text-transform: uppercase; }
.yasal-ust img { width: 34px; height: auto; }
.yasal-ust a.geri { color: var(--soluk); font-size: 12px; text-decoration: none; }
.yasal-ust a.geri:hover { color: var(--kirmizi2); }
article.metin { max-width: 860px; margin: 28px auto 56px; background: rgba(255,255,255,.025); border: 1px solid var(--cizgi); border-radius: 8px;
                padding: clamp(22px, 5vw, 56px) clamp(18px, 6vw, 64px); font-size: 11.5px; line-height: 1.7; color: #c4c4cc; }
article.metin h1 { font-family: var(--baslik); font-size: 18px; font-weight: 800; color: var(--metin); letter-spacing: -.01em; margin: 0 0 6px; animation: none; }
article.metin .belge-alt { font-size: 10.5px; color: var(--koyu-soluk); margin-bottom: 20px; padding-bottom: 14px; border-bottom: 2px solid var(--kirmizi); }
article.metin h2 { font-family: var(--govde); font-size: 11.5px; font-weight: 600; color: var(--metin); margin: 18px 0 5px; }
article.metin p { margin: 0 0 7px; text-align: justify; hyphens: auto; overflow-wrap: anywhere; }
@media (max-width: 599px) { article.metin { margin: 0; border-radius: 0; border-left: 0; border-right: 0; } article.metin p { text-align: left; } }