/* "İşletmeniz için Reklam" (reklam.html; işaretleme tools/yama/reklam-sayfa.html, üretim tools/yama/reklam_sayfa.py, çizim oynatıcısı assets/reklam-kart.js).
   Sitenin koyu dili: siyah zemin, beyaz yazı, Turan mavisi vurgu; başlığın sonu Instrument Serif italik. Dört hizmet kartı: Google Arama (Turan
   mavisinin parlağı) ve Instagram ve Meta (pembe) yan yana, altında iki geniş kart: "Markanıza özel animasyonlu reklam videoları" (mor, çizim solda) ve
   "Markanıza özel video çekimi, içerik üretimi ve sosyal medya yönetimi" (amber, çizim sağda: iki geniş kart aynalı durur). Kartlarda
   canlı çizgi çizimi, ad, tek cümle, (yönetimde) kurulum, kapsam, bütçe notu ve tek eylem "Görüşelim" (WhatsApp). HİÇBİR TUTAR YOK
   (Yusuf, 15.10.2026). Altında "hepsini birlikte" satırı ve bütçenin yolu: iki satır, her biri soldan sağa çizilen bir hat ve ucunda nokta
   (menü düğmesindeki çizgi → nokta). Hareket amaçlıdır ve bir kez oynar: çizim ekrana girince (reklam-kart.js .oyna), fareyle kartın üzerine
   gelince yeniden. Varsayılan kurallar son hâldir: betik yoksa (html.js-yok) ve hareketi azaltta çizimler bitmiş durur. Bekleyen hâl animasyonun
   ilk karesidir (duraklatılmış). */

.rs-sayfa { --rs-cizgi: #1D2730; --rs-kart: #0A1116; --rs-soluk: #8D9AA6; --rs-metin: #A6B2BC; --g: #19B4EE; --m: #FF5FA2; --v: #A98BFF; --s: #FFB02E; }
.katalog-sayfa.rs-sayfa { width: min(1320px, 90%); padding-top: 140px; }
.rs-sayfa a:focus-visible { outline: 2px solid var(--turan); outline-offset: 3px; }

/* ---------- giriş ---------- */
.rs-giris { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 34ch); align-items: end; gap: 20px clamp(36px, 5vw, 96px);
  padding: clamp(6px, 1.2vw, 20px) 0 clamp(30px, 3.4vw, 50px); scroll-margin-top: 110px; }
