/* Fiyat hesaplayıcı: üst şerit (temel.css .sayfa-ust) + lila bant içinde büyük kart; solda form, sağda koyu sonuç paneli */
.fy-ust-adimlar { list-style: none; margin: 0; padding: 0; display: grid; gap: .6rem; flex: none; width: 21rem; }
.fy-ust-adimlar li { display: grid; grid-template-columns: 36px 1fr; column-gap: .8rem; align-items: center; background: rgba(255, 255, 255, .08); border: 1px solid rgba(255, 255, 255, .14); border-radius: 14px; padding: .7rem .9rem; }
.fy-ust-adimlar span { grid-row: span 2; display: inline-flex; width: 36px; height: 36px; align-items: center; justify-content: center; border-radius: 999px; background: var(--sari); color: var(--patlican); font-weight: 700; }
.fy-ust-adimlar b { color: #fff; font-size: .98rem; }
.fy-ust-adimlar small { color: #d9cbe3; font-size: .8rem; }

.fy-bant { padding: 3rem 0 3.6rem; }
.fy-kart { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); background: #fff; border: 1px solid var(--kenar); border-radius: 28px; box-shadow: 0 18px 50px rgba(75, 20, 102, .12); overflow: clip; }
.fy-form-yer { padding: 2.2rem 2.4rem 1.2rem; min-width: 0; }
.fy-sonuc { background: var(--patlican); color: #e9def1; min-width: 0; }
.fy-sonuc-ic { position: sticky; top: 72px; padding: 2.2rem 2.2rem 2.4rem; }

/* Adım grupları: dolu mor numara dairesi */
.grup { border: 0 !important; padding: 0 !important; margin: 0 0 2.2rem !important; }
.grup legend { display: flex; align-items: center; gap: .7rem; padding: 0; margin-bottom: 1rem; font: 700 1.2rem/1.2 var(--sans); color: var(--murekkep); }
.grup-no { display: inline-flex; width: 32px; height: 32px; align-items: center; justify-content: center; border-radius: 999px; background: var(--mor); color: #fff; font: 700 .9rem/1 var(--sans); flex: none; }
.grup .alan-baslik { margin: 1.2rem 0 .5rem; font-weight: 600; font-size: .92rem; }
.grup > .sessiz.kucuk { margin: -.4rem 0 1rem; }

/* Paylaşım türü: hap yerine büyük kutular */
.format-kutular { display: grid; grid-template-columns: repeat(auto-fill, minmax(9.5rem, 1fr)); gap: .6rem; }
.format-kutular label { display: flex; }
.format-kutular span { flex: 1; display: flex !important; flex-direction: column; gap: .2rem; padding: .85rem .95rem !important; border-radius: 16px !important; font-weight: 600; font-size: .95rem !important; min-height: 72px; justify-content: center; }
.format-kutular small { font-weight: 400; font-size: .76rem; color: var(--gri); }

/* Sonuç paneli */
.fis { font-size: .9rem; }
.fis-baslik { margin: 0; font-size: .82rem; font-weight: 600; color: var(--sari); }
.fis-aralik { margin: .35rem 0 .2rem; color: #fff; font: 800 clamp(2rem, 1.4rem + 1.4vw, 2.6rem)/1.1 var(--sans); letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.fis-baglam { margin: 0 0 1.4rem; color: #cbb9d8; font-size: .9rem; }
.fis-alt-baslik { margin: 0 0 .3rem; padding-top: 1.1rem; border-top: 1px solid rgba(255, 255, 255, .14); font-size: .78rem; font-weight: 600; color: #cbb9d8; }
.fis-satirlar { list-style: none; margin: 0; padding: 0; }
.fis-satirlar li { display: grid; grid-template-columns: 1fr auto; gap: 0 .8rem; padding: .55rem 0; border-bottom: 1px solid rgba(255, 255, 255, .08); }
.fis-ad { font-weight: 600; color: #fff; }
.fis-acik { grid-column: 1 / -1; color: #bfaecd; font-size: .8rem; font-family: var(--mono); }
.fis-tutar { grid-row: 1; grid-column: 2; text-align: right; color: #fff; font-family: var(--mono); font-variant-numeric: tabular-nums; }
.fis-dip { margin: 1.1rem 0 0; color: #a99bb6; font-size: .76rem; line-height: 1.5; }
.fis-eylem { display: flex; flex-direction: column; align-items: stretch; gap: .4rem; margin-top: 1.5rem; }
.fis-eylem .dugme { justify-content: center; }
.fis-kopya { min-height: 44px; background: none; border: 0; color: #fff; font: 600 .9rem/1.2 var(--sans); text-decoration: underline; text-underline-offset: 3px; text-decoration-color: rgba(255, 255, 255, .4); cursor: pointer; }
.fis-kopya:hover { color: var(--sari); }

.ornek-not { margin: 0 0 1.6rem; }
/* Rakam alanları: hangi ekranda yazdığı */
.fiyat-form div.alan > label { display: block; font-size: .9rem; font-weight: 600; margin-bottom: .4rem; }
.fiyat-form div.alan > label .sessiz { font-weight: 400; }
.fiyat-nerede { margin-top: .3rem; font-size: .82rem; }
.fiyat-nerede summary { cursor: pointer; color: var(--mor); font-weight: 600; min-height: 32px; display: inline-flex; align-items: center; }
.fiyat-nerede ol { margin: .2rem 0 .3rem; padding-left: 1.2rem; color: var(--murekkep-2); line-height: 1.5; }
.fiyat-nerede p { margin: 0 0 .3rem; color: var(--gri); line-height: 1.5; }

/* Formül: beş adım kartı (parca-formul.php) */
.fy-formul-bas { max-width: 46rem; margin-bottom: 1.8rem; }
.fy-formul-bas h2 { margin: .2rem 0 .5rem; }
.fy-formul-bas .sessiz { margin: 0; font-size: 1.02rem; }
.fy-adimlar { list-style: none; margin: 0; padding: 0; display: grid; gap: 1rem; }
.fy-adim { display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 1.1rem; background: #fff; border: 1px solid var(--kenar); border-radius: var(--kose-buyuk); box-shadow: var(--golge); padding: 1.4rem 1.6rem; }
.fy-adim-no { display: inline-flex; width: 40px; height: 40px; align-items: center; justify-content: center; border-radius: 999px; background: var(--mor); color: #fff; font-weight: 700; }
.fy-adim h3 { margin: .35rem 0 .3rem; }
.fy-adim > div > p { margin: 0 0 .9rem; color: var(--murekkep-2); font-size: .95rem; }
.fy-kutu { background: var(--zemin-gri); border: 1px solid var(--kenar); border-radius: 14px; padding: .75rem .9rem; display: flex; flex-direction: column; gap: .3rem; }
.fy-kutu > small { font-size: .78rem; font-weight: 600; color: var(--mor-koyu); }
.fy-kutu .mono { font-weight: 500; font-size: .9rem; color: var(--murekkep); overflow-wrap: anywhere; }
.fy-iki { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); gap: .7rem; align-items: center; }
.fy-veya { font-size: .82rem; color: var(--gri); font-weight: 600; }
.fy-formatlar { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(10.5rem, 1fr)); gap: .6rem; }
.fy-formatlar li { background: var(--zemin-gri); border: 1px solid var(--kenar); border-radius: 14px; padding: .7rem .85rem; display: grid; gap: .15rem; }
.fy-formatlar span { font-size: .85rem; color: var(--murekkep-2); }
.fy-formatlar b { font-size: 1.15rem; font-weight: 600; color: var(--mor-koyu); }
.fy-formatlar small { font-size: .76rem; color: var(--gri); }
.fy-haplar { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .4rem; }
.fy-haplar li { font-size: .84rem; background: var(--mor-acik); color: var(--mor-koyu); border-radius: 999px; padding: .3rem .7rem; }
.fy-haplar b { font-weight: 700; }
.fy-not { margin: .8rem 0 0; font-size: .88rem; color: var(--murekkep-2); }
.fy-ekler { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .7rem; }
.fy-ek-acik { font-size: .82rem; color: var(--murekkep-2); margin-bottom: .2rem; }
.fy-ekler .fy-haplar li { background: #fff; border: 1px solid var(--kenar); }
.fy-aralik-kutu { display: inline-flex; }
.fy-aralik-kutu .mono { font-size: 1rem; }
.fy-aralik-kutu small { color: var(--gri); font-size: .8rem; }
.fy-terim-bolum { margin: 1.6rem 0 .8rem; }
.fy-terim-ic h3 { margin: 0 0 .7rem; }
.terimler { margin: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr)); gap: .6rem; }
.terimler div { background: #fff; border: 1px solid var(--kenar); border-radius: 14px; padding: .75rem .9rem; }
.terimler dt { font-weight: 700; color: var(--murekkep); margin-bottom: .15rem; }
.terimler dd { margin: 0; color: var(--murekkep-2); font-size: .88rem; }

/* Sorular: ana sayfadaki soru dili */
.fy-sss-bas .sessiz { margin: .6rem 0 1.2rem; max-width: 26rem; }
.sss-madde { border-bottom: 1px solid var(--cizgi); }
.sss-madde summary { cursor: pointer; padding: 1rem 2.2rem 1rem 0; font: 600 1.05rem/1.35 var(--sans); list-style: none; position: relative; min-height: 44px; color: var(--murekkep); }
.sss-madde summary::-webkit-details-marker { display: none; }
.sss-madde summary::after { content: '+'; position: absolute; right: .2rem; top: .85rem; font: 400 1.4rem/1 var(--sans); color: var(--mor); }
.sss-madde[open] summary::after { content: '−'; }
.sss-madde p { color: var(--murekkep-2); margin: 0 0 1.1rem; max-width: 42rem; }
.sss-tumu a { display: inline-flex; align-items: center; gap: .35rem; min-height: 44px; font-weight: 600; margin-top: .4rem; }