/* İçtihat.app · şov landing yerleşimi
   Üst bar · hero (bölünmüş / merkezli) · akış rayı · gösterim bölümleri
   · kapsam · paketler · SSS · kapanış · altbilgi. Mobil önce. */

/* ---------- üst bar ---------- */
.ustbar { position: sticky; top: 0; z-index: 50; transition: background-color var(--sure-2), box-shadow var(--sure-2), border-color var(--sure-2); border-bottom: 1px solid transparent; }
.ustbar.kaydi { background: color-mix(in srgb, var(--zemin) 88%, transparent); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); border-bottom-color: var(--cizgi); }
.ustbar__ic { display: flex; align-items: center; gap: var(--b-4); min-height: 4.25rem; }
.ustbar__marka { display: inline-flex; align-items: center; min-height: var(--hedef); margin-right: auto; }
.ustbar__marka img { width: auto; height: 1.9rem; }
.ustbar__nav { display: none; gap: 0.25rem; }
.ustbar__nav a { display: inline-flex; align-items: center; min-height: var(--hedef); padding: 0 0.8rem; border-radius: var(--r-2); font-size: var(--t-kucuk); font-weight: 500; color: var(--murekkep-2); text-decoration: none; }
.ustbar__nav a:hover { color: var(--murekkep); background: color-mix(in srgb, var(--murekkep) 6%, transparent); }
.ustbar__eylem { display: flex; align-items: center; gap: 0.5rem; }
.ustbar__giris { display: none; align-items: center; min-height: var(--hedef); padding: 0 0.8rem; font-size: var(--t-kucuk); font-weight: 500; text-decoration: none; color: var(--murekkep-2); }
.ustbar__giris:hover { color: var(--murekkep); }
.ustbar__menu { display: inline-flex; align-items: center; justify-content: center; width: var(--hedef); height: var(--hedef); border-radius: var(--r-2); box-shadow: inset 0 0 0 1px var(--cizgi-2); }
.ustbar__menu svg { width: 1.25rem; height: 1.25rem; stroke: currentColor; fill: none; stroke-width: 1.8; stroke-linecap: round; }
.ustbar__menu[aria-expanded="true"] .cizgi-kapali { display: none; }
.ustbar__menu[aria-expanded="false"] .cizgi-acik { display: none; }
.ustbar__panel { border-top: 1px solid var(--cizgi); background: var(--zemin); }
.ustbar__panel ul { display: grid; padding: 0.5rem 0 1rem; }
.ustbar__panel a { display: flex; align-items: center; justify-content: space-between; min-height: 3rem; padding: 0 var(--oluk); text-decoration: none; font-weight: 500; color: var(--murekkep); border-bottom: 1px solid var(--cizgi); }
@media (min-width: 1024px) {
  .ustbar__nav { display: flex; }
  .ustbar__giris { display: inline-flex; }
  .ustbar__menu, .ustbar__panel { display: none; }
}

