/* =====================================================
   Radyan Akademi — Ön Yüz Stilleri
   Glassmorphism, dark/light mode, hover animasyonları
   ===================================================== */
:root {
    --portal-primary: #4f46e5;
    --portal-primary-2: #7c3aed;
    --portal-gradient: linear-gradient(135deg, #4f46e5 0%, #7c3aed 100%);
    --glass-bg: rgba(255, 255, 255, .72);
    --glass-border: rgba(255, 255, 255, .45);
}
[data-bs-theme="dark"] {
    --glass-bg: rgba(30, 30, 46, .72);
    --glass-border: rgba(255, 255, 255, .08);
}

body { font-family: 'Segoe UI', system-ui, -apple-system, sans-serif; }

/* ---------- Header / Glass nav ---------- */
.glass-nav {
    background: var(--glass-bg);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border-bottom: 1px solid var(--glass-border);
}
.brand-badge {
    display: inline-flex; align-items: center; justify-content: center;
    width: 36px; height: 36px; border-radius: 10px;
    background: var(--portal-gradient); color: #fff;
}

/* ---------- Glassmorphism kartlar ---------- */
.glass-card {
    background: var(--glass-bg);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid var(--glass-border);
}

/* ---------- Butonlar ---------- */
.btn-primary {
    background: var(--portal-gradient); border: none;
}
.btn-primary:hover { filter: brightness(1.1); }
.btn-glow { box-shadow: 0 4px 18px rgba(var(--bs-primary-rgb, 79,70,229), .35); transition: .25s; }
.btn-glow:hover { box-shadow: 0 6px 26px rgba(var(--bs-primary-rgb, 79,70,229), .5); transform: translateY(-1px); }

/* ---------- Hero ---------- */
.hero-slide { position: relative; min-height: 520px; background-size: cover; background-position: center; display: flex; align-items: center; }
.hero-overlay { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(20,16,60,.82), rgba(20,16,60,.35)); }
.hero-content { position: relative; z-index: 2; padding: 80px 0; }