.rs-baslik { margin: 0; font: 600 clamp(46px, 6.6vw, 104px)/.9 'Archivo', sans-serif; font-stretch: 86%; letter-spacing: -.05em; color: #F5F8FA; text-wrap: balance; }
.rs-baslik em { font: italic 400 1.14em/.86 'Instrument Serif', Georgia, serif; font-stretch: normal; letter-spacing: -.015em; color: var(--turan-parlak); white-space: nowrap; }
.rs-aciklama { margin: 0 0 .5em; color: var(--rs-metin); font: 400 clamp(16px, 1.25vw, 19px)/1.6 'Archivo', sans-serif; text-wrap: pretty; }

/* ---------- hizmet kartları ---------- */
.rs-hizmetler { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.rs-kart { --r: var(--g); position: relative; display: flex; flex-direction: column; min-width: 0; padding: 10px; scroll-margin-top: 100px;
  border: 1px solid color-mix(in oklch, var(--r) 28%, var(--rs-cizgi)); border-radius: 22px;
  background: radial-gradient(120% 55% at 50% 0%, color-mix(in oklch, var(--r) 11%, transparent), transparent 72%), var(--rs-kart);
  box-shadow: 0 44px 80px -64px color-mix(in oklch, var(--r) 85%, transparent); transition: border-color .35s; }
.rs-kart:has(.rs-kart-cta:focus-visible) { border-color: var(--r); }
.rs-kart-cta:focus-visible { outline: 2px solid var(--r); outline-offset: 3px; }
.rs-kart-cizim { border: 1px solid #141E25; border-radius: 14px; overflow: hidden;
  background: radial-gradient(circle at 1px 1px, #ffffff12 1px, transparent 1.6px) 0 0 / 16px 16px, #070B0E; }
/* geniş kart (video, sosyal medya): çizim bir yanda, metin öbür yanda; sosyal kartı aynalıdır (çizim sağda); dar ekranda öbür kartlar gibi alt alta */
.rs-kart-genis { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); align-items: stretch; column-gap: clamp(8px, 1.4vw, 24px); }
.rs-kart-ters { grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); }
.rs-kart-ters .rs-kart-cizim { order: 2; }
.rs-kart-genis .rs-kart-cizim { display: grid; align-items: center; padding: clamp(10px, 1.6vw, 26px) clamp(8px, 1.2vw, 18px); }
.rs-kart-genis .rs-kart-govde { padding-top: clamp(18px, 2.2vw, 34px); }
.rs-kart-govde { display: flex; flex: 1; flex-direction: column; padding: clamp(18px, 1.8vw, 26px) clamp(12px, 1.4vw, 20px) 8px; }
.rs-sayfa .rs-kart-ad { font: 600 clamp(22px, 1.9vw, 30px)/1.12 'Archivo', sans-serif; letter-spacing: -.035em; color: #F5F8FA; text-wrap: balance; }
.rs-kart-cumle { margin: 8px 0 0; max-width: 46ch; color: #B7C3CC; font-size: 15.5px; line-height: 1.55; text-wrap: pretty; }
/* yönetimin koşulu (kurulum ücretsiz): küçük hap, başında hizmetin rengiyle nokta; tutar yok */
.rs-kosul { display: flex; flex-wrap: wrap; gap: 8px; margin: 18px 0 0; padding: 0; list-style: none; }
.rs-kosul li { display: inline-flex; align-items: center; gap: 8px; padding: 7px 12px 7px 10px; border-radius: 999px; border: 1px solid color-mix(in oklch, var(--r) 30%, var(--rs-cizgi));
  background: color-mix(in oklch, var(--r) 7%, transparent); color: #DCE6EE; font: 550 13.5px/1.1 'Archivo', sans-serif; }
.rs-kosul li::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: var(--r); flex: none; }
.rs-maddeler { display: grid; gap: 9px; margin: clamp(20px, 2vw, 26px) 0 0; padding: 18px 0 0; border-top: 1px solid var(--rs-cizgi); list-style: none; }
.rs-maddeler li { position: relative; padding-left: 26px; color: #CFD9E0; font-size: 14.5px; line-height: 1.45; }
/* madde imi: kısa çizgi ve ucunda nokta (menü düğmesindeki çizgi → nokta) */
.rs-maddeler li::before { content: ''; position: absolute; left: 0; top: .66em; width: 16px; height: 6px;
  background: linear-gradient(color-mix(in oklch, var(--r) 70%, transparent), color-mix(in oklch, var(--r) 70%, transparent)) 0 50% / 10px 1.5px no-repeat,
    radial-gradient(circle, var(--r) 2.4px, transparent 2.9px) 100% 50% / 6px 6px no-repeat; }
.rs-uyari { margin: 18px 0 18px; padding: 11px 14px; border-radius: 12px; background: #ffffff06; color: var(--rs-metin); font-size: 13.5px; line-height: 1.5; text-wrap: pretty; }
.rs-kart-cta { display: flex; align-items: center; gap: 12px; margin-top: auto; padding: 9px 18px 9px 9px; border-radius: 14px;
  border: 1px solid color-mix(in oklch, var(--r) 55%, #2E3B46); background: color-mix(in oklch, var(--r) 16%, #0D151B); color: #F5F8FA;
  font: 600 16px/1.2 'Archivo', sans-serif; text-decoration: none; transition: background-color .25s, border-color .25s, color .25s; }
.rs-kart-cta > span { flex: 1; }
.rs-wa { display: block; width: 38px; height: 38px; flex: none; padding: 8px; border-radius: 10px; fill: currentColor; color: #fff;
  background: #25D366; transition: background-color .25s, color .25s; }
.rs-kart-cta .ok { width: 17px; height: 11px; flex: none; color: color-mix(in oklch, var(--r) 70%, #fff); transition: transform .25s var(--egri); }
@media (hover: hover) and (pointer: fine) {
  .rs-kart:hover { border-color: color-mix(in oklch, var(--r) 55%, var(--rs-cizgi)); }
  .rs-kart-cta:hover { background: var(--r); border-color: var(--r); color: #04121A; } .rs-kart-cta:hover .ok { color: #04121A; transform: translateX(3px); }
  .rs-kart-cta:hover .rs-wa { background: #1EBE5A; color: #fff; }
}

/* ---------- hepsini birlikte (WhatsApp) ---------- */
.rs-hepsi { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px 28px; margin-top: 16px; padding: 18px 20px 18px 24px;
  border: 1px dashed #2A3742; border-radius: 18px; scroll-margin-top: 100px; }
.rs-hepsi p { flex: 1 1 320px; margin: 0; color: var(--rs-metin); font-size: 15.5px; line-height: 1.5; }
.rs-hepsi b { color: #F5F8FA; font-weight: 600; }
/* çift (WhatsApp’ta görüşelim + Bize mail at): ortak.iletisim_cifti, stil assets/iletisim.css (.ic-cift) */
.rs-hepsi-cift { flex: none; }

/* ---------- bütçenin yolu ---------- */
.rs-butce { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); align-items: center; gap: 40px clamp(40px, 6vw, 110px);
  padding: clamp(72px, 8vw, 128px) 0 clamp(64px, 7vw, 110px); scroll-margin-top: 90px; }
.rs-butce-baslik { margin: 0; font: 650 clamp(32px, 3.6vw, 56px)/1.02 'Archivo', sans-serif; letter-spacing: -.035em; color: #F5F8FA; text-wrap: balance; }
.rs-butce-baslik em { font: italic 400 1.1em/.9 'Instrument Serif', Georgia, serif; letter-spacing: -.01em; color: var(--turan-parlak); }
.rs-butce-metin p { max-width: 44ch; margin: 18px 0 0; color: var(--rs-metin); font-size: 16px; line-height: 1.62; text-wrap: pretty; }
.rs-akis { display: grid; gap: 14px; margin: 0; padding: 0; list-style: none; }
.rs-akis-satir { --r: var(--g); display: grid; grid-template-columns: minmax(0, 11rem) minmax(48px, 1fr) minmax(0, 13rem); align-items: center; gap: 18px;
  padding: 20px 22px; border: 1px solid var(--rs-cizgi); border-radius: 18px; background: var(--rs-kart); }
.rs-akis-ucret { --r: var(--turan); }
.rs-akis-satir p { display: grid; gap: 4px; margin: 0; }
.rs-akis-satir b { color: #F5F8FA; font: 600 16.5px/1.2 'Archivo', sans-serif; letter-spacing: -.01em; }
.rs-akis-satir span { color: var(--rs-soluk); font-size: 13.5px; line-height: 1.4; }
.rs-akis-butce .rs-akis-kime b { background: linear-gradient(90deg, var(--g), var(--m)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.rs-akis-hat { position: relative; display: block; height: 10px; }
.rs-akis-hat::before { content: ''; position: absolute; left: 0; right: 5px; top: 50%; height: 1.5px; margin-top: -.75px; border-radius: 1px; transform-origin: left center;
  background: linear-gradient(90deg, color-mix(in oklch, var(--r) 10%, transparent), var(--r)); }
.rs-akis-butce .rs-akis-hat::before { background: linear-gradient(90deg, color-mix(in oklch, var(--g) 10%, transparent), var(--g) 60%, var(--m)); }
.rs-akis-hat i { position: absolute; right: 0; top: 50%; width: 10px; height: 10px; margin-top: -5px; border-radius: 50%; background: var(--r); box-shadow: 0 0 0 4px color-mix(in oklch, var(--r) 18%, transparent); }
.rs-akis-butce .rs-akis-hat i { background: var(--m); box-shadow: 0 0 0 4px color-mix(in oklch, var(--m) 18%, transparent); }

/* ---------- çizimler (süs; aria-hidden). Çizgi dili sihirbazın tuvaliyle aynı (assets/sihirbaz.css → .tv-*) ---------- */
.rc { display: block; width: 100%; height: auto; overflow: visible; }
.rc * { transform-box: view-box; }
.rc-y { font-family: 'Archivo', sans-serif; }
.rc-pencere { fill: #0C1318; stroke: #283540; stroke-width: 1; }
.rc-ayrac { fill: none; stroke: #22303A; stroke-width: 1; }
.rc-tuy { fill: #34424D; } .rc-adres { fill: #16212A; }
.rc-alan { fill: #0F181F; stroke: #2E3D49; stroke-width: 1; }
.rc-ince { fill: none; stroke: #6A7C8B; stroke-width: 1.2; stroke-linecap: round; stroke-linejoin: round; }
.rc-k { fill: #34434F; } .rc-b { fill: #4A5D6C; } .rc-v { fill: var(--r); }
.rc-y-sorgu { font-size: 11px; font-weight: 500; fill: #E6EEF3; }
.rc-y-sponsor { font-size: 9px; font-weight: 700; fill: #F5F8FA; }
.rc-y-alan { font-size: 8.5px; fill: #9FB4C3; }
.rc-y-ilan { font-size: 12.5px; font-weight: 600; letter-spacing: -.01em; fill: color-mix(in srgb, var(--r) 58%, #fff); }
.rc-y-ara { font-size: 9px; font-weight: 650; fill: var(--r); }
.rc-y-baslik { font-size: 10.5px; font-weight: 650; fill: #EEF3F6; }
.rc-y-not { font-size: 8.5px; fill: #8D9AA6; }
.rc-y-hesap { font-size: 10px; font-weight: 650; fill: #EEF3F6; }
.rc-y-dugme { font-size: 8.5px; font-weight: 650; fill: #fff; }
.rc-y-balon { font-size: 11px; fill: #DCE6EE; }
.rc-ilan { fill: color-mix(in srgb, var(--r) 11%, transparent); stroke: var(--r); stroke-width: 1.1; }
.rc-ara { fill: color-mix(in srgb, var(--r) 14%, transparent); stroke: var(--r); stroke-width: 1.2; } .rc-ara-simge { fill: var(--r); }
.rc-hat { fill: none; stroke: var(--r); stroke-width: 1.6; stroke-linecap: round; stroke-dasharray: 1; stroke-dashoffset: 0; }
.rc-hat-uc { fill: var(--r); }
.rc-uydu-kutu { fill: #0D151B; stroke: #2A3742; stroke-width: 1; }
.rc-dolu { fill: var(--r); } .rc-beyaz { fill: #fff; }
.rc-beyaz-cizgi { fill: none; stroke: #fff; stroke-width: 1.5; stroke-linejoin: round; }
.rc-rapor-alan { fill: color-mix(in srgb, var(--r) 14%, transparent); }
.rc-rapor-egri { fill: none; stroke: var(--r); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 1; stroke-dashoffset: 0; }
.rc-rapor-uc { fill: var(--r); stroke: #0D151B; stroke-width: 1.5; }
.rc-imlec-halka { fill: none; stroke: #fff; stroke-width: 1.4; opacity: 0; }
.rc-imlec-nokta { fill: #fff; stroke: #0C1318; stroke-width: 1.4; }
.rc-g-imlec { transform: translate(318px, 133px); }
.rc-tel { fill: #0B1217; stroke: #2E3B46; stroke-width: 1.2; } .rc-tel-ekran { fill: #0E161C; } .rc-tel-centik { fill: #1A242C; }
.rc-m-h1 { stop-color: #FF8B2B; } .rc-m-h2 { stop-color: #FF5FA2; }
.rc-m-avatar { fill: none; stroke: url(#rc-m-halka); stroke-width: 1.8; } .rc-m-avatar-ic { fill: #1B2731; }
.rc-m-gorsel { fill: #0F181F; stroke: #22303A; stroke-width: 1; }
.rc-m-kalp { fill: var(--r); stroke: var(--r); stroke-width: 1.2; stroke-linejoin: round; }
.rc-m-dugme-zemin { fill: var(--r); }
.rc-balon-zemin { fill: #16212A; stroke: #2A3742; stroke-width: 1; }
.rc-m-yaziyor { opacity: 0; } .rc-m-yaziyor circle { fill: #8D9AA6; }
.rc-m-imlec { transform: translate(160px, 206px); }
.rc-g-zil, .rc-m-kalp, .rc-hat-uc, .rc-rapor-uc, .rc-imlec-halka, .rc-g-ara, .rc-m-dugme { transform-box: fill-box; transform-origin: center; }
.rc-g-yazi { transform-box: fill-box; transform-origin: left center; }
/* video çizimi: marka kiti (müşterinin renkleri: turuncu, pembe, sarı) → telefonda kurulan kısa reklam → hazır ölçüler */
.rv-r1 { stop-color: #FF8B2B; } .rv-r2 { stop-color: #FF5FA2; } .rv-r3 { stop-color: #C86BFF; }
.rv-y-ust { font-size: 12px; font-weight: 650; fill: #C9D4DC; letter-spacing: -.01em; }
.rv-logo-halka { fill: none; stroke: #FF8B2B; stroke-width: 2.4; } .rv-logo-nokta { fill: #FF8B2B; }
.rv-y-firma { font-size: 13px; font-weight: 700; fill: #EEF3F6; letter-spacing: -.01em; }
.rv-renk-1 { fill: #FF8B2B; } .rv-renk-2 { fill: #FF5FA2; } .rv-renk-3 { fill: #FFD15C; }
.rv-renk { stroke: #0D151B; stroke-width: 2; }
.rv-y-aa { font-size: 30px; font-weight: 700; fill: #EEF3F6; letter-spacing: -.02em; }
.rv-hat-1 { stroke: #FF8B2B; } .rv-hat-2 { stroke: #FF5FA2; } .rv-hat-3 { stroke: #C9D4DC; }
.rc-video .rv-hat-uc { fill: #FF5FA2; }
.rv-daire { fill: #ffffff24; } .rv-daire2 { fill: #FFD15C; opacity: .9; }
.rv-cubuk-iz { fill: #ffffff4d; } .rv-cubuk { fill: #fff; }
.rv-hesap-zemin { fill: #fff; } .rv-hesap-nokta { fill: #FF5FA2; }
.rv-y-hesap { font-size: 10px; font-weight: 700; fill: #fff; } .rv-y-sponsor { font-size: 8px; fill: #ffffffcc; }
.rv-logo-b-halka { fill: none; stroke: #fff; stroke-width: 4; } .rv-logo-b-nokta { fill: #fff; }
.rv-y-baslik { font-size: 25px; font-weight: 750; fill: #fff; letter-spacing: -.035em; }
.rv-y-vurgu { font: italic 400 30px 'Instrument Serif', Georgia, serif; fill: #fff; }
.rv-cta-zemin { fill: #fff; } .rv-y-cta { font-size: 10.5px; font-weight: 700; fill: #2A0F2A; }
.rv-cikis { stroke: var(--r); } .rc-video .rv-cikis-uc { fill: var(--r); }
.rv-olcu-kare { fill: url(#rv-renk); stroke: #ffffff30; stroke-width: 1; }
.rv-olcu-logo { fill: none; stroke: #fff; stroke-width: 2; } .rv-olcu-cizgi { fill: #ffffffcc; }
.rv-y-olcu { font-size: 11.5px; font-weight: 600; fill: #DCE6EE; }
.rv-renk, .rv-hat-uc, .rv-cikis-uc, .rv-daire, .rv-daire2, .rv-logo-b, .rv-cta { transform-box: fill-box; transform-origin: center; }
.rv-zemin { transform-box: fill-box; transform-origin: center bottom; }
/* sosyal medya çizimi: telefonla çekim (odak köşeleri, kayıt noktası) → gönderi, hikâye ve Reels kareleri → aylık takvim dolar → Paylaşıldı */
.rz-urun { fill: #1B2731; stroke: #4A5D6C; stroke-width: 1.2; } .rz-urun-etiket { fill: #0F181F; stroke: #34434F; stroke-width: 1; } .rz-urun-nokta { fill: var(--r); }
.rz-kose { fill: none; stroke: var(--r); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.rz-kayit-nokta { fill: #FF5C5C; }
.rz-kutu { fill: #0F181F; stroke: #2E3D49; stroke-width: 1; } .rz-halka { fill: none; stroke: var(--r); stroke-width: 1.6; }
.rz-oynat-zemin { fill: color-mix(in srgb, var(--r) 16%, transparent); stroke: var(--r); stroke-width: 1.2; } .rz-oynat { fill: var(--r); }
.rz-y-etiket { font-size: 12px; font-weight: 600; fill: #DCE6EE; }
.rz-gun { fill: #0F181F; stroke: #22303A; stroke-width: 1; } .rz-p { fill: var(--r); opacity: .92; }
.rz-chip { fill: color-mix(in srgb, var(--r) 14%, transparent); stroke: var(--r); stroke-width: 1.2; }
.rz-tik { fill: none; stroke: var(--r); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 1; stroke-dashoffset: 0; }
.rz-y-chip { font-size: 11.5px; font-weight: 650; fill: #fff; }
.rc-sosyal .rz-hat-uc { fill: var(--r); }
.rz-p, .rz-odak, .rz-hat-uc, .rz-paylasildi, .rz-kayit-nokta { transform-box: fill-box; transform-origin: center; }
.rv-cubuk { transform-box: fill-box; transform-origin: left center; }

/* ---------- bir kez oynayan hareket (yalnız betik varken ve hareketi azalt kapalıyken) ----------
   Animasyon her zaman tanımlıdır ama duraklatılmıştır: çizim ekrana girene kadar ilk karesinde bekler; .oyna onu yürütür (fill: both, son kare
   = varsayılan hâl). .bitti: animasyonsuz son hâl (menüden gelince ilk ekran, hareketi azalt). .sifir: yeniden oynatmadan önce bir kare. */
@media (prefers-reduced-motion: no-preference) {
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rc-g-yazi { animation: rc-yaz 1.1s steps(19, end) .25s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rc-ilan { animation: rc-g-isik .5s ease-out 1.35s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rc-g-imlec { animation: rc-g-imlec 1.1s cubic-bezier(.5, 0, .2, 1) 1.5s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rc-g-imlec .rc-imlec-halka { animation: rc-tik .6s ease-out 2.6s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rc-g-ara { animation: rc-bas .45s ease-out 2.6s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rc-g-hat { animation: rc-ciz .6s ease-in-out 2.8s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rc-g-hat + .rc-hat-uc { animation: rc-nokta .3s ease-out 3.35s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rc-g-arama { animation: rc-gel .45s var(--egri) 3.35s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rc-g-zil { animation: rc-zil .7s ease-in-out 3.8s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rc-g-rapor { animation: rc-gel .45s var(--egri) 4s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rc-rapor-egri { animation: rc-ciz .8s ease-in-out 4.2s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rc-rapor-alan { animation: rc-belir .5s ease-out 4.5s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rc-rapor-uc { animation: rc-nokta .3s ease-out 4.9s both paused; }

  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rc-m-akis { animation: rc-m-kay .9s var(--egri) .2s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rc-m-kalp { animation: rc-kalp .5s ease-out 1.2s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rc-m-imlec { animation: rc-m-imlec .9s cubic-bezier(.5, 0, .2, 1) 1.45s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rc-m-imlec .rc-imlec-halka { animation: rc-tik .6s ease-out 2.35s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rc-m-dugme { animation: rc-bas .45s ease-out 2.35s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rc-m-hat { animation: rc-ciz .7s ease-in-out 2.55s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rc-m-hat + .rc-hat-uc { animation: rc-nokta .3s ease-out 3.2s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rc-m-bildirim { animation: rc-gel .45s var(--egri) 3.2s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rc-m-b1 { animation: rc-balon .4s var(--egri) 3.65s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rc-m-yaziyor { animation: rc-yaziyor .75s linear 4.05s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rc-m-b2 { animation: rc-balon .4s var(--egri) 4.75s both paused; }

  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rv-kit-logo { animation: rc-gel .45s var(--egri) .2s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rv-renk-1 { animation: rc-nokta .4s ease-out .4s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rv-renk-2 { animation: rc-nokta .4s ease-out .5s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rv-renk-3 { animation: rc-nokta .4s ease-out .6s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rv-kit-yazi { animation: rc-gel .45s var(--egri) .7s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rv-hat-1 { animation: rc-ciz .55s ease-in-out .9s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rv-hat-2 { animation: rc-ciz .55s ease-in-out 1s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rv-hat-3 { animation: rc-ciz .55s ease-in-out 1.1s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rv-hat-uc { animation: rc-nokta .3s ease-out 1.55s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rv-zemin { animation: rv-sil .6s cubic-bezier(.6, 0, .2, 1) 1.6s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rv-cubuk-1 { animation: rv-dol 1s linear 1.7s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rv-hesap { animation: rc-belir .4s ease-out 1.95s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rv-daire { animation: rc-nokta .6s var(--egri) 1.95s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rv-daire2 { animation: rc-nokta .6s var(--egri) 2.15s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rv-logo-b { animation: rv-dus .55s var(--egri) 2.2s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rv-cubuk-2 { animation: rv-dol 1s linear 2.7s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rv-baslik-1 { animation: rc-balon .45s var(--egri) 2.8s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rv-baslik-2 { animation: rc-balon .45s var(--egri) 3.05s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rv-cubuk-3 { animation: rv-dol 1s linear 3.7s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rv-cta { animation: rc-nokta .45s ease-out 3.8s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rv-ust-cikis { animation: rc-belir .4s ease-out 4.5s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rv-cikis-1 { animation: rc-ciz .5s ease-in-out 4.5s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rv-cikis-2 { animation: rc-ciz .5s ease-in-out 4.6s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rv-cikis-3 { animation: rc-ciz .5s ease-in-out 4.7s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rv-cikis-uc-1 { animation: rc-nokta .3s ease-out 4.95s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rv-cikis-uc-2 { animation: rc-nokta .3s ease-out 5.05s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rv-cikis-uc-3 { animation: rc-nokta .3s ease-out 5.15s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rv-olcu-1 { animation: rc-gel .45s var(--egri) 5s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rv-olcu-2 { animation: rc-gel .45s var(--egri) 5.1s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rv-olcu-3 { animation: rc-gel .45s var(--egri) 5.2s both paused; }

  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rz-cekim { animation: rc-gel .45s var(--egri) .2s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rz-odak { animation: rz-odak .55s var(--egri) .6s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rz-kayit-nokta { animation: rz-kayit 1.1s linear 1s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rz-hat-1 { animation: rc-ciz .5s ease-in-out 1.4s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rz-hat-2 { animation: rc-ciz .5s ease-in-out 1.5s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rz-hat-3 { animation: rc-ciz .5s ease-in-out 1.6s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rz-ust-icerik { animation: rc-belir .4s ease-out 1.7s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rz-icerik-1 { animation: rc-gel .45s var(--egri) 1.85s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rz-icerik-2 { animation: rc-gel .45s var(--egri) 2s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rz-icerik-3 { animation: rc-gel .45s var(--egri) 2.15s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rz-hat-4 { animation: rc-ciz .5s ease-in-out 2.8s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rz-hat-5 { animation: rc-ciz .5s ease-in-out 2.9s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rz-hat-6 { animation: rc-ciz .5s ease-in-out 3s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rz-hat-uc { animation: rc-nokta .3s ease-out 3.45s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rz-ust-takvim { animation: rc-belir .4s ease-out 3.4s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rz-takvim { animation: rc-gel .45s var(--egri) 3.45s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rz-p1 { animation: rc-nokta .4s ease-out 4s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rz-p2 { animation: rc-nokta .4s ease-out 4.25s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rz-p3 { animation: rc-nokta .4s ease-out 4.5s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rz-p4 { animation: rc-nokta .4s ease-out 4.75s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rz-paylasildi { animation: rc-nokta .45s ease-out 5.1s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rz-tik { animation: rc-ciz .35s ease-out 5.35s both paused; }

  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rs-akis-hat::before { animation: rs-hat .9s cubic-bezier(.6, 0, .2, 1) .1s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rs-akis-hat i { animation: rc-nokta-html .35s ease-out .95s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rs-akis-kime { animation: rc-belir .45s ease-out 1s both paused; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rs-akis-ucret .rs-akis-hat::before { animation-delay: .55s; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rs-akis-ucret .rs-akis-hat i { animation-delay: 1.4s; }
  html:not(.js-yok) .rs-sayfa [data-cizim]:not(.bitti) .rs-akis-ucret .rs-akis-kime { animation-delay: 1.45s; }

  html:not(.js-yok) .rs-sayfa [data-cizim].oyna:not(.bitti) *,
  html:not(.js-yok) .rs-sayfa [data-cizim].oyna:not(.bitti) *::before { animation-play-state: running !important; }
  .rs-sayfa [data-cizim].sifir *, .rs-sayfa [data-cizim].sifir *::before { animation: none !important; }
}
@keyframes rc-yaz { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes rc-g-isik { from { fill: color-mix(in srgb, var(--r) 3%, transparent); stroke: color-mix(in srgb, var(--r) 28%, transparent); } }
@keyframes rc-g-imlec { 0% { transform: translate(214px, 240px); opacity: 0; } 25% { opacity: 1; } 100% { transform: translate(318px, 133px); opacity: 1; } }
@keyframes rc-m-imlec { 0% { transform: translate(196px, 244px); opacity: 0; } 25% { opacity: 1; } 100% { transform: translate(160px, 206px); opacity: 1; } }
@keyframes rc-tik { 0% { opacity: 0; transform: scale(.5); } 20% { opacity: 1; transform: scale(.75); } 100% { opacity: 0; transform: scale(2.1); } }
@keyframes rc-bas { 0% { transform: none; filter: none; } 35% { transform: scale(.94); filter: brightness(1.5); } 100% { transform: none; filter: none; } }
@keyframes rc-ciz { from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }
@keyframes rc-nokta { 0% { opacity: 0; transform: scale(0); } 70% { opacity: 1; transform: scale(1.35); } 100% { opacity: 1; transform: scale(1); } }
@keyframes rc-nokta-html { 0% { opacity: 0; transform: scale(0); } 70% { opacity: 1; transform: scale(1.3); } 100% { opacity: 1; transform: scale(1); } }
@keyframes rc-gel { from { opacity: 0; transform: translateX(-10px); } to { opacity: 1; transform: none; } }
@keyframes rc-zil { 0%, 100% { transform: none; } 15% { transform: rotate(-12deg); } 30% { transform: rotate(10deg); } 45% { transform: rotate(-8deg); } 60% { transform: rotate(6deg); } 75% { transform: rotate(-3deg); } }
@keyframes rc-belir { from { opacity: 0; } to { opacity: 1; } }
@keyframes rc-m-kay { from { transform: translateY(52px); } to { transform: none; } }
@keyframes rc-kalp { 0% { transform: scale(1); fill: transparent; stroke: #6A7C8B; } 45% { transform: scale(1.4); fill: var(--r); stroke: var(--r); } 100% { transform: scale(1); fill: var(--r); stroke: var(--r); } }
@keyframes rc-balon { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@keyframes rc-yaziyor { 0% { opacity: 0; } 15%, 85% { opacity: 1; } 100% { opacity: 0; } }
@keyframes rv-sil { from { transform: scaleY(0); } to { transform: none; } }
@keyframes rv-dol { from { transform: scaleX(0); } to { transform: none; } }
@keyframes rv-dus { 0% { opacity: 0; transform: translateY(-18px) scale(.6); } 70% { opacity: 1; transform: translateY(2px) scale(1.06); } 100% { opacity: 1; transform: none; } }
@keyframes rz-odak { from { opacity: 0; transform: scale(1.3); } to { opacity: 1; transform: none; } }
@keyframes rz-kayit { 0% { opacity: 0; } 15% { opacity: 1; } 40% { opacity: .15; } 65% { opacity: 1; } 100% { opacity: 1; } }
@keyframes rs-hat { from { transform: scaleX(0); } to { transform: scaleX(1); } }

/* ---------- düzenler ---------- */
@media (max-width: 1100px) {
  .rs-giris { grid-template-columns: minmax(0, 1fr); align-items: start; }
  .rs-aciklama { max-width: 52ch; }
  .rs-butce { grid-template-columns: minmax(0, 1fr); }
  .rs-butce-metin p { max-width: 60ch; }
}
@media (max-width: 860px) {
  .katalog-sayfa.rs-sayfa { padding-top: 118px; }
  .rs-hizmetler { grid-template-columns: minmax(0, 1fr); }
  .rs-kart-genis { display: flex; }
  .rs-kart-ters .rs-kart-cizim { order: 0; }
  .rs-kart-genis .rs-kart-cizim { padding: 8px 4px; }
  .rs-akis-satir { grid-template-columns: minmax(0, 1fr) minmax(40px, .7fr) minmax(0, 1fr); padding: 18px; }
}
@media (max-width: 599px) {
  .katalog-sayfa.rs-sayfa { width: calc(100% - 32px); padding-top: 108px; }
  .rs-baslik { font-size: clamp(40px, 12.4vw, 56px); }
  .rs-kart { padding: 8px; border-radius: 18px; }
  .rs-kart-cizim { border-radius: 11px; }
  .rs-kart-govde { padding: 18px 10px 4px; }
  .rs-kart-cumle { font-size: 15px; }
  .rs-maddeler li { font-size: 14px; }
  .rs-kart-cta { padding: 14px 16px; }
  .rs-hepsi { padding: 16px; }
  .rs-hepsi-cift { width: 100%; }
  .rs-butce { padding: 64px 0 56px; gap: 28px; }
  /* telefon: soldan aşağı akış; hat tam genişlik, ucundaki noktanın altında varılan yer */
  .rs-akis-satir { grid-template-columns: minmax(0, 1fr); gap: 10px; padding: 16px 16px 18px; }
  .rs-akis-hat { margin: 2px 0; }
  .rs-akis-kime { justify-items: end; text-align: right; }
}
@media (forced-colors: active) {
  .rs-kart, .rs-akis-satir, .rs-hepsi, .rs-kosul li { border-color: CanvasText; }
  .rs-kart-cta { border: 1px solid ButtonText; }
  .rs-akis-hat::before, .rs-akis-hat i { background: CanvasText; }
  .rs-akis-butce .rs-akis-kime b { color: CanvasText; background: none; }
}