/* ---------- hero ---------- */
.hero { position: relative; overflow: hidden; padding-block: clamp(2.5rem, 1.5rem + 3vw, 4rem) clamp(3rem, 2rem + 4vw, 5.5rem); }
.hero__isik { position: absolute; inset: 0; pointer-events: none; z-index: 0;
  background:
    radial-gradient(60% 50% at 78% 18%, color-mix(in srgb, var(--vurgu) 16%, transparent) 0%, transparent 60%),
    radial-gradient(40% 40% at 8% 90%, color-mix(in srgb, var(--vurgu) 9%, transparent) 0%, transparent 60%);
}
.hero__izgara { position: relative; z-index: 1; display: grid; gap: clamp(2rem, 1rem + 4vw, 4rem); align-items: center; }
.hero__izgara > *, .ikili > *, .kap > * { min-width: 0; }
.hero__metin { display: grid; gap: var(--b-5); }
.hero__metin h1 { max-width: 11.5em; text-wrap: balance; }
.hero__metin h1 em { font-style: normal; color: var(--vurgu); }
.hero__cta { display: flex; flex-wrap: wrap; gap: 0.75rem; align-items: center; }
.hero__not { font-size: var(--t-kucuk); color: var(--murekkep-3); }
.hero__kanit { display: flex; flex-wrap: wrap; gap: var(--b-4) var(--b-6); margin: 0; padding-top: var(--b-4); border-top: 1px solid var(--cizgi); max-width: 34rem; }
.hero__kanit div { display: grid; gap: 0.1rem; }
.hero__kanit dt { font-family: var(--yazi-mono); font-size: var(--t-mini); letter-spacing: 0.08em; text-transform: uppercase; color: var(--murekkep-3); order: 2; }
.hero__kanit dd { margin: 0; font-family: var(--yazi-serif); font-size: clamp(1.5rem, 1.2rem + 1.2vw, 2.125rem); line-height: 1; color: var(--murekkep); font-variant-numeric: tabular-nums; order: 1; }
.hero__sahne { position: relative; }
.hero__sahne .sahne { transform: none; }
@media (min-width: 1024px) {
  .hero--bolunmus .hero__izgara { grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr); }
  .hero--bolunmus .hero__sahne { justify-self: end; width: 100%; max-width: 40rem; }
}
.hero--merkez .hero__izgara { justify-items: center; text-align: center; }
.hero--merkez .hero__metin { justify-items: center; }
.hero--merkez .hero__metin h1 { max-width: 16ch; }
.hero--merkez .lead { margin-inline: auto; }
.hero--merkez .hero__sahne { width: 100%; max-width: 60rem; margin-top: var(--b-4); }
.hero--merkez .hero__kanit { justify-content: center; }
.hero__isaret { position: absolute; right: -6vw; top: -8vw; width: clamp(18rem, 40vw, 44rem); opacity: 0.07; pointer-events: none; z-index: 0; }

/* ---------- akış rayı ---------- */
.ray { position: sticky; top: 4.25rem; z-index: 40; background: color-mix(in srgb, var(--zemin) 92%, transparent); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border-block: 1px solid var(--cizgi); }
.ray__ic { display: flex; gap: 0.25rem; overflow-x: auto; scrollbar-width: none; -ms-overflow-style: none; }
.ray__ic::-webkit-scrollbar { display: none; }
.ray__adim { flex: none; display: inline-flex; align-items: center; gap: 0.5rem; min-height: 3.25rem; padding: 0 0.85rem; font-family: var(--yazi-mono); font-size: var(--t-mini); letter-spacing: 0.06em; text-transform: uppercase; color: var(--murekkep-3); text-decoration: none; border-bottom: 2px solid transparent; transition: color var(--sure-2), border-color var(--sure-2); }
.ray__adim b { font-weight: 600; color: var(--vurgu); }
.ray__adim.aktif { color: var(--murekkep); border-bottom-color: var(--vurgu); }
@media (min-width: 1024px) { .ray__ic { justify-content: space-between; } .ray__adim { padding: 0 0.6rem; } }

/* ---------- bölüm başlıkları ve yerleşimler ---------- */
.bolum__bas { display: grid; gap: var(--b-4); margin-bottom: clamp(2rem, 1.5rem + 2.5vw, 3.5rem); }
.bolum__bas .lead { max-width: 44rem; }
.bolum__no { font-family: var(--yazi-mono); font-size: var(--t-mini); letter-spacing: 0.14em; color: var(--murekkep-3); }
.ikili { display: grid; gap: clamp(1.5rem, 1rem + 3vw, 4rem); align-items: start; }
@media (min-width: 1024px) { .ikili { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); } .ikili--ters > :first-child { order: 2; } .ikili--ters > :last-child { order: 1; } .ikili__yapisik { position: sticky; top: 8.5rem; } }
.madde-liste { display: grid; gap: 1rem; margin-top: var(--b-5); }
.madde-liste li { display: grid; grid-template-columns: auto 1fr; gap: 0.85rem; align-items: start; color: var(--murekkep-2); font-size: var(--t-govde); line-height: 1.5; }
.madde-liste li::before { content: ""; width: 0.5rem; height: 0.5rem; margin-top: 0.6rem; border-radius: 50%; background: var(--vurgu); }
.madde-liste li > span { display: block; }
.madde-liste b { color: var(--murekkep); font-weight: 500; }
.olcum { display: flex; flex-wrap: wrap; gap: 0.75rem 1.5rem; padding: 0.85rem 1rem; border: 1px solid var(--cizgi); border-radius: var(--r-2); margin-top: var(--b-5); font-family: var(--yazi-mono); font-size: var(--t-mini); color: var(--murekkep-3); letter-spacing: 0.02em; }
.olcum b { display: block; font-size: 1.25rem; color: var(--murekkep); font-weight: 600; margin-top: 0.15rem; }
.olcum .dogru { color: var(--dogru); } .olcum .hata { color: var(--hata); } .olcum .vurgu { color: var(--vurgu); }

