/* Ceepri — rehber sayfaları (rehber.php: /rehber, /rehber/{slug})
   yasal.css'in üstüne biner (aydınlık/karanlık jetonlar orada tanımlı): ek bileşenler (özet kutusu, notlar, adımlar, SSS, kartlar, CTA). */

/* ---------- Üst çubuk: gezinme ---------- */
.ys-ust__nav { display: none; margin-left: auto; margin-right: 1rem; }
@media (min-width: 560px) { .ys-ust__nav { display: flex; } }
.ys-ust__nav a { display: inline-flex; align-items: center; min-height: 38px; padding: 0 .85rem; border-radius: 999px; color: var(--govde); font: 500 .88rem/1 var(--f-metin); text-decoration: none; transition: color .2s, background-color .2s; }
.ys-ust__nav a:hover { color: var(--yazi); background: rgba(var(--ov), .05); }
.ys-ust__nav a[aria-current="page"] { color: var(--teal-2); background: rgba(var(--teal-rgb), .1); }
.ys-ust__in { gap: .75rem; }
.ys-btn--buyuk { min-height: 48px; padding: 0 1.5rem; font-size: .95rem; }

/* ---------- Gövde bileşenleri ---------- */
.rh-ozet { margin: 0 0 2.25rem; padding: 1.15rem 1.3rem; border: 1px solid rgba(var(--teal-rgb), .45); border-radius: 18px; background: linear-gradient(135deg, rgba(var(--teal-rgb), .13), rgba(var(--teal-rgb), .03)); color: var(--yazi); }
.rh-ozet__etiket { display: block; margin-bottom: .55rem; font: 600 .72rem/1 var(--f-metin); letter-spacing: .2em; text-transform: uppercase; color: var(--teal-2); }
.ys-metin .rh-ozet p { margin: 0; font-size: 1.02rem; line-height: 1.7; }

