/* ---------- Genel ---------- */
html { scroll-behavior: smooth; }
h1:focus { outline: none; }
.font-baslik { font-family: Manrope, Arial, sans-serif; letter-spacing: -.035em; }
h1.font-baslik, h2.font-baslik { font-weight: 800; }
.eyebrow { font-size: .75rem; letter-spacing: .19em; text-transform: uppercase; font-weight: 800; color: #58b8ec; }

/* ---------- Butonlar ---------- */
.btn {
    display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
    padding: .7rem 1.4rem; border-radius: .4rem; font-weight: 700; font-size: .9rem;
    transition: all .2s ease; cursor: pointer; border: 1px solid transparent; white-space: nowrap;
}
.btn:disabled { opacity: .6; cursor: not-allowed; }
.btn-enerji { background: #35a8e1; color: #051d30; font-weight: 800; }
.btn-enerji:hover { background: #58b8ec; box-shadow: 0 10px 25px -10px rgba(53,168,225,.7); }
.btn-isik { background: #1974ae; color: #fff; }
.btn-isik:hover { background: #135f8f; }
.btn-cizgi { border-color: #7090a6; color: #fff; }
.btn-cizgi:hover { background: rgba(255,255,255,.1); border-color: #fff; }
.btn-koyu { background: #092742; color: #fff; }
.btn-koyu:hover { background: #0d4162; }
.btn-acik { background: #f1f5f9; color: #334155; border-color: #e2e8f0; }
.btn-acik:hover { background: #e2e8f0; }
.btn-tehlike { background: #fee2e2; color: #b91c1c; }
.btn-tehlike:hover { background: #fecaca; }
.btn-kucuk { padding: .4rem .8rem; font-size: .85rem; border-radius: .5rem; }

/* ---------- Form ---------- */
.lbl { display: block; font-size: .85rem; font-weight: 600; color: #334155; margin-bottom: .35rem; }
.inp {
    width: 100%; padding: .65rem .9rem; border: 1px solid #cbd5e1; border-radius: .6rem;
    background: #fff; font-size: .95rem; color: #0f172a; transition: border-color .15s, box-shadow .15s;
}
.inp:focus { outline: none; border-color: #35a8e1; box-shadow: 0 0 0 3px rgba(53,168,225,.2); }
textarea.inp { min-height: 120px; resize: vertical; }
.validation-message { color: #dc2626; font-size: .8rem; margin-top: .25rem; }
.invalid { border-color: #f87171 !important; }

/* ---------- Kart ---------- */
.kart { background: #fff; border: 1px solid #dce5eb; border-radius: .6rem; padding: 1.5rem; box-shadow: 0 10px 35px #08253d08; }

/* ---------- Hero: fiber ışık çizgileri ---------- */
.hero-bg {
    background:
        radial-gradient(circle at 80% 30%, #1a5273 0%, transparent 37%),
        linear-gradient(125deg, #061b2f, #0a3453 75%, #0c4264);
}
.sayfa-bas-bg { background: linear-gradient(120deg, #061c30, #0d4162); }
.vurgu-kutu { background: #e8f0f6; border-left: 4px solid #268bc1; padding: 1.6rem 1.9rem; border-radius: .25rem; font-weight: 700; color: #152b3d; }
.fiber-hatlar { position: absolute; inset: 0; overflow: hidden; pointer-events: none; }
.fiber-hatlar span {
    position: absolute; height: 2px; width: 40%; left: -40%;
    background: linear-gradient(90deg, transparent, #38d6f5, #fff, transparent);
    border-radius: 2px; opacity: .7; filter: drop-shadow(0 0 6px #38d6f5);
    animation: isik-akisi 6s linear infinite;
}
.fiber-hatlar span:nth-child(1) { top: 18%; animation-delay: 0s; }
.fiber-hatlar span:nth-child(2) { top: 34%; animation-delay: 1.6s; animation-duration: 7s; }
.fiber-hatlar span:nth-child(3) { top: 52%; animation-delay: 3.1s; }
.fiber-hatlar span:nth-child(4) { top: 68%; animation-delay: .8s; animation-duration: 8s; background: linear-gradient(90deg, transparent, #ffb547, #fff, transparent); filter: drop-shadow(0 0 6px #ff9a1f); }
.fiber-hatlar span:nth-child(5) { top: 84%; animation-delay: 4.2s; animation-duration: 6.5s; }
@keyframes isik-akisi { from { transform: translateX(0); } to { transform: translateX(350%); } }
@media (prefers-reduced-motion: reduce) { .fiber-hatlar span { animation: none; display: none; } }

.izgara {
    background-image: linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px),
                      linear-gradient(90deg, rgba(255,255,255,.05) 1px, transparent 1px);
    background-size: 48px 48px;
}

/* ---------- Admin tablo ---------- */
.tablo { width: 100%; border-collapse: collapse; font-size: .9rem; }
.tablo th { text-align: left; font-weight: 600; color: #64748b; font-size: .75rem; text-transform: uppercase; letter-spacing: .04em; padding: .75rem 1rem; border-bottom: 1px solid #e2e8f0; background: #f8fafc; }
.tablo td { padding: .75rem 1rem; border-bottom: 1px solid #f1f5f9; vertical-align: middle; }
.tablo tr:hover td { background: #f8fafc; }

.rozet { display: inline-block; padding: .15rem .55rem; border-radius: 999px; font-size: .72rem; font-weight: 600; }
.rozet-yesil { background: #dcfce7; color: #166534; }
.rozet-gri { background: #f1f5f9; color: #64748b; }
.rozet-turuncu { background: #ffedd5; color: #9a3412; }
.rozet-mavi { background: #e0f7fd; color: #036a87; }

/* Blazor hata çubuğu */
#blazor-error-ui {
    display: none; position: fixed; bottom: 0; left: 0; right: 0; z-index: 1000;
    background: #fef3c7; padding: .75rem 1.25rem; box-shadow: 0 -2px 8px rgba(0,0,0,.15);
}
#blazor-error-ui .dismiss { cursor: pointer; float: right; }

/* ---------- Zengin içerik (sayfalar, hizmet/ürün açıklaması ve editör) ---------- */
.icerik { color: #465b6c; line-height: 1.75; }
.icerik > *:first-child { margin-top: 0; }
.icerik p { margin: 0 0 1em; }
.icerik h2 { font-family: Manrope, Arial, sans-serif; letter-spacing: -.02em; font-size: 1.5em; font-weight: 800; color: #092742; margin: 1.6em 0 .6em; line-height: 1.25; }
.icerik h3 { font-family: Manrope, Arial, sans-serif; font-size: 1.2em; font-weight: 800; color: #092742; margin: 1.4em 0 .5em; }
.icerik h4 { font-weight: 800; color: #092742; margin: 1.2em 0 .4em; }
.icerik ul, .icerik ol { margin: 0 0 1.1em; padding-left: 1.4em; }
.icerik ul { list-style: disc; }
.icerik ol { list-style: decimal; }
.icerik li { margin: .3em 0; }
.icerik li::marker { color: #35a8e1; }
.icerik a { color: #1974ae; text-decoration: underline; text-underline-offset: 3px; }
.icerik strong, .icerik b { color: #092742; font-weight: 800; }
.icerik em, .icerik i { color: #30475b; }
.icerik blockquote { border-left: 4px solid #268bc1; background: #e8f0f6; padding: 1em 1.4em; margin: 1.2em 0; border-radius: .25rem; color: #152b3d; font-weight: 700; }
.icerik img { max-width: 100%; height: auto; border-radius: .75rem; margin: 1em 0; }
.icerik hr { border: 0; border-top: 1px solid #e2e8f0; margin: 2em 0; }
.icerik table { width: 100%; border-collapse: collapse; margin: 1em 0; font-size: .95em; }
.icerik th, .icerik td { border: 1px solid #e2e8f0; padding: .5em .75em; text-align: left; }
.icerik th { background: #f8fafc; font-weight: 600; }
[contenteditable].icerik:empty::before { content: "Yazmaya başlayın…"; color: #94a3b8; }

/* İçerikte kullanılabilecek hazır bloklar (editörün HTML sekmesinden):
   <div class="kart-grid"><div class="kart-oge"><span class="no">01</span><h3>Başlık</h3><p>Metin</p></div>…</div>
   <p class="not">Küçük dipnot</p>
   <ul class="tikli"><li>…</li></ul>                                                      */
.icerik .kart-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 1.1rem; margin: 1.6em 0; }
.icerik .kart-oge { background: #fff; border: 1px solid #dce5eb; border-radius: .6rem; padding: 1.5rem; box-shadow: 0 10px 35px #08253d08; }
.icerik .kart-oge h3 { margin: .5em 0 .4em; font-size: 1.05em; }
.icerik .kart-oge p { margin: 0; font-size: .92em; color: #637384; }
.icerik .no { color: #1974ae; font-size: .72rem; font-weight: 800; letter-spacing: .14em; }
.icerik .not { font-size: .85em; color: #637384; border-top: 1px solid #dce5eb; padding-top: 1em; margin-top: 2em; }
.icerik ul.tikli, ul.tikli { list-style: none; padding-left: 0; }
.icerik ul.tikli li, ul.tikli li { position: relative; padding-left: 1.8em; }
.icerik ul.tikli li::before, ul.tikli li::before { content: "✓"; position: absolute; left: 0; top: 0; color: #1974ae; font-weight: 800; }

/* Hesaplayıcılar */
.arac { background: #f4f7fa; border: 1px solid #dce5eb; border-radius: .6rem; padding: 1.6rem; margin: 1.6rem 0; }
.arac-sonuc { background: #fff; border: 1px solid #dce5eb; border-left: 4px solid #35a8e1; border-radius: .4rem; padding: 1rem 1.25rem; margin-top: 1.1rem; color: #152b3d; }
.arac-sonuc strong { color: #092742; font-size: 1.08em; }
.arac-uyari { font-size: .82rem; color: #637384; margin-top: .9rem; line-height: 1.6; }

/* ---------- Anasayfa slider ---------- */
.slayt { opacity: 0; visibility: hidden; transition: opacity .7s ease, visibility .7s; }
.slayt.aktif { opacity: 1; visibility: visible; }
.slayt .slayt-metin { transform: translateY(18px); transition: transform .8s cubic-bezier(.2,.7,.2,1) .1s; }
.slayt .slayt-gorsel { transform: translateX(24px) scale(.98); transition: transform .9s cubic-bezier(.2,.7,.2,1) .15s; }
.slayt.aktif .slayt-metin, .slayt.aktif .slayt-gorsel { transform: none; }
.slider-nokta { width: 10px; height: 10px; border-radius: 999px; background: rgba(255,255,255,.3); transition: all .3s; }
.slider-nokta:not(.aktif):hover { background: rgba(255,255,255,.6); }
.slider-nokta.aktif { width: 30px; background: #35a8e1; }
@media (prefers-reduced-motion: reduce) {
    .slayt, .slayt .slayt-metin, .slayt .slayt-gorsel { transition: none; transform: none; }
}