/* TANITIM SAYFASI (D4, 2026-09-07). Uygulamanin tokenlari ve fontlari (BRAND.md Bolum 10, style.css :root),
   uygulama bilesenleri DEGIL: burada ust bant, alt gezinme, halka yok. Whoop pazarlama sayfasi duzeni:
   koyu gradyan zemin, buyuk sikistirilmis buyuk harf baslik, telefon gorseli, bol bosluk, tek vurgu rengi.
   Amber yalniz siradaki eylemde (birincil dugme, liste isareti). Dekoratif hareket yok. */
@font-face{font-family:Manrope;font-style:normal;font-weight:400 800;font-display:swap;src:url(font/manrope.woff2) format("woff2")}
@font-face{font-family:"Barlow Condensed";font-style:normal;font-weight:700;font-display:swap;src:url(font/barlow-condensed-700.woff2) format("woff2")}
:root{
  --gece:#0A121A;--gece-ust:#1B2A35;--kort:#15222D;--kort-ac:#1E2F3C;--cizgi:#253A49;
  --isik:#F1F6F9;--soluk:#7C93A5;--top:#FFB627;--hali:#2BB673;--flood:#6E8CA8;
  --dolu:rgba(241,246,249,.10);--dolu-basili:rgba(241,246,249,.18);
  --kose:16px;--kose-dugme:12px;--sure-hizli:120ms;--egri:cubic-bezier(.2,.7,.2,1);
  --genis:1120px;--kenar:20px;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;overflow-x:hidden}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body.tanitim{margin:0;color:var(--isik);overflow-x:hidden;
  background-color:var(--gece);
  background-image:
    radial-gradient(70% 34% at 100% 0%,rgba(139,181,255,.11),rgba(139,181,255,0) 62%),
    radial-gradient(60% 30% at 0% 16%,rgba(255,182,39,.07),rgba(255,182,39,0) 60%),
    linear-gradient(180deg,var(--gece-ust) 0,var(--gece) 720px);
  background-repeat:no-repeat;
  font:400 17px/1.55 Manrope,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%;height:auto}
h1,h2,h3{margin:0}
main>section,.ust,.alt-bilgi{max-width:var(--genis);margin:0 auto;padding-left:var(--kenar);padding-right:var(--kenar)}

/* ---- tipografi. Baslik: Barlow Condensed 700 buyuk harf (sayilarin ve ust bandin ailesi). Metin: Manrope. */
h1,h2,.serit b,.adimlar b{font-family:"Barlow Condensed",Manrope,sans-serif;font-weight:700;text-transform:uppercase;letter-spacing:.005em}
h1{font-size:clamp(64px,14vw,132px);line-height:.9}
h2{font-size:clamp(40px,7vw,72px);line-height:.95}
h3{font-size:22px;font-weight:700;line-height:1.25;margin-bottom:8px}
.etiket{font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--soluk);margin:0 0 14px}
.alt{font-size:19px;line-height:1.5;color:rgba(241,246,249,.82);max-width:34ch;margin:22px 0 0}
.not{font-size:13px;color:var(--soluk);margin:14px 0 0;line-height:1.5}
.not a{color:var(--isik);text-decoration:underline;text-underline-offset:3px}
p{margin:0 0 12px}

/* ---- dugme (BRAND 10.2): dolu gri varsayilan, amber birincil, BUYUK HARF %9 aralik, basinca %3 kucuk */
.dugme{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 20px;
  border-radius:var(--kose-dugme);font-size:13px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;
  background:var(--dolu);color:var(--isik);transition:transform var(--sure-hizli) var(--egri),background var(--sure-hizli)}