.rh-not { margin: 1.35rem 0; padding: 1rem 1.15rem; border: 1px solid var(--cizgi-2); border-left-width: 4px; border-radius: 4px 14px 14px 4px; background: rgba(var(--ov), .03); }
.rh-not > strong { display: block; margin-bottom: .35rem; font: 700 .95rem/1.4 var(--f-baslik); color: var(--yazi); }
.ys-metin .rh-not p { margin: 0; font-size: .96rem; line-height: 1.65; }
.rh-not--bilgi { border-left-color: var(--teal); background: rgba(var(--teal-rgb), .07); }
.rh-not--uyari { border-left-color: #ffbc00; background: rgba(255, 188, 0, .07); }
.rh-not--uyari > strong { color: var(--uyari-yazi); }

.ys-metin kbd { padding: .1rem .45rem; border-radius: 6px; border: 1px solid var(--cizgi-2); border-bottom-width: 2px; background: rgba(var(--ov), .06); color: var(--yazi); font: 500 .85em var(--f-kod); }
.ys-metin ul.ys-liste, .ys-metin ol.ys-liste { margin: 1rem 0 1.15rem; }
.ys-metin ol.rh-adim { margin-top: 1.1rem; gap: .85rem; }
.ys-metin ol.rh-adim > li { padding-top: .1rem; }
.ys-metin ol.rh-adim > li > strong { color: var(--yazi); }
.ys-metin .ys-tablo-sar { margin: 1.1rem 0 1.15rem; }
.ys-metin .ys-tablo code { font-size: .82em; }
.ys-tablo thead th { white-space: nowrap; }

/* ---------- SSS ---------- */
.rh-sss details { margin: 0 0 .6rem; border: 1px solid var(--cizgi-2); border-radius: 14px; background: rgba(var(--ov), .025); transition: border-color .2s, background-color .2s; }
.rh-sss details[open] { border-color: rgba(var(--teal-rgb), .5); background: rgba(var(--teal-rgb), .05); }
.rh-sss summary { position: relative; padding: .95rem 3rem .95rem 1.1rem; font: 600 .98rem/1.45 var(--f-baslik); color: var(--yazi); cursor: pointer; list-style: none; }
.rh-sss summary::-webkit-details-marker { display: none; }
.rh-sss summary::after { content: ""; position: absolute; right: 1.2rem; top: 50%; width: .5rem; height: .5rem; border-right: 2px solid var(--teal); border-bottom: 2px solid var(--teal); transform: translateY(-70%) rotate(45deg); transition: transform .25s var(--ease); }
.rh-sss details[open] summary::after { transform: translateY(-30%) rotate(-135deg); }
.ys-metin .rh-sss details > p { margin: 0; padding: 0 1.1rem 1.05rem; }

/* ---------- CTA ---------- */
.rh-cta { margin: 3.25rem 0 0; padding: clamp(1.4rem, 4vw, 2.3rem); display: grid; gap: .9rem; border: 1px solid rgba(var(--teal-rgb), .45); border-radius: 24px; background: radial-gradient(34rem 14rem at 100% 0%, rgba(var(--teal-rgb), .2), transparent 70%), linear-gradient(135deg, rgba(var(--teal-rgb), .1), var(--cta-son, rgba(10, 26, 48, .7))); }
:root:not([data-theme="dark"]) .rh-cta { --cta-son: rgba(255, 255, 255, .85); }
.rh-cta h2 { margin: 0; font: 700 clamp(1.35rem, 3.8vw, 1.9rem)/1.2 var(--f-baslik); letter-spacing: -.025em; color: var(--yazi); text-wrap: balance; }
.rh-cta p { margin: 0; max-width: 40rem; color: var(--govde); }
.rh-cta__btnler { display: flex; flex-wrap: wrap; gap: .65rem; margin-top: .35rem; }

/* ---------- Kart ızgarası (liste + ilgili rehberler) ---------- */
.rh-grup { margin-top: 3rem; }
.rh-grup h2 { margin: 0; font: 700 clamp(1.3rem, 3.6vw, 1.75rem)/1.25 var(--f-baslik); letter-spacing: -.025em; color: var(--yazi); }
.rh-grup__not { margin: .4rem 0 0; color: var(--soluk); }
.rh-grup .rh-kartlar { margin-top: 1.2rem; }
.rh-kartlar { display: grid; grid-template-columns: minmax(0, 1fr); gap: .9rem; }
@media (min-width: 720px) { .rh-kartlar { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 960px) { .rh-kartlar--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.rh-kart { display: grid; gap: .55rem; align-content: start; padding: 1.3rem 1.3rem 1.15rem; border: 1px solid var(--cizgi-2); border-radius: 20px; background: rgba(var(--ov), .03); color: var(--soluk); text-decoration: none; transition: border-color .25s, background-color .25s, transform .25s var(--ease); }
.rh-kart:hover { border-color: var(--teal); background: rgba(var(--teal-rgb), .07); transform: translateY(-2px); }
.rh-kart__etiket { font: 600 .7rem/1 var(--f-metin); letter-spacing: .18em; text-transform: uppercase; color: var(--teal-2); }
.rh-kart__baslik { font: 700 1.12rem/1.3 var(--f-baslik); letter-spacing: -.015em; color: var(--yazi); }
.rh-kart__ozet { font-size: .93rem; line-height: 1.6; }
.rh-kart__alt { margin-top: .25rem; font-size: .82rem; color: var(--soluk-2); }
.rh-kart__alt i { display: inline-block; margin-left: .25rem; font-style: normal; color: var(--ok-renk); transition: transform .25s var(--ease); }
.rh-kart:hover .rh-kart__alt i { transform: translateX(3px); }
.rh-yontem p { margin: .8rem 0 0; max-width: 46rem; }
.rh-yontem a { color: var(--teal-2); text-underline-offset: .18em; }
.rh-yontem a:hover { color: var(--link-hover); }

.rh-liste .ys-baslik { max-width: 54rem; }
.rh-liste .ys-lead { max-width: 46rem; }

@media print {
    .ys-ust__nav, .rh-cta, .rh-grup .rh-kartlar { display: none; }
    .rh-ozet, .rh-not { border-color: #999; background: none; color: #111; }
}