/* ---------- ürün resmi geçidi: 6 adım ---------- */
.adimlar { display: grid; gap: 1px; background: var(--cizgi); border: 1px solid var(--cizgi); border-radius: var(--r-3); overflow: hidden; }
@media (min-width: 700px) { .adimlar { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1100px) { .adimlar { grid-template-columns: repeat(3, 1fr); } }
.adim { position: relative; display: grid; gap: 0.6rem; padding: clamp(1.25rem, 1rem + 1.2vw, 1.75rem); background: var(--zemin-kart); text-decoration: none; color: inherit; transition: background-color var(--sure-2); }
.adim:hover { background: var(--zemin-2); }
.adim__no { font-family: var(--yazi-mono); font-size: var(--t-mini); letter-spacing: 0.12em; color: var(--vurgu); font-weight: 600; }
.adim h3 { font-size: 1.5rem; }
.adim p { color: var(--murekkep-2); font-size: var(--t-kucuk); line-height: 1.5; }
.adim__mini { margin-top: 0.5rem; padding: 0.7rem 0.8rem; border-radius: var(--r-2); background: var(--belge); color: var(--belge-murekkep-2); font-family: var(--yazi-mono); font-size: var(--t-mini); line-height: 1.5; border-left: 3px solid var(--belge-vurgu); }
.adim__mini b { color: var(--belge-murekkep); font-weight: 600; }

/* ---------- kapsam ---------- */
.kapsam { display: grid; gap: var(--b-6); }
.kapsam__sayilar { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1px; background: var(--cizgi); border-block: 1px solid var(--cizgi); }
@media (min-width: 900px) { .kapsam__sayilar { grid-template-columns: repeat(5, 1fr); } }
.kapsam__sayi { display: grid; gap: 0.35rem; padding: clamp(1.25rem, 1rem + 1vw, 1.75rem) 1rem; background: var(--zemin); }
.kapsam__sayi dd { margin: 0; font-family: var(--yazi-serif); font-size: var(--t-sayi); line-height: 1; color: var(--murekkep); font-variant-numeric: tabular-nums; letter-spacing: -0.02em; }
.kapsam__sayi dt { font-family: var(--yazi-mono); font-size: var(--t-mini); letter-spacing: 0.08em; text-transform: uppercase; color: var(--murekkep-3); }
.kapsam__sayi--ana dd { color: var(--vurgu); }
.kapsam__kaynak { display: flex; flex-wrap: wrap; gap: 0.5rem 1.5rem; font-family: var(--yazi-mono); font-size: var(--t-kucuk); color: var(--murekkep-2); }
.kapsam__kaynak li::before { content: "◆ "; color: var(--vurgu); font-size: 0.7em; vertical-align: 0.2em; }
.kapsam__not { font-size: var(--t-kucuk); color: var(--murekkep-3); max-width: 60rem; line-height: 1.55; }

/* ---------- paketler ---------- */
.paketler { display: grid; gap: 1rem; }
@media (min-width: 900px) { .paketler { grid-template-columns: repeat(3, 1fr); align-items: stretch; } }
.paket { position: relative; display: grid; gap: var(--b-4); align-content: start; padding: clamp(1.5rem, 1.2rem + 1.4vw, 2.25rem); border: 1px solid var(--cizgi); border-radius: var(--r-3); background: var(--zemin-kart); transition: transform var(--sure-2) var(--egri), box-shadow var(--sure-2) var(--egri); }
.paket:hover { transform: translateY(-4px); box-shadow: var(--golge-kucuk); }
.paket--one { border-color: var(--vurgu); box-shadow: 0 0 0 1px var(--vurgu), var(--golge-kucuk); }
.paket__etiket { position: absolute; top: -0.8rem; left: 1.5rem; padding: 0.3rem 0.65rem; border-radius: var(--r-tam); background: var(--vurgu); color: var(--vurgu-metin); font-family: var(--yazi-mono); font-size: var(--t-mini); font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; }
.paket h3 { font-size: 1.75rem; }
.paket__kim { color: var(--murekkep-2); font-size: var(--t-kucuk); }
.paket__fiyat { font-family: var(--yazi-serif); font-size: clamp(2.25rem, 1.8rem + 1.6vw, 3rem); line-height: 1; color: var(--murekkep); letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
.paket__fiyat small { font-family: var(--yazi-sans); font-size: 1rem; color: var(--murekkep-3); margin-left: 0.35rem; letter-spacing: 0; }
.paket__liste { display: grid; gap: 0.55rem; padding-top: var(--b-4); border-top: 1px solid var(--cizgi); }
.paket__liste li { display: grid; grid-template-columns: auto 1fr; gap: 0.6rem; font-size: var(--t-kucuk); color: var(--murekkep-2); line-height: 1.45; }
.paket__liste li::before { content: "✓"; color: var(--dogru); font-weight: 600; }
.paket__liste li.eksi::before { content: "·"; color: var(--murekkep-3); }
.paket .dugme { width: 100%; margin-top: auto; }
.paket__not { font-size: var(--t-mini); color: var(--murekkep-3); text-align: center; }
.paket-alt { display: flex; flex-wrap: wrap; gap: 0.5rem 1.5rem; margin-top: var(--b-5); font-size: var(--t-kucuk); color: var(--murekkep-3); }
.paket-alt li::before { content: "· "; }

/* ---------- SSS ---------- */
.sss { display: grid; gap: 0; border-top: 1px solid var(--cizgi); }
.sss details { border-bottom: 1px solid var(--cizgi); }
.sss summary { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 3.5rem; padding: 0.85rem 0; cursor: pointer; list-style: none; font-family: var(--yazi-serif); font-size: 1.25rem; color: var(--murekkep); }
.sss summary::-webkit-details-marker { display: none; }
.sss summary::after { content: "+"; font-family: var(--yazi-mono); color: var(--vurgu); font-size: 1.25rem; transition: transform var(--sure-2); }
.sss details[open] summary::after { transform: rotate(45deg); }
.sss details p { padding: 0 0 1.25rem; color: var(--murekkep-2); max-width: 60rem; }

/* ---------- kapanış ---------- */
.kapanis { text-align: center; display: grid; justify-items: center; gap: var(--b-5); }
.kapanis h2 { max-width: 20ch; text-wrap: balance; font-size: clamp(2.25rem, 1.5rem + 3.4vw, 4.5rem); }
.kapanis .hero__cta { justify-content: center; }

/* ---------- altbilgi ---------- */
.alt { border-top: 1px solid var(--cizgi); padding-block: var(--b-7) var(--b-6); font-size: var(--t-kucuk); color: var(--murekkep-3); }
.alt__ust { display: grid; gap: var(--b-5); }
@media (min-width: 900px) { .alt__ust { grid-template-columns: 1.4fr 1fr 1fr 1fr; } }
.alt__marka img { height: 1.6rem; width: auto; margin-bottom: 0.75rem; }
.alt h4 { font-family: var(--yazi-mono); font-size: var(--t-mini); letter-spacing: 0.1em; text-transform: uppercase; color: var(--murekkep-3); margin-bottom: 0.75rem; font-weight: 600; }
.alt ul { display: grid; gap: 0.35rem; }
.alt a { text-decoration: none; color: var(--murekkep-2); display: inline-flex; min-height: 1.75rem; align-items: center; }
.alt a:hover { color: var(--murekkep); text-decoration: underline; }
.alt__alt { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0.75rem 1.5rem; margin-top: var(--b-6); padding-top: var(--b-4); border-top: 1px solid var(--cizgi); font-size: var(--t-mini); }
.alt__odeme { display: inline-flex; gap: 0.5rem; font-family: var(--yazi-mono); letter-spacing: 0.06em; }

/* mobil sıkılaştırma: üçüncü sonuç kartı ve bazı ikincil satırlar dar ekranda gizli */
@media (max-width: 899px) { .ekran__sonuc:nth-of-type(n+3) { display: none; } .sema__dugum span { font-size: var(--t-mini); } }

@media (max-width: 899px) { .kapsam__sayi:last-child { grid-column: span 2; } }
.olcum--buyuk { margin-top: 1.25rem; gap: 1rem 2.5rem; padding: 1.1rem 1.4rem; background: var(--zemin-kart); }
.olcum--buyuk b { font-size: clamp(1.75rem, 1.4rem + 1.2vw, 2.5rem); font-family: var(--yazi-serif); font-weight: 500; letter-spacing: -0.01em; }
.alt__odeme img { height: 1.75rem; width: auto; opacity: 0.85; }
.goz { text-wrap: balance; }

/* ---------- abonelik sayfası ---------- */
.fiyat-hero { padding-block: clamp(2.5rem, 1.5rem + 3vw, 4.5rem) clamp(2rem, 1.5rem + 2vw, 3rem); }
.fiyat-hero .baslik-kume { max-width: 52rem; }
.fiyat-hero h1 { font-size: clamp(2.5rem, 1.6rem + 3.4vw, 4.25rem); }
.fiyat-hero__ozet { display: flex; flex-wrap: wrap; gap: 0.5rem 1.25rem; margin-top: var(--b-4); font-family: var(--yazi-mono); font-size: var(--t-mini); color: var(--murekkep-3); letter-spacing: 0.04em; }
.fiyat-hero__ozet li::before { content: "◆ "; color: var(--vurgu); font-size: 0.7em; vertical-align: 0.2em; }
.karsilastir { width: 100%; border-collapse: collapse; font-size: var(--t-kucuk); }
.karsilastir caption { text-align: left; font-family: var(--yazi-mono); font-size: var(--t-mini); letter-spacing: 0.1em; text-transform: uppercase; color: var(--murekkep-3); padding-bottom: 0.75rem; }
.karsilastir th, .karsilastir td { padding: 0.85rem 0.75rem; border-bottom: 1px solid var(--cizgi); text-align: left; vertical-align: top; }
.karsilastir thead th { font-family: var(--yazi-serif); font-size: 1.25rem; font-weight: 500; color: var(--murekkep); border-bottom: 1px solid var(--cizgi-2); }
.karsilastir tbody th { font-weight: 500; color: var(--murekkep); width: 32%; }
.karsilastir td { color: var(--murekkep-2); }
.karsilastir td.evet::before { content: "✓ "; color: var(--dogru); font-weight: 600; }
.karsilastir .one { background: color-mix(in srgb, var(--vurgu) 6%, transparent); }
.karsilastir-kaydir { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.karsilastir-kaydir table { min-width: 40rem; }
.araclar-liste { display: grid; gap: 0.75rem; }
@media (min-width: 700px) { .araclar-liste { grid-template-columns: repeat(2, 1fr); } }
.araclar-liste li { display: grid; grid-template-columns: auto 1fr; gap: 0.75rem; align-items: start; padding: 0.9rem 1rem; border: 1px solid var(--cizgi); border-radius: var(--r-2); background: var(--zemin-kart); color: var(--murekkep-2); font-size: var(--t-kucuk); line-height: 1.5; }
.araclar-liste li b { color: var(--murekkep); font-weight: 500; display: block; }
.araclar-liste li::before { content: "✓"; color: var(--dogru); font-weight: 600; font-family: var(--yazi-mono); }
.kurumsal-kutu { display: grid; gap: var(--b-4); padding: clamp(1.5rem, 1.2rem + 1.5vw, 2.5rem); border: 1px solid var(--cizgi); border-radius: var(--r-3); background: var(--zemin-kart); }
@media (min-width: 900px) { .kurumsal-kutu { grid-template-columns: 1fr auto; align-items: center; } }
.kurumsal-kutu h2 { font-size: var(--t-h3); }
.kurumsal-kutu p { color: var(--murekkep-2); max-width: 50rem; }
.uye-durum { display: inline-flex; align-items: center; gap: 0.6rem; padding: 0.5rem 0.85rem; border-radius: var(--r-tam); background: var(--dogru-zemin); color: var(--dogru); font-size: var(--t-kucuk); font-weight: 500; }