.dugme:active{transform:scale(.97)}
.dugme-gri:hover{background:var(--dolu-basili)}
.dugme-amber{background:var(--top);color:#0A121A}
.dugme-amber:hover{background:#FFC24A}
.dugme.kucuk{min-height:38px;padding:0 14px;font-size:12px}
.dugme.pasif{opacity:.55;cursor:default}
.dugme-cift{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px}

/* ---- ust bant */
.ust{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-top:18px;padding-bottom:18px}
.ust .logo img{height:16px;width:auto}
.menu{display:none;gap:26px;font-size:14px;font-weight:600;color:rgba(241,246,249,.78)}
.menu a:hover{color:var(--isik)}
@media (min-width:760px){.menu{display:flex}}

/* ---- telefon cercevesi. Ekran goruntusu 430x932 CSS px (iPhone 16 Pro Max), 2x. Golge yok: isik zemindeki
   radyal parlama ile (BRAND: golge yok, isik anlam tasir; burada zemin tonu). */
.tel{position:relative;width:min(320px,80vw);aspect-ratio:430/932;padding:10px;border-radius:52px;
  background:#0B1117;box-shadow:inset 0 0 0 1px rgba(241,246,249,.14),0 0 0 1px rgba(0,0,0,.6)}
.tel img{width:100%;height:100%;object-fit:cover;object-position:top;border-radius:42px}
.tel::after{content:"";position:absolute;left:50%;top:22px;width:112px;height:32px;margin-left:-56px;border-radius:20px;background:#0B1117}
.tel.kucuk{width:min(280px,72vw);border-radius:46px}
.tel.kucuk img{border-radius:37px}
.tel.kucuk::after{width:98px;height:28px;margin-left:-49px;top:20px}

/* ---- hero */
.hero{display:grid;gap:40px;padding-top:36px;padding-bottom:56px;align-items:center}
.hero-tel{position:relative;display:flex;justify-content:center}
.hero-tel::before{content:"";position:absolute;inset:-10% -20%;z-index:-1;border-radius:50%;
  background:radial-gradient(45% 45% at 50% 40%,rgba(255,182,39,.16),rgba(255,182,39,0) 70%),
             radial-gradient(40% 40% at 70% 70%,rgba(139,181,255,.14),rgba(139,181,255,0) 70%)}
@media (min-width:900px){
  .hero{grid-template-columns:1.1fr .9fr;gap:24px;padding-top:56px;padding-bottom:72px}
  .hero-tel{justify-content:flex-end;padding-right:24px}
  .tel{width:340px}
}

/* ---- uc kural seridi: Barlow sayi + kisa cumle (Whoop sayi seridi) */
.serit{display:grid;gap:14px;padding-top:8px;padding-bottom:56px}
.serit>div{background:var(--kort);border-radius:var(--kose);padding:20px 20px 18px}
.serit b{display:block;font-size:44px;line-height:1;color:var(--isik)}
.serit b small{font-size:16px;letter-spacing:.08em;margin-left:6px;color:var(--soluk)}
.serit span{display:block;margin-top:8px;font-size:14px;line-height:1.45;color:rgba(241,246,249,.78)}
@media (min-width:760px){.serit{grid-template-columns:repeat(3,1fr)}}

/* ---- ozellik kartlari: BUYUK HARF etiket ust satirda (kartin icinde), ekran alta gomulu */
.ozellikler{padding-top:32px;padding-bottom:64px}
.ozellikler h2,.nasil h2{margin-bottom:28px}
.kartlar{display:grid;gap:14px}
.kart{background:var(--kort);border-radius:var(--kose);padding:22px 22px 0;overflow:hidden;display:flex;flex-direction:column}
.kart p{color:rgba(241,246,249,.78);font-size:15px}
.kart .ekran{margin:18px -4px 0;padding:8px 8px 0;border-radius:36px 36px 0 0;background:#0B1117;box-shadow:inset 0 0 0 1px rgba(241,246,249,.12);flex:1}
.kart .ekran img{border-radius:28px 28px 0 0;width:100%;height:auto;max-height:420px;object-fit:cover;object-position:top}
@media (min-width:760px){.kartlar{grid-template-columns:repeat(3,1fr)}.kart .ekran img{max-height:none;aspect-ratio:430/560}}

/* ---- bildirim ve iOS bolumleri: metin + telefon yan yana */
.bildirim,.ios{display:grid;gap:36px;align-items:center;padding-top:32px;padding-bottom:64px}
.bildirim .tel,.ios .tel{justify-self:center}
.liste{list-style:none;margin:22px 0 0;padding:0;display:grid;gap:10px}
.liste li{position:relative;padding-left:22px;font-size:18px;font-weight:600}
.liste li::before{content:"";position:absolute;left:0;top:11px;width:8px;height:8px;border-radius:50%;background:var(--top)}
.ios .dugme{margin-top:22px}
@media (min-width:900px){
  .bildirim{grid-template-columns:.9fr 1.1fr;gap:48px}
  .ios{grid-template-columns:1.1fr .9fr;gap:48px}
  .bildirim .tel{justify-self:end}
  .ios .tel{justify-self:start}
}

/* ---- nasil isler: Barlow sira numarasi */
.nasil{padding-top:24px;padding-bottom:64px}
.adimlar{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.adimlar li{background:var(--kort);border-radius:var(--kose);padding:22px}
.adimlar b{display:block;font-size:44px;line-height:1;color:var(--top);margin-bottom:12px}
.adimlar p{color:rgba(241,246,249,.78);font-size:15px;margin:0}
@media (min-width:760px){.adimlar{grid-template-columns:repeat(3,1fr)}}

/* ---- alt bilgi */
.alt-bilgi{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;
  padding-top:28px;padding-bottom:calc(36px + env(safe-area-inset-bottom));border-top:1px solid var(--cizgi);color:var(--soluk);font-size:13px}
.alt-bilgi img{height:12px;width:auto;opacity:.8}
.alt-bilgi nav{display:flex;gap:20px;font-weight:600;color:rgba(241,246,249,.78)}
.alt-bilgi p{margin:0}
