/* Bağımsız hizmet sayfaları, abonelik kataloğu ve ortak menü kartları. */
.katalog-sayfa { --kat-renk: #61bdff; width: min(1320px, 90%); margin: auto; padding-top: 156px; }
.katalog-sayfa h1, .katalog-sayfa h2, .katalog-sayfa h3, .kat-kart h3 { margin: 0; }
.kat-kicker { display: flex; align-items: center; gap: 10px; margin: 0 0 25px; font: 500 10px/1.6 'JetBrains Mono', monospace; letter-spacing: .16em; color: var(--kat-renk, #61bdff); }
.kat-kicker i { height: 6px; width: 6px; border-radius: 50%; background: currentColor; box-shadow: 0 0 16px currentColor; }
.kat-metin-bag { display: inline-flex; gap: 30px; align-items: center; padding-bottom: 8px; border-bottom: 1px solid #ffffff30; font-size: 14px; text-decoration: none; }
.kat-metin-bag span { color: var(--kat-renk); }
.kat-yol { display: flex; gap: 14px; font-size: 12px; color: #8e9baa; margin-bottom: 48px; }
.kat-yol a { text-decoration: none; }
.kat-yol span:last-child { color: #dce5ec; }
.kategori-hero { display: grid; grid-template-columns: 1.1fr 1fr; gap: clamp(35px, 7vw, 110px); align-items: center; padding: 15px 0 90px; }
.kategori-hero :is(h1, h2) { font-size: clamp(40px, 4.7vw, 72px); font-weight: 550; line-height: 1.06; letter-spacing: -.045em; }
.kategori-hero :is(h1, h2) > span { color: var(--kat-renk); }
.kat-aciklama { color: #98a6b2; font-size: 16px; line-height: 1.75; max-width: 44ch; margin: 26px 0; }
.kategori-paket { scroll-margin-top: 115px; min-width: 0; }
.kategori-paket > .kat-kicker { margin-bottom: 14px; color: #8897a4; }
.kat-imza { display: flex; align-items: center; gap: 13px; margin-top: 40px; }
.kat-imza > span { font: 650 23px 'Archivo', sans-serif; color: var(--kat-renk); width: 40px; height: 40px; border: 1px solid #ffffff20; display: grid; place-items: center; border-radius: 12px; }
.kat-imza p { margin: 0; font-size: 11px; line-height: 1.7; color: #788795; }
.kat-imza b { font-weight: 500; color: #b9c3cd; }
.kategori-kapsam { padding: 64px 0; border-top: 1px solid #ffffff18; scroll-margin-top: 110px; }
.kat-bolum-baslik h2 { font-size: clamp(30px, 3.3vw, 48px); line-height: 1.13; letter-spacing: -.025em; font-weight: 550; }
.kat-kapsam-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 42px; margin-top: 46px; }
.kat-kapsam-grid article { border-top: 1px solid #ffffff20; padding-top: 23px; }
.kat-kapsam-grid article > span { color: var(--kat-renk); font: 11px 'JetBrains Mono', monospace; }
.kat-kapsam-grid h3 { font-size: 21px; font-weight: 550; margin-top: 26px; }
.kat-kapsam-grid p { font-size: 14px; line-height: 1.8; color: #98a6b2; margin-bottom: 0; }
.kat-fiyat-not { border-left: 2px solid var(--kat-renk); background: #ffffff03; padding: 22px 28px; }
.kat-fiyat-not > span { color: var(--kat-renk); font: 10px 'JetBrains Mono', monospace; letter-spacing: .1em; }
.kat-fiyat-not p { color: #a1aeb9; font-size: 14px; line-height: 1.7; margin-bottom: 0; }
.kategori-diger { display: flex; align-items: center; gap: 25px; flex-wrap: wrap; padding: 60px 0 80px; }
.kategori-diger > span { color: #7d8c98; font: 10px/1.7 'JetBrains Mono', monospace; margin-right: auto; }
.kategori-diger a { font-size: 13px; text-decoration: none; }
/* alt bilgi (.katalog-footer.alt-bilgi) assets/iletisim.css'te */
/* Kartın ışığı ve yüzeyi filmden bağımsızdır. */
.kat-carousel { min-width: 0; --kat-renk: #61bdff; }
.kat-slides { display: grid; gap: 20px; }
.kat-kart { scroll-margin-top: 115px; position: relative; isolation: isolate; overflow: hidden; padding: clamp(24px, 2.8vw, 40px); border: 1px solid #ffffff20; border-radius: 24px; background: radial-gradient(ellipse at 105% -10%, color-mix(in srgb, var(--kat-renk) 15%, transparent), transparent 65%), linear-gradient(145deg,#111920,#0b0e12 70%); box-shadow: 0 24px 44px -24px #000, 0 25px 48px -38px var(--kat-renk), inset 0 1px 0 #ffffff0b; }
.kat-kart[hidden] { display: none; }
.kat-isik { position: absolute; z-index: -1; top: -100px; right: -100px; width: 240px; height: 240px; border-radius: 50%; border: 1px solid color-mix(in srgb,var(--kat-renk) 12%,transparent); box-shadow: 0 0 0 28px #ffffff02, 0 0 0 58px #ffffff02; pointer-events: none; }
.kat-isik::after { content: ''; position: absolute; top: 60%; left: 8%; width: 4px; height: 4px; background: var(--kat-renk); border-radius: 50%; box-shadow: 0 0 14px 4px color-mix(in srgb,var(--kat-renk) 25%,transparent); }
/* kartın üst satırı (hizmetin türü, hizmetler.json → category): sakin, düz yazı; aralıklı büyük harf etiket yok */
.kat-kart-ust { display: flex; align-items: center; justify-content: space-between; gap: 15px; color: color-mix(in srgb, var(--kat-renk) 75%, #DCE6EE); font: 500 13px/1.4 'Archivo', sans-serif; letter-spacing: 0; margin-bottom: 25px; }
.kat-sembol { display: grid; place-items: center; width: 32px; height: 32px; border: 1px solid #ffffff18; border-radius: 50%; font: 19px 'Archivo', sans-serif; }
.kat-kart h3 { font: 550 clamp(21px,2.1vw,30px)/1.2 'Archivo', sans-serif; letter-spacing: -.025em; }
.kat-fiyat { margin: 26px 0 0; }
.kat-fiyat > strong { display: block; font: 550 clamp(38px,4.1vw,60px)/1 'Archivo', sans-serif; letter-spacing: -.045em; }
.kat-fiyat > strong small { font-size: .32em; font-weight: 450; letter-spacing: -.01em; color: #b7c5d1; }
.kat-fiyat > strong.kat-teklif { font-size: clamp(35px,3.5vw,48px); }
.kat-fiyat > span { display: block; color: #8999a7; font-size: 12px; margin-top: 10px; }
.kat-ek-fiyat { margin: 19px 0 0; color: var(--kat-renk); font-size: 15px; font-weight: 500; }
.kat-ek-fiyat small { font-size: 11px; font-weight: 400; }
.kat-ekstra { font-size: 12px; line-height: 1.6; color: #9ba9b6; margin: 18px 0 22px; max-width: 50ch; }
.kat-detay { border-top: 1px solid #ffffff16; font-size: 13px; }
.kat-detay summary { display: flex; align-items: center; justify-content: space-between; padding: 17px 0; cursor: pointer; list-style: none; color: #c4ced7; }
.kat-detay summary::-webkit-details-marker { display: none; }
.kat-detay summary > span { color: var(--kat-renk); font-size: 18px; }
.kat-detay[open] summary > span { transform: rotate(45deg); }
.kat-detay p, .kat-detay li { color: #a1afbb; line-height: 1.7; }
.kat-detay ul { padding-left: 17px; margin-bottom: 22px; }
.kat-kart-bag { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 14px 18px; background: #ffffff06; border: 1px solid #ffffff18; border-radius: 10px; font: 500 13px 'Archivo', sans-serif; text-decoration: none; transition: background .2s; }
.kat-kart-bag:hover { background: color-mix(in srgb,var(--kat-renk) 12%,transparent); }
.kat-kart-bag > span { color: var(--kat-renk); font-size: 20px; }
.kat-controls { display: flex; align-items: center; gap: 8px; margin-top: 17px; }
.kat-controls button { height: 35px; min-width: 35px; border: 1px solid #ffffff20; border-radius: 50%; color: #d9e3eb; background: #10171d; font: 15px 'Archivo', sans-serif; cursor: pointer; }
.kat-controls button:hover { border-color: var(--kat-renk); color: var(--kat-renk); }
.kat-controls .kat-play { border-radius: 20px; font-size: 10px; padding: 0 12px; }
.kat-counter { color: #9baab8; font: 11px 'JetBrains Mono', monospace; margin-right: auto; }
.kat-counter b { color: var(--kat-renk); font-weight: 500; }
.kat-kisa-kapsam { color: #a4b2be; font-size: 12px; line-height: 1.6; padding-top: 15px; border-top: 1px solid #ffffff16; margin: 0 0 18px; }
.mi-abonelik { min-width: 0; }
.mi-abonelik .kat-kart { padding: 24px; border-radius: 18px; }
.mi-abonelik .kat-kart-ust { margin-bottom: 16px; }
.mi-abonelik .kat-kart h3 { font-size: 23px; }
.mi-abonelik .kat-fiyat { margin-top: 20px; }
.mi-abonelik .kat-fiyat > strong { font-size: 43px; }
.mi-abonelik .kat-ekstra { margin: 15px 0; }
.mi-abonelik .kat-kart-bag { padding: 10px 14px; }
.mi-abonelik .kat-controls { margin-top: 12px; }
.katalog-sayfa a:focus-visible, .kat-carousel :focus-visible { outline: 2px solid var(--kat-renk,#61bdff); outline-offset: 5px; }
@keyframes kat-isik-dolas { 0%,70%,100% { transform: rotate(0); opacity: .4; } 85% { transform: rotate(-50deg); opacity: 1; } }
.kat-gorunur .kat-isik { animation: kat-isik-dolas 9s ease-in-out infinite; }
@media (max-width:1100px) { .mi-abonelik { grid-column: 1; grid-row: 2; } .kategori-hero { gap: 35px; } }
@media (max-width:860px) { .mi-abonelik { grid-column:auto; grid-row:2; } .menu-icerik:has(.mi-abonelik) .mi-orta { grid-row: 3; } .katalog-sayfa { padding-top: 125px; } .kategori-hero { grid-template-columns:1fr; padding-bottom:55px; } .kategori-hero-metin { max-width: 620px; } .kat-imza { display:none; } .kategori-paket { max-width:600px; width:100%; } .kat-kapsam-grid { gap:24px; } }
@media (max-width:600px) { .katalog-sayfa { width:calc(100% - 36px); } .kat-kart { padding:25px; } .kat-fiyat > strong { font-size:48px; } .kategori-hero :is(h1, h2) { font-size:44px; } .kat-yol { margin-bottom:35px; } .kat-kapsam-grid { grid-template-columns:1fr; gap:28px; margin-top:30px; } .kat-kapsam-grid h3 { margin-top:15px; } .kategori-diger { gap:20px; padding:42px 0; } .kategori-diger > span { width:100%; } .kat-fiyat-not { padding:20px; } .mi-abonelik .kat-kart { padding:20px; } }
@media (prefers-reduced-motion:reduce) { .kat-gorunur .kat-isik { animation:none; } .kat-carousel * { transition:none !important; } }
/* abonelikler.html: başlık ve tercih sihirbazı (#paketler) */
.abonelik-genel { padding-top:130px; }
.abonelik-genel #paketler { display:grid; grid-template-columns:minmax(0,1fr); gap:56px; align-items:start; }
@media(max-width:1100px) { .abonelik-genel #paketler { grid-template-columns:1fr; gap:36px; } }
@media(max-width:600px) { .abonelik-genel { padding-top:115px; } }
/* kartlar web-paketler.css'te (.wp-liste) */

/* ekran okuyucuya açık, görünmez metin */
.gorunmez { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
/* menüde Web siteleri: kart slaytı yerine bütün paketler tek listede (sayfa-uret.py web_menu_ozeti) */
.wpm { display: grid; gap: 2px; padding: 18px 18px 14px; border: 1px solid #ffffff18; border-radius: 18px; background: #0A1116; }
.wpm-satir { display: grid; grid-template-columns: 12px minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 9px 8px; border-radius: 10px; text-decoration: none; color: #EAF1F5; transition: background-color .2s; }
.wpm-satir:hover, .wpm-satir:focus-visible { background: #ffffff0a; }
.wpm-satir i { width: 8px; height: 8px; border-radius: 50%; background: var(--paket-renk); box-shadow: 0 0 12px var(--paket-renk); }
.wpm-satir span { font-size: 14px; font-weight: 550; } .wpm-satir small { display: block; margin-top: 2px; font: 400 12px/1.3 'Archivo', sans-serif; letter-spacing: 0; color: #8D9AA6; }
.wpm-satir b { font-size: 14px; font-stretch: 94%; font-weight: 600; white-space: nowrap; font-variant-numeric: tabular-nums; } .wpm-satir b small { display: inline; margin-left: 2px; }
.wpm-satir b small { margin-left: 4px; font: 500 11px/1 'Archivo', sans-serif; letter-spacing: 0; text-transform: none; color: #A2AEB9; }
.wpm-not { margin: 6px 8px 0; color: #7F8E9A; font-size: 11.5px; }
.wpm-hepsi { margin-top: 8px; padding: 12px 8px 2px; border-top: 1px solid #ffffff14; font-size: 13px; text-decoration: none; color: #CFE9F8; }
