.download-page { min-height: 100vh; background: radial-gradient(900px 520px at 8% 0, rgba(34,211,168,.18), transparent 58%), radial-gradient(760px 520px at 92% 10%, rgba(110,203,255,.14), transparent 60%), #07131d; }
.download-nav { position: relative; z-index: 20; max-width: 1240px; height: 88px; margin: 0 auto; padding: 0 24px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid rgba(255,255,255,.08); }
.back-home { display: inline-flex; align-items: center; gap: 10px; color: #b7c6cf; font-size: 13px; font-weight: 700; transition: .2s ease; }
.back-home span { width: 32px; height: 32px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.12); border-radius: 50%; }
.back-home:hover { color: var(--mint-soft); }
.download-main { position: relative; overflow: hidden; }
.download-hero { min-height: 680px; max-width: 1240px; margin: 0 auto; padding: 68px 24px 88px; display: grid; grid-template-columns: minmax(0,.92fr) minmax(460px,1.08fr); align-items: center; gap: 54px; }
.mobile-badge { display: inline-flex; align-items: center; gap: 10px; padding: 8px 14px; border: 1px solid rgba(34,211,168,.25); border-radius: 999px; color: var(--mint-soft); background: rgba(34,211,168,.08); font-size: 11px; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.mobile-badge i { width: 7px; height: 7px; border-radius: 50%; background: var(--mint); box-shadow: 0 0 0 5px rgba(34,211,168,.15); }
.download-copy h1 { margin: 24px 0 22px; font: 700 clamp(48px,5.6vw,78px)/1.01 'Instrument Sans',sans-serif; letter-spacing: -.055em; }
.download-copy h1 em { font-style: normal; background: linear-gradient(135deg,var(--mint-soft),var(--sky)); background-clip: text; -webkit-background-clip: text; color: transparent; }
.download-copy>p { max-width: 590px; margin: 0; color: #b4c4cd; font-size: 18px; line-height: 1.75; }
.download-trust { display: flex; flex-wrap: wrap; gap: 20px; margin-top: 34px; color: #9eb0ba; font-size: 13px; font-weight: 600; }
.download-trust span { display: inline-flex; align-items: center; gap: 8px; }
.download-trust svg { width: 19px; height: 19px; fill: none; stroke: var(--mint); stroke-width: 1.8; }
.phone-stage { position: relative; min-height: 540px; display: grid; place-items: center; }
.phone-stage .orbit { position: absolute; border: 1px solid rgba(34,211,168,.14); border-radius: 50%; }
.phone-stage .orbit-one { width: 470px; height: 470px; }
.phone-stage .orbit-two { width: 380px; height: 380px; border-style: dashed; animation: download-spin 34s linear infinite; }
@keyframes download-spin { to { transform: rotate(360deg); } }
.phone { position: relative; z-index: 3; width: 278px; height: 546px; padding: 9px; border: 1px solid rgba(255,255,255,.23); border-radius: 42px; background: linear-gradient(145deg,#1a3445,#05101a); box-shadow: 0 38px 90px rgba(0,0,0,.52), inset 0 0 0 2px rgba(255,255,255,.04); transform: rotate(3deg); }
.phone-speaker { position: absolute; z-index: 5; top: 18px; left: 50%; width: 78px; height: 18px; transform: translateX(-50%); border-radius: 99px; background: #07131d; }
.phone-screen { height: 100%; overflow: hidden; padding: 31px 19px 20px; border-radius: 34px; color: #071326; background: radial-gradient(circle at 90% 8%,#d8e8ff,transparent 38%),#f6f9fc; }
.phone-top { display: flex; justify-content: space-between; align-items: center; }
.mini-logo { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 16px; color: #fff; background: linear-gradient(145deg,#3479f5,#2453dc); font: 800 24px 'Instrument Sans',sans-serif; box-shadow: 0 12px 25px rgba(36,83,220,.24); }
.phone-top>span { padding: 8px 12px; border-radius: 99px; color: #4338a4; background: #ebebff; font-size: 11px; font-weight: 800; }
.phone-content { margin-top: 86px; }
.phone-content small { color: #2563eb; font-size: 9px; font-weight: 900; letter-spacing: .13em; }
.phone-content h2 { margin: 12px 0 13px; font: 800 34px/1.04 'Instrument Sans',sans-serif; letter-spacing: -.055em; }
.phone-content p { color: #697a92; font-size: 12px; line-height: 1.55; }
.phone-actions { display: grid; gap: 11px; margin-top: 33px; }
.phone-actions>b { min-height: 53px; display: flex; align-items: center; justify-content: center; gap: 8px; border-radius: 16px; color: #fff; background: linear-gradient(145deg,#3479f5,#2453dc); font-size: 14px; }
.phone-actions>b svg { width: 18px; fill: currentColor; }
.phone-actions>span { min-height: 62px; display: flex; align-items: center; gap: 13px; padding: 10px 14px; border: 1px solid #dce4ee; border-radius: 16px; background: #fff; }
.phone-actions>span>i { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 10px; color: #098b58; background: #d9fbe8; font-size: 11px; font-style: normal; }
.phone-actions strong { font-size: 13px; }.phone-actions strong small { display: block; margin-top: 3px; color: #7c8ba0; font-size: 9px; font-weight: 600; }
.floating-note { position: absolute; z-index: 4; display: flex; align-items: center; gap: 10px; padding: 13px 16px; border: 1px solid rgba(255,255,255,.12); border-radius: 15px; background: rgba(13,35,49,.86); backdrop-filter: blur(16px); box-shadow: 0 20px 45px rgba(0,0,0,.25); }
.floating-note>b,.floating-note span b { display: block; font-size: 11px; }.floating-note small { display: block; margin-top: 3px; color: #8298a4; font-size: 9px; }
.note-secure { left: 0; top: 18%; }.note-secure>i { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 10px; color: #07131d; background: var(--mint); font-style: normal; font-weight: 900; }
.note-ready { right: -2%; bottom: 20%; }.note-ready>i { width: 9px; height: 9px; border-radius: 50%; background: var(--mint); box-shadow: 0 0 0 6px rgba(34,211,168,.14); }
.platform-section { padding: 94px max(24px,calc((100vw - 1192px)/2)); border-top: 1px solid rgba(255,255,255,.07); background: linear-gradient(180deg,rgba(255,255,255,.02),transparent); }
.platform-heading { display: grid; grid-template-columns: .7fr 1.1fr 1fr; align-items: end; gap: 40px; margin-bottom: 44px; }
.platform-heading>span { color: var(--mint); font-size: 11px; font-weight: 900; letter-spacing: .15em; }
.platform-heading h2 { margin: 0; font: 700 clamp(36px,4vw,55px)/1.03 'Instrument Sans',sans-serif; letter-spacing: -.045em; }
.platform-heading p { margin: 0; color: #92a5af; font-size: 14px; line-height: 1.7; }
.platform-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; }
.store-card { position: relative; min-height: 330px; padding: 28px; overflow: hidden; border: 1px solid rgba(255,255,255,.1); border-radius: 22px; background: linear-gradient(145deg,rgba(255,255,255,.075),rgba(255,255,255,.025)); box-shadow: 0 25px 55px rgba(0,0,0,.16); }
.store-card:before { content: ''; position: absolute; width: 180px; height: 180px; right: -80px; top: -80px; border-radius: 50%; background: rgba(110,203,255,.08); filter: blur(8px); }
.store-icon { position: relative; width: 58px; height: 58px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.1); border-radius: 17px; color: #fff; background: rgba(255,255,255,.07); }
.store-icon svg { width: 30px; height: 30px; fill: currentColor; stroke: currentColor; stroke-width: 1.5; }
.store-icon.android { color: #9ef5df; background: rgba(34,211,168,.11); }.store-icon.android svg { fill: none; }
.store-icon.play { color: #8bd5ff; }.store-name { margin: 24px 0 21px; }.store-name small { display: block; margin-bottom: 5px; color: #8fa2ad; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; }.store-name strong { font: 700 24px 'Instrument Sans',sans-serif; letter-spacing: -.025em; }
.store-card button,.apk-download { width: 100%; min-height: 52px; display: flex; align-items: center; justify-content: center; gap: 12px; border: 0; border-radius: 14px; font-size: 13px; font-weight: 800; }
.store-card button:disabled { cursor: not-allowed; color: #748994; background: rgba(255,255,255,.06); box-shadow: inset 0 0 0 1px rgba(255,255,255,.06); }
.store-card>p { margin: 17px 0 0; color: #7f939e; font-size: 12px; line-height: 1.55; }
.apk-card { border-color: rgba(34,211,168,.28); background: linear-gradient(145deg,rgba(34,211,168,.12),rgba(255,255,255,.03)); }.apk-card:after { content: 'ŞİMDİ İNDİR'; position: absolute; top: 22px; right: -39px; width: 150px; padding: 6px 0; transform: rotate(38deg); color: #061018; background: var(--mint); text-align: center; font-size: 8px; font-weight: 900; letter-spacing: .12em; }.apk-download { color: #061018; background: linear-gradient(135deg,var(--mint),#12b88f); box-shadow: 0 15px 30px rgba(34,211,168,.18); transition: .2s ease; }.apk-download:hover { transform: translateY(-2px); box-shadow: 0 20px 38px rgba(34,211,168,.25); }.apk-download span { font-size: 18px; }
.testflight-panel { position: relative; margin-top: 24px; padding: 34px; overflow: hidden; border: 1px solid rgba(71,164,255,.28); border-radius: 24px; background: radial-gradient(circle at 92% 5%,rgba(74,163,255,.18),transparent 38%),linear-gradient(145deg,rgba(31,105,190,.16),rgba(255,255,255,.035)); box-shadow: 0 25px 60px rgba(0,0,0,.18); }
.testflight-panel:before { content: ''; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(115deg,rgba(255,255,255,.05),transparent 35%); }
.testflight-intro { position: relative; display: grid; grid-template-columns: 68px minmax(0,1fr); align-items: start; gap: 20px; }
.testflight-icon { width: 68px; height: 68px; display: grid; place-items: center; border: 1px solid rgba(125,197,255,.3); border-radius: 20px; color: #a9ddff; background: linear-gradient(145deg,rgba(33,150,243,.28),rgba(35,83,178,.16)); box-shadow: 0 15px 35px rgba(23,108,201,.18); }
.testflight-icon svg { width: 38px; height: 38px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.testflight-intro span { color: #78c7ff; font-size: 10px; font-weight: 900; letter-spacing: .16em; }
.testflight-intro h2 { margin: 7px 0 9px; font: 700 clamp(26px,3vw,38px)/1.08 'Instrument Sans',sans-serif; letter-spacing: -.035em; }
.testflight-intro p { max-width: 780px; margin: 0; color: #9eb2bf; font-size: 13px; line-height: 1.65; }
.testflight-steps { position: relative; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; margin: 28px 0 20px; padding: 0; list-style: none; }
.testflight-steps li { min-width: 0; display: flex; align-items: flex-start; gap: 12px; padding: 16px; border: 1px solid rgba(255,255,255,.08); border-radius: 16px; background: rgba(5,20,32,.42); }
.testflight-steps li>b { width: 30px; height: 30px; flex: 0 0 30px; display: grid; place-items: center; border-radius: 10px; color: #07131d; background: #87d1ff; font-size: 12px; }
.testflight-steps strong,.testflight-steps small { display: block; }
.testflight-steps strong { font-size: 12px; }
.testflight-steps small { margin-top: 5px; color: #8399a6; font-size: 10px; line-height: 1.5; }
.testflight-download { position: relative; min-height: 54px; display: inline-flex; align-items: center; justify-content: center; gap: 12px; padding: 0 22px; border-radius: 15px; color: #061018; background: linear-gradient(135deg,#8bd7ff,#4fa8ff); box-shadow: 0 16px 34px rgba(41,139,235,.22); font-size: 13px; font-weight: 900; transition: transform .2s ease,box-shadow .2s ease; }
.testflight-download:hover { transform: translateY(-2px); box-shadow: 0 21px 40px rgba(41,139,235,.3); }
.testflight-download b { font-size: 18px; }
.install-note { max-width: 1192px; margin: 0 auto 90px; padding: 22px 25px; display: flex; align-items: flex-start; gap: 16px; border: 1px solid rgba(110,203,255,.15); border-radius: 18px; background: rgba(110,203,255,.05); }.install-icon { flex: 0 0 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; color: #07131d; background: var(--sky); font: 900 16px serif; }.install-note strong { font-size: 13px; }.install-note p { margin: 6px 0 0; color: #8fa3ae; font-size: 12px; line-height: 1.6; }
.download-footer { max-width: 1192px; }
@media(max-width:1000px){.download-hero{grid-template-columns:1fr;text-align:center}.download-copy>p{margin-left:auto;margin-right:auto}.download-trust{justify-content:center}.phone-stage{margin-top:20px}.platform-heading{grid-template-columns:1fr;text-align:center}.platform-grid{grid-template-columns:1fr}.store-card{min-height:auto}.platform-heading>span{margin-bottom:-20px}.testflight-steps{grid-template-columns:1fr}.testflight-download{width:100%}}
@media(max-width:650px){.download-nav{height:72px;padding:0 20px}.back-home{font-size:0}.back-home span{font-size:15px}.download-hero{padding:48px 20px 70px}.download-copy h1{font-size:47px}.download-copy>p{font-size:15px}.phone-stage{min-height:500px;transform:scale(.9);margin:-5px -20px -25px}.floating-note{display:none}.phone-stage .orbit-one{width:360px;height:360px}.phone-stage .orbit-two{width:310px;height:310px}.platform-section{padding:70px 20px}.platform-heading{gap:28px}.platform-heading>span{margin-bottom:-12px}.testflight-panel{padding:24px 18px;border-radius:20px}.testflight-intro{grid-template-columns:1fr;text-align:center}.testflight-icon{margin:0 auto}.testflight-intro h2{font-size:27px}.testflight-steps li{text-align:left}.install-note{margin:0 20px 70px}.download-footer{padding-left:20px;padding-right:20px}}
@media(prefers-reduced-motion:reduce){.phone-stage .orbit-two{animation:none}}