/* ---------- Kartlar / hover ---------- */
.hover-lift { transition: transform .25s ease, box-shadow .25s ease; }
.hover-lift:hover { transform: translateY(-6px); box-shadow: 0 14px 34px rgba(0,0,0,.14) !important; }
.course-cover { height: 180px; object-fit: cover; }
.course-card { border-radius: 1rem; overflow: hidden; }
.type-badge { background: var(--portal-gradient); color: #fff; }

/* ---------- Eğitmen ---------- */
.instructor-avatar { width: 72px; height: 72px; object-fit: cover; }
.instructor-avatar-lg { width: 190px; height: 190px; object-fit: cover; }
.instructor-avatar-xl { width: 220px; height: 220px; object-fit: cover; }

/* ---------- SSS / listeler ---------- */
.check-list { list-style: none; padding-left: 0; }
.check-list li { padding: 6px 0 6px 30px; position: relative; }
.check-list li::before { content: "✔"; color: #22c55e; position: absolute; left: 0; font-weight: 700; }

/* ---------- Skeleton loading ---------- */
.skeleton {
    background: linear-gradient(90deg, rgba(0,0,0,.06) 25%, rgba(0,0,0,.12) 50%, rgba(0,0,0,.06) 75%);
    background-size: 200% 100%; animation: shimmer 1.4s infinite; border-radius: .5rem;
}
@keyframes shimmer { to { background-position: -200% 0; } }

/* ---------- Footer ---------- */
.footer-portal { background: var(--glass-bg); backdrop-filter: blur(12px); border-top: 1px solid var(--glass-border); }
.footer-links a { color: inherit; text-decoration: none; opacity: .75; }
.footer-links a:hover { opacity: 1; color: var(--portal-primary); }

/* ---------- WhatsApp FAB ---------- */
.whatsapp-fab {
    position: fixed; bottom: 24px; right: 24px; z-index: 1050;
    width: 56px; height: 56px; border-radius: 50%;
    background: #25d366; color: #fff; display: flex; align-items: center; justify-content: center;
    font-size: 1.6rem; box-shadow: 0 6px 20px rgba(37,211,102,.45); transition: .25s;
}
.whatsapp-fab:hover { transform: scale(1.08); color: #fff; }

/* ---------- RTL desteği (Arapça) ---------- */
[dir="rtl"] .ms-1, [dir="rtl"] .me-1 { margin-left: .25rem !important; margin-right: 0 !important; }
[dir="rtl"] .me-2 { margin-left: .5rem !important; margin-right: 0 !important; }
[dir="rtl"] body { text-align: right; }
[dir="rtl"] .check-list li { padding: 6px 30px 6px 0; }
[dir="rtl"] .check-list li::before { left: auto; right: 0; }
[dir="rtl"] .whatsapp-fab { right: auto; left: 24px; }

/* ---------- Login ---------- */
.login-page { background: var(--portal-gradient); }

/* ---------- Admin yıldız seçici ---------- */
.star-btn { font-size: 1.3rem; padding: .15rem .6rem; }
.star-btn.active { background: #f59e0b; border-color: #f59e0b; color: #fff; }

@media (max-width: 767px) {
    .hero-slide { min-height: 380px; }
    .course-cover { height: 150px; }
}


/* ---------- Hero Slider (v2 — referans siteler tarzı) ---------- */
.hero-carousel .carousel-indicators { bottom: 22px; }
.hero-carousel .carousel-indicators button {
    width: 12px; height: 12px; border-radius: 50%;
    background: rgba(255,255,255,.55); border: none; transition: .25s;
}
.hero-carousel .carousel-indicators button.active { background: #fff; transform: scale(1.25); }

.hero-slide {
    min-height: 560px;
    background-size: cover; background-position: center right;
    display: flex; align-items: center; position: relative;
}
.hero-overlay {
    position: absolute; inset: 0;
    background: linear-gradient(90deg, rgba(23,18,68,.85) 0%, rgba(23,18,68,.45) 55%, rgba(23,18,68,.08) 100%);
}
/* Açık arka plan görselleri için ters geçiş */
.hero-overlay-light {
    background: linear-gradient(90deg, rgba(255,255,255,.88) 0%, rgba(255,255,255,.45) 55%, rgba(255,255,255,.05) 100%);
}
.hero-content { position: relative; z-index: 2; padding: 90px 0; }
.hero-title { color: #fff; animation: heroFadeUp .7s ease both; }
.hero-subtitle { color: rgba(255,255,255,.82); animation: heroFadeUp .7s .15s ease both; }
.hero-content .btn { animation: heroFadeUp .7s .3s ease both; }

/* Koyu metin modu */
.hero-dark-text .hero-title { color: #1e1b4b; }
.hero-dark-text .hero-subtitle { color: #3f3d63; }

.hero-arrow {
    display: inline-flex; align-items: center; justify-content: center;
    width: 48px; height: 48px; border-radius: 50%;
    background: rgba(255,255,255,.2); backdrop-filter: blur(8px);
    color: #fff; font-size: 1.3rem; transition: .25s;
}
.hero-arrow:hover { background: var(--portal-primary); }

@keyframes heroFadeUp {
    from { opacity: 0; transform: translateY(26px); }
    to   { opacity: 1; transform: translateY(0); }
}

@media (max-width: 767px) {
    .hero-slide { min-height: 420px; background-position: center; }
    .hero-content { padding: 60px 0; }
}


/* ---------- Hero animasyon varyasyonları ---------- */
.carousel-item.active .anim-fade-up    { animation: heroFadeUp .8s ease both; }
.carousel-item.active .anim-fade-left  { animation: heroFadeLeft .8s ease both; }
.carousel-item.active .anim-zoom       { animation: heroZoom .8s ease both; }
.carousel-item.active .anim-slide-up   { animation: heroSlideUp .8s ease both; }

@keyframes heroFadeLeft {
    from { opacity: 0; transform: translateX(-46px); }
    to   { opacity: 1; transform: translateX(0); }
}
@keyframes heroZoom {
    from { opacity: 0; transform: scale(.88); }
    to   { opacity: 1; transform: scale(1); }
}
@keyframes heroSlideUp {
    from { opacity: 0; transform: translateY(60px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* Slayt geçişinde arka plan hafif hareket etsin (Ken Burns etkisi) */
.hero-slide::before {
    content: ""; position: absolute; inset: 0; z-index: 0;
    background: inherit; animation: kenburns 16s ease-in-out infinite alternate;
}
.hero-slide > * { position: relative; z-index: 1; }
@keyframes kenburns {
    from { transform: scale(1); }
    to   { transform: scale(1.08); }
}


/* ---------- Tema renkleri (admin panelinden yönetilir) ---------- */
.text-primary { color: var(--portal-primary) !important; }
.bg-primary { background-color: var(--portal-primary) !important; }
.border-primary { border-color: var(--portal-primary) !important; }
.btn-outline-primary {
    color: var(--portal-primary); border-color: var(--portal-primary);
}
.btn-outline-primary:hover, .btn-outline-primary:active {
    background: var(--portal-primary); border-color: var(--portal-primary); color: #fff;
}
.form-check-input:checked {
    background-color: var(--portal-primary); border-color: var(--portal-primary);
}
.nav-tabs .nav-link.active { color: var(--portal-primary); border-bottom-color: var(--portal-primary); }
a { color: var(--portal-primary); }
a:hover { color: var(--portal-primary-2); }
.brand-logo { object-fit: contain; }




/* =====================================================
   NEDEN RADYAN AKADEMİ — dinamik bölüm
   ===================================================== */
.why-section {
    background: linear-gradient(160deg,
        color-mix(in srgb, var(--portal-primary) 6%, transparent) 0%,
        color-mix(in srgb, var(--portal-primary-2) 5%, transparent) 50%,
        color-mix(in srgb, var(--portal-primary) 6%, transparent) 100%);
}

/* Yüzen gradyan dekorasyon daireleri */
.why-blob {
    position: absolute; border-radius: 50%; filter: blur(70px);
    opacity: .35; pointer-events: none; z-index: 1;
    animation: blobFloat 12s ease-in-out infinite alternate;
}
.why-blob-1 {
    width: 340px; height: 340px; top: -90px; left: -90px;
    background: var(--portal-primary);
}
.why-blob-2 {
    width: 280px; height: 280px; bottom: -70px; right: -60px;
    background: #0d94a6; animation-delay: -4s;
}
.why-blob-3 {
    width: 200px; height: 200px; top: 40%; left: 45%;
    background: var(--portal-primary-2); animation-delay: -8s; opacity: .22;
}
@keyframes blobFloat {
    from { transform: translate(0, 0) scale(1); }
    to   { transform: translate(40px, -30px) scale(1.12); }
}

/* Gradyan metin */
.why-gradient-text {
    background: linear-gradient(120deg, var(--portal-primary), #0d94a6, var(--portal-primary-2));
    background-size: 200% auto;
    -webkit-background-clip: text; background-clip: text;
    -webkit-text-fill-color: transparent; color: transparent;
    animation: gradientShift 6s ease infinite;
}
@keyframes gradientShift {
    0%, 100% { background-position: 0% center; }
    50%      { background-position: 100% center; }
}

/* Üstte rozet */
.why-badge {
    display: inline-flex; align-items: center;
    background: var(--portal-gradient); color: #fff;
    padding: .4rem 1rem; border-radius: 2rem;
    font-size: .85rem; font-weight: 600;
    box-shadow: 0 4px 16px rgba(var(--bs-primary-rgb, 79,70,229), .3);
}

/* Madde listesi — ikonlu kartlar */
.why-list li {
    display: flex; gap: .9rem; align-items: flex-start;
    padding: .8rem 1rem; margin-bottom: .5rem;
    background: var(--glass-bg); backdrop-filter: blur(8px);
    border: 1px solid var(--glass-border); border-radius: 1rem;
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.why-list li:hover {
    transform: translateX(8px);
    box-shadow: 0 8px 24px rgba(var(--bs-primary-rgb, 79,70,229), .15);
    border-color: var(--portal-primary);
}
.why-icon {
    flex-shrink: 0;
    display: inline-flex; align-items: center; justify-content: center;
    width: 42px; height: 42px; border-radius: 12px;
    background: var(--portal-gradient); color: #fff; font-size: 1.1rem;
    box-shadow: 0 4px 12px rgba(var(--bs-primary-rgb, 79,70,229), .28);
    transition: transform .25s ease;
}
.why-list li:hover .why-icon { transform: scale(1.12) rotate(-6deg); }

/* İstatistik kartları v2 */
.stat-card-v2 {
    background: var(--glass-bg); backdrop-filter: blur(12px);
    border: 1px solid var(--glass-border); border-radius: 1.25rem;
    padding: 1.75rem 1rem 1.25rem;
    transition: transform .3s ease, box-shadow .3s ease;
    position: relative; overflow: hidden;
}
.stat-card-v2::before {
    content: ""; position: absolute; top: 0; left: 0; right: 0; height: 4px;
    background: var(--portal-gradient);
}
.stat-card-v2:hover {
    transform: translateY(-8px) scale(1.02);
    box-shadow: 0 16px 40px rgba(var(--bs-primary-rgb, 79,70,229), .2);
}
.stat-icon-v2 {
    display: inline-flex; align-items: center; justify-content: center;
    width: 52px; height: 52px; border-radius: 50%;
    background: var(--portal-gradient); color: #fff; font-size: 1.35rem;
    margin-bottom: .75rem;
    box-shadow: 0 6px 18px rgba(var(--bs-primary-rgb, 79,70,229), .3);
    animation: iconPulse 3s ease-in-out infinite;
}
@keyframes iconPulse {
    0%, 100% { box-shadow: 0 6px 18px rgba(var(--bs-primary-rgb, 79,70,229), .3); }
    50%      { box-shadow: 0 6px 26px rgba(var(--bs-link-hover-color-rgb, 124,58,237), .5); }
}

/* Mini ilerleme çubuğu */
.stat-bar {
    height: 5px; border-radius: 3px; margin-top: .9rem;
    background: color-mix(in srgb, var(--portal-primary) 12%, transparent); overflow: hidden;
}
.stat-bar-fill {
    height: 100%; width: 0;
    background: var(--portal-gradient); border-radius: 3px;
    transition: width 1.4s cubic-bezier(.22,.61,.36,1);
}
.stat-bar-fill.animate { width: var(--fill, 80%); }

/* Scroll ile sırayla beliren öğeler */
.reveal-item {
    opacity: 0; transform: translateY(28px);
    transition: opacity .6s ease, transform .6s cubic-bezier(.22,.61,.36,1);
}
.reveal-item.revealed { opacity: 1; transform: translateY(0); }

/* Dark mode uyumu */
[data-bs-theme="dark"] .why-section {
    background: linear-gradient(160deg,
        color-mix(in srgb, var(--portal-primary) 14%, transparent) 0%,
        color-mix(in srgb, var(--portal-primary-2) 10%, transparent) 50%,
        color-mix(in srgb, var(--portal-primary) 14%, transparent) 100%);
}


/* =====================================================
   SITE GENELİ — modern, canlı, dinamik tasarım katmanı
   (tema renkleri admin panelinden yönetilir)
   ===================================================== */

/* ---------- Tipografi & temel his ---------- */
body {
    background-attachment: fixed;
    transition: background-color .3s ease, color .3s ease;
}
::selection { background: var(--portal-primary); color: #fff; }

/* Scrollbar — marka renginde */
::-webkit-scrollbar { width: 10px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb {
    background: var(--portal-gradient); border-radius: 5px;
}

/* ---------- Header: scroll'da güçlenen cam efekt ---------- */
.navbar-portal { transition: box-shadow .3s ease, background .3s ease; }
.navbar-portal.scrolled {
    box-shadow: 0 6px 30px rgba(0,0,0,.12);
}
.nav-link {
    position: relative; font-weight: 500;
    transition: color .2s ease;
}
.nav-link::after {
    content: ""; position: absolute; left: 50%; bottom: 2px;
    width: 0; height: 2.5px; border-radius: 2px;
    background: var(--portal-gradient);
    transition: width .25s ease, left .25s ease;
}
.nav-link:hover::after, .nav-link.active::after { width: 70%; left: 15%; }
.nav-link:hover { color: var(--portal-primary) !important; }

/* Dropdown animasyonu */
.dropdown-menu {
    border: 1px solid var(--glass-border);
    border-radius: .9rem; box-shadow: 0 14px 40px rgba(0,0,0,.12);
    animation: dropIn .22s ease;
    background: var(--glass-bg); backdrop-filter: blur(16px);
}
@keyframes dropIn {
    from { opacity: 0; transform: translateY(-8px); }
    to   { opacity: 1; transform: translateY(0); }
}
.dropdown-item { border-radius: .5rem; margin: 0 .3rem; width: auto; transition: .18s; }
.dropdown-item:hover { background: var(--portal-primary); color: #fff; }

/* ---------- Genel section girişleri ---------- */
section { position: relative; }
.section-title-bar {
    width: 56px; height: 4px; border-radius: 2px;
    background: var(--portal-gradient); margin-bottom: .75rem;
}

/* ---------- Eğitim kartları — premium görünüm ---------- */
.course-card {
    transition: transform .3s cubic-bezier(.22,.61,.36,1), box-shadow .3s ease;
    overflow: hidden;
}
.course-card::after {
    content: ""; position: absolute; inset: 0;
    background: linear-gradient(135deg, transparent 60%, color-mix(in srgb, var(--portal-primary) 6%, transparent));
    opacity: 0; transition: opacity .3s ease; pointer-events: none;
}
.course-card:hover::after { opacity: 1; }
.course-card .course-cover {
    transition: transform .5s cubic-bezier(.22,.61,.36,1);
}
.course-card:hover .course-cover { transform: scale(1.06); }
.course-card .btn { position: relative; z-index: 2; }

/* ---------- "Tümünü Gör" butonları ---------- */
.btn-outline-primary, .btn-outline-warning, .btn-outline-success, .btn-outline-secondary {
    transition: all .25s ease;
}
.btn-outline-primary:hover { box-shadow: 0 6px 20px rgba(var(--bs-primary-rgb, 79,70,229), .3); transform: translateY(-2px); }

/* ---------- Sayfa başlıkları ---------- */
h1.fw-bold, h2.fw-bold {
    letter-spacing: -.02em;
}

/* ---------- Yaklaşan eğitim kartları ---------- */
.date-box {
    min-width: 68px; padding: .6rem .4rem;
    background: var(--portal-gradient); border-radius: 1rem;
    color: #fff;
}
.date-box .text-body-secondary { color: rgba(255,255,255,.85) !important; }
.date-box .text-primary { color: #fff !important; }

/* ---------- Eğitmen kartları ---------- */
.instructor-card { transition: transform .3s ease, box-shadow .3s ease; border-radius: 1.1rem; }
.instructor-avatar, .instructor-avatar-lg {
    border: 3px solid transparent;
    background: var(--portal-gradient) border-box;
    transition: transform .3s ease;
}
.instructor-card:hover .instructor-avatar,
.instructor-card:hover .instructor-avatar-lg { transform: scale(1.08); }

/* ---------- Yorumlar ---------- */
.testimonials-section {
    background: linear-gradient(160deg,
        color-mix(in srgb, var(--portal-primary) 6%, transparent),
        color-mix(in srgb, var(--portal-primary-2) 5%, transparent));
}

/* ---------- Yaklaşan Eğitimler bölümü (konsept renkli vurgu zemini) ---------- */
.upcoming-section {
    background:
        radial-gradient(640px 320px at 8% 0%,   color-mix(in srgb, var(--portal-primary) 10%, transparent),   transparent 70%),
        radial-gradient(640px 320px at 100% 100%, color-mix(in srgb, var(--portal-primary-2) 10%, transparent), transparent 70%),
        linear-gradient(160deg,
            color-mix(in srgb, var(--portal-primary) 7%, var(--bs-body-bg)),
            color-mix(in srgb, var(--portal-primary-2) 5%, var(--bs-body-bg)));
    border-top: 1px solid color-mix(in srgb, var(--portal-primary) 18%, transparent);
    border-bottom: 1px solid color-mix(in srgb, var(--portal-primary) 18%, transparent);
}

/* Başlıktaki takvim rozeti — tema renkli gradyan */
.upcoming-badge {
    display: inline-flex; align-items: center; justify-content: center;
    width: 46px; height: 46px; border-radius: 14px;
    background: var(--portal-gradient); color: #fff;
    font-size: 1.25rem;
    box-shadow: 0 8px 22px color-mix(in srgb, var(--portal-primary) 38%, transparent);
    vertical-align: middle;
    animation: iconPulse 3s ease-in-out infinite;
}

/* Kartlara sol kenarda ince vurgu çizgisi */
.upcoming-card {
    border-left: 4px solid var(--portal-primary);
    background: color-mix(in srgb, var(--bs-body-bg) 88%, transparent);
    transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}
.upcoming-card:hover { border-left-color: var(--portal-primary-2); }

/* ---------- En Çok Tercih Edilenler bölümü (aynı konsept vurgu zemini, ters yönlü) ---------- */
.preferred-section {
    background:
        radial-gradient(640px 320px at 100% 0%,   color-mix(in srgb, var(--portal-primary-2) 10%, transparent), transparent 70%),
        radial-gradient(640px 320px at 0% 100%,   color-mix(in srgb, var(--portal-primary) 10%, transparent),   transparent 70%),
        linear-gradient(200deg,
            color-mix(in srgb, var(--portal-primary-2) 6%, var(--bs-body-bg)),
            color-mix(in srgb, var(--portal-primary) 7%, var(--bs-body-bg)));
    border-top: 1px solid color-mix(in srgb, var(--portal-primary-2) 18%, transparent);
    border-bottom: 1px solid color-mix(in srgb, var(--portal-primary-2) 18%, transparent);
}

/* ---------- Footer ---------- */
.footer-portal { position: relative; overflow: hidden; }
.footer-portal::before {
    content: ""; position: absolute; top: 0; left: 0; right: 0; height: 3px;
    background: var(--portal-gradient);
}
.footer-links li { padding: 3px 0; }
.footer-links a { transition: padding-left .2s ease, color .2s ease; }
.footer-links a:hover { padding-left: 6px; }

/* ---------- WhatsApp butonu — nabız halkası ---------- */
.whatsapp-fab::after {
    content: ""; position: absolute; inset: -6px; border-radius: 50%;
    border: 2px solid #25d366; opacity: .6;
    animation: waPulse 2s ease-out infinite;
}
@keyframes waPulse {
    from { transform: scale(.9); opacity: .7; }
    to   { transform: scale(1.35); opacity: 0; }
}

/* ---------- Form elemanları ---------- */
.form-control, .form-select {
    border-radius: .7rem;
    transition: border-color .2s ease, box-shadow .2s ease;
}
.form-control:focus, .form-select:focus {
    border-color: var(--portal-primary);
    box-shadow: 0 0 0 .25rem rgba(var(--bs-primary-rgb, 79,70,229), .15);
}
.input-group-text { border-radius: .7rem 0 0 .7rem; }

/* ---------- Breadcrumb ---------- */
.breadcrumb-item a { color: var(--portal-primary); text-decoration: none; }
.breadcrumb-item a:hover { text-decoration: underline; }

/* ---------- Rozetler ---------- */
.badge { font-weight: 600; letter-spacing: .01em; }

/* ---------- Toast ---------- */
.toast { border-radius: .9rem; box-shadow: 0 10px 34px rgba(0,0,0,.18); }

/* ---------- Hero ok & göstergeleri güçlendir ---------- */
.hero-arrow { transition: .25s; border: 1px solid rgba(255,255,255,.3); }
.hero-arrow:hover { transform: scale(1.1); }

/* ---------- Zengin metin içeriği (CKEditor çıktısı) ---------- */
.rich-content { line-height: 1.75; }
.rich-content img { max-width: 100%; height: auto; border-radius: .75rem; }
.rich-content figure { margin: 1rem 0; }
.rich-content figcaption { text-align: center; font-size: .85rem; color: var(--bs-secondary-color); margin-top: .4rem; }
.rich-content a { color: var(--portal-primary); text-decoration: underline; }
.rich-content table { width: 100%; border-collapse: collapse; }
.rich-content table, .rich-content th, .rich-content td { border: 1px solid var(--bs-border-color); }
.rich-content th, .rich-content td { padding: .55rem .8rem; }
.rich-content th { background: color-mix(in srgb, var(--portal-primary) 8%, transparent); }
.rich-content blockquote {
    margin: 1rem 0; padding: .8rem 1.2rem;
    border-left: 4px solid var(--portal-primary);
    background: color-mix(in srgb, var(--portal-primary) 6%, transparent);
    border-radius: 0 .75rem .75rem 0; font-style: italic;
}

/* ---------- İndirim rozeti ---------- */
.discount-badge {
    font-size: .8rem;
    box-shadow: 0 4px 14px rgba(34, 197, 94, .4);
    animation: iconPulse 3s ease-in-out infinite;
}

/* =====================================================
   ULUSLARARASI SERTİFİKA PROGRAMLARI — vurgulu bölüm
   ===================================================== */
.intl-section {
    background:
        radial-gradient(720px 360px at 15% 0%, color-mix(in srgb, var(--portal-primary) 16%, transparent), transparent 70%),
        radial-gradient(720px 360px at 90% 100%, color-mix(in srgb, var(--portal-primary-2) 16%, transparent), transparent 70%),
        linear-gradient(155deg,
            color-mix(in srgb, var(--portal-primary) 12%, var(--bs-body-bg)),
            color-mix(in srgb, var(--portal-primary-2) 9%, var(--bs-body-bg)));
    border-top: 3px solid;
    border-bottom: 3px solid;
    border-image: var(--portal-gradient) 1;
}

/* Sağ üst köşede sabit "Uluslararası" kurdelesi */
.intl-ribbon {
    position: absolute; top: 18px; right: -38px; z-index: 3;
    transform: rotate(45deg);
    background: var(--portal-gradient); color: #fff;
    padding: .45rem 3rem;
    font-size: .8rem; font-weight: 700; letter-spacing: .04em;
    box-shadow: 0 8px 22px rgba(var(--bs-primary-rgb, 79,70,229), .45);
    animation: iconPulse 3.5s ease-in-out infinite;
}

.intl-title { letter-spacing: -.01em; }

/* Başlıkta tema renkli gradyan yazı efekti */
.intl-title-grad {
    background: var(--portal-gradient);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    -webkit-text-fill-color: transparent;
}

/* Başlık altındaki gradyan vurgu çizgisi */
.intl-underline {
    width: 110px; height: 5px; border-radius: 999px;
    background: var(--portal-gradient);
    box-shadow: 0 4px 14px rgba(var(--bs-primary-rgb, 79,70,229), .5);
}

.intl-subtitle { color: var(--portal-primary); font-weight: 500; }

.intl-badge {
    display: inline-flex; align-items: center; justify-content: center;
    width: 52px; height: 52px; border-radius: 16px;
    background: var(--portal-gradient); color: #fff;
    font-size: 1.5rem;
    box-shadow: 0 10px 26px rgba(var(--bs-primary-rgb, 79,70,229), .5);
    vertical-align: middle;
    animation: iconPulse 2.6s ease-in-out infinite;
}

/* Bölüm başlığındaki büyük rozet */
.intl-badge-lg {
    width: 84px; height: 84px; border-radius: 26px;
    font-size: 2.5rem;
    box-shadow: 0 18px 44px rgba(var(--bs-primary-rgb, 79,70,229), .55);
}

/* Kartlar: tema renkli çift katmanlı çerçeve + güçlü gölge */
.intl-card {
    border: 2px solid color-mix(in srgb, var(--portal-primary) 45%, transparent) !important;
    box-shadow: 0 12px 34px rgba(var(--bs-primary-rgb, 79,70,229), .18) !important;
    position: relative;
}
.intl-card::before {
    content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
    border-radius: inherit;
    background: linear-gradient(135deg,
        color-mix(in srgb, var(--portal-primary) 10%, transparent),
        transparent 45%);
}
.intl-card:hover {
    border-color: var(--portal-primary) !important;
    box-shadow: 0 20px 48px rgba(var(--bs-primary-rgb, 79,70,229), .32) !important;
}

.intl-flag-badge {
    background: var(--portal-gradient); color: #fff;
    font-size: .75rem; font-weight: 700;
    box-shadow: 0 6px 18px rgba(var(--bs-primary-rgb, 79,70,229), .5);
    z-index: 2;
}

.intl-cert-label {
    background: color-mix(in srgb, var(--portal-primary) 12%, transparent);
    color: var(--portal-primary);
    font-weight: 600;
}

/* ---------- Kategori vitrin karoları ---------- */
.category-tile {
    position: relative;
    transition: transform .3s ease, box-shadow .3s ease;
}
.category-icon {
    display: inline-flex; align-items: center; justify-content: center;
    width: 58px; height: 58px; border-radius: 18px;
    background: color-mix(in srgb, var(--portal-primary) 12%, transparent);
    color: var(--portal-primary); font-size: 1.6rem;
    transition: .3s ease;
}
.category-tile:hover .category-icon {
    background: var(--portal-gradient); color: #fff;
    transform: scale(1.1) rotate(-4deg);
    box-shadow: 0 10px 24px rgba(var(--bs-primary-rgb, 79,70,229), .4);
}
.category-go {
    position: absolute; top: 12px; right: 14px;
    color: var(--portal-primary); opacity: 0; transform: translateX(-6px);
    transition: .25s ease;
}
.category-tile:hover .category-go { opacity: 1; transform: translateX(0); }

/* ---------- Sayfa geçiş hissi ---------- */
main { animation: pageIn .4s ease; }
@keyframes pageIn {
    from { opacity: 0; transform: translateY(10px); }
    to   { opacity: 1; transform: translateY(0); }
}

/* ---------- Yukarı dön butonu ---------- */
.back-to-top {
    position: fixed;
    right: 22px;
    bottom: 96px;
    z-index: 1045;
    width: 46px;
    height: 46px;
    border: none;
    border-radius: 50%;
    background: var(--portal-gradient);
    color: #fff;
    font-size: 1.2rem;
    line-height: 1;
    box-shadow: 0 10px 26px rgba(0,0,0,.25);
    opacity: 0;
    visibility: hidden;
    transform: translateY(14px);
    transition: .3s ease;
}
.back-to-top.show { opacity: 1; visibility: visible; transform: translateY(0); }
.back-to-top:hover { transform: translateY(-3px) scale(1.06); }

/* ---------- Hareket azaltma tercihi ---------- */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
    }
}