/**
 * KTC Public Design System
 * Professional institute visual language — navy, indigo, cyan, gold
 */

:root {
    --primary-color: #1d4ed8;
    --primary-dark: #1e3a8a;
    --primary-light: #3b82f6;
    --primary-lighter: #dbeafe;

    --secondary-color: #0b1220;
    --secondary-dark: #050814;
    --secondary-light: #1e293b;

    --accent-color: #f59e0b;
    --accent-light: #fbbf24;
    --accent-dark: #d97706;

    --electric-accent: #06b6d4;
    --electric-accent-light: #22d3ee;
    --indigo: #4338ca;

    --text-primary: #0B1F3A;
    --text-secondary: #334155;
    --text-muted: #334155;
    --text-light: #FFFFFF;
    --text-on-dark: #FFFFFF;
    --text-on-dark-muted: #DCE6F2;

    --bg-primary: #ffffff;
    --bg-secondary: #f4f7fb;
    --bg-tertiary: #e8eef6;
    --bg-dark: #0b1220;
    --bg-darker: #050814;
    --bg-navy: #0f1c3d;
    --bg-gradient-start: #0b1220;
    --bg-gradient-end: #1e3a8a;

    --border-color: #d7e0ec;
    --border-strong: #b6c5d8;
    --border-light: #eef2f7;
    --border-on-dark: rgba(255, 255, 255, 0.12);

    --success-color: #059669;
    --success-light: #d1fae5;
    --warning-color: #d97706;
    --warning-light: #fef3c7;
    --error-color: #dc2626;
    --error-light: #fee2e2;
    --info-color: #2563eb;
    --info-light: #dbeafe;

    --font-display: 'Inter', 'Manrope', 'Plus Jakarta Sans', system-ui, sans-serif;
    --font-family: 'Inter', 'Plus Jakarta Sans', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    --font-size-xs: 0.875rem;
    --font-size-sm: 0.9375rem;
    --font-size-base: 1rem;
    --font-size-lg: 1.1875rem;
    --font-size-xl: 1.3125rem;
    --font-size-2xl: 1.625rem;
    --font-size-3xl: 2.125rem;
    --font-size-4xl: 2.75rem;
    --font-size-5xl: 3.5rem;
    --font-size-6xl: 4.25rem;

    --line-height-tight: 1.15;
    --line-height-normal: 1.65;
    --line-height-relaxed: 1.8;

    --font-weight-light: 300;
    --font-weight-normal: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;
    --font-weight-extrabold: 800;

    --spacing-xs: 0.25rem;
    --spacing-sm: 0.5rem;
    --spacing-md: 1rem;
    --spacing-lg: 1.5rem;
    --spacing-xl: 2rem;
    --spacing-2xl: 3rem;
    --spacing-3xl: 4.5rem;
    --spacing-4xl: 6rem;

    --radius-sm: 0.5rem;
    --radius-md: 0.75rem;
    --radius-lg: 1rem;
    --radius-xl: 1.25rem;
    --radius-2xl: 1.5rem;
    --radius-full: 9999px;

    --shadow-sm: 0 1px 2px rgba(15, 23, 42, 0.06);
    --shadow-md: 0 8px 20px rgba(15, 23, 42, 0.08);
    --shadow-lg: 0 16px 40px rgba(15, 23, 42, 0.12);
    --shadow-xl: 0 24px 50px rgba(15, 23, 42, 0.16);
    --shadow-2xl: 0 30px 60px rgba(11, 18, 32, 0.28);
    --shadow-glow: 0 10px 30px rgba(6, 182, 212, 0.28);
    --shadow-accent: 0 10px 28px rgba(245, 158, 11, 0.32);

    --transition-fast: 150ms ease;
    --transition-base: 220ms ease;
    --transition-slow: 320ms ease;
    --transition-smooth: 400ms cubic-bezier(0.22, 1, 0.36, 1);

    --z-dropdown: 1000;
    --z-sticky: 1020;
    --z-fixed: 1030;
    --z-modal-backdrop: 1040;
    --z-modal: 1050;
    --z-popover: 1060;
    --z-tooltip: 1070;
}

/* ============================================
   Base
   ============================================ */
*,
*::before,
*::after {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    font-family: var(--font-family);
    font-size: var(--font-size-base);
    line-height: var(--line-height-normal);
    color: var(--text-primary);
    background-color: var(--bg-secondary);
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    overflow-x: hidden;
}

img {
    max-width: 100%;
    height: auto;
}

h1, h2, h3, h4, h5, h6 {
    font-family: var(--font-display);
    font-weight: var(--font-weight-extrabold);
    line-height: var(--line-height-tight);
    letter-spacing: -0.03em;
    margin-bottom: var(--spacing-md);
    color: var(--text-primary);
}

h1 { font-size: clamp(2rem, 4.5vw, var(--font-size-5xl)); }
h2 { font-size: clamp(1.65rem, 3vw, var(--font-size-3xl)); }
h3 { font-size: var(--font-size-2xl); }
h4 { font-size: var(--font-size-xl); }
h5 { font-size: var(--font-size-lg); font-weight: var(--font-weight-bold); }
h6 { font-size: var(--font-size-base); font-weight: var(--font-weight-bold); }

p {
    margin-bottom: var(--spacing-md);
    color: var(--text-secondary);
}

a {
    color: var(--primary-color);
    text-decoration: none;
    transition: color var(--transition-fast);
}

a:hover { color: var(--primary-dark); }

a:focus-visible,
button:focus-visible,
.btn:focus-visible,
.nav-link:focus-visible,
.form-control:focus-visible,
.form-select:focus-visible {
    outline: 3px solid var(--electric-accent);
    outline-offset: 2px;
}

/* ============================================
   Section rhythm
   ============================================ */
.section {
    padding: var(--spacing-3xl) 0;
    position: relative;
}

.section-header {
    text-align: center;
    margin-bottom: var(--spacing-2xl);
}

.section-header h2 { margin-bottom: var(--spacing-sm); }

.section-header p {
    color: var(--text-secondary);
    max-width: 680px;
    margin: 0 auto;
    font-size: var(--font-size-lg);
}

.section-kicker {
    display: inline-block;
    font-size: 0.8rem;
    font-weight: var(--font-weight-bold);
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--electric-accent);
    margin-bottom: var(--spacing-sm);
}

.section-light { background-color: var(--bg-primary); }

.section-secondary {
    background-color: var(--bg-secondary);
    background-image:
        linear-gradient(rgba(29, 78, 216, 0.035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(29, 78, 216, 0.035) 1px, transparent 1px);
    background-size: 36px 36px;
}

.section-dark,
.section-darker,
.section-gradient,
.section-gradient-webdev,
.section-gradient-contact,
.section-gradient-registration {
    background-color: var(--bg-dark);
    color: var(--text-on-dark);
    position: relative;
    overflow: hidden;
}

.section-darker { background-color: var(--bg-darker); }

.section-dark::before,
.section-darker::before,
.section-gradient::before,
.section-gradient-webdev::before,
.section-gradient-contact::before,
.section-gradient-registration::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
        radial-gradient(ellipse at 12% 20%, rgba(29, 78, 216, 0.28) 0%, transparent 46%),
        radial-gradient(ellipse at 88% 80%, rgba(6, 182, 212, 0.18) 0%, transparent 42%),
        linear-gradient(rgba(255, 255, 255, 0.035) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.035) 1px, transparent 1px);
    background-size: auto, auto, 48px 48px, 48px 48px;
    pointer-events: none;
}

.section-dark > *,
.section-darker > *,
.section-gradient > *,
.section-gradient-webdev > *,
.section-gradient-contact > *,
.section-gradient-registration > * {
    position: relative;
    z-index: 2;
}

.section-dark,
.section-darker,
.section-gradient,
.section-gradient-webdev,
.section-gradient-contact,
.section-gradient-registration,
.hero-enhanced,
.cta-band,
.bg-gradient,
.footer {
    color: #FFFFFF;
}

.section-dark h1, .section-dark h2, .section-dark h3, .section-dark h4, .section-dark h5, .section-dark h6,
.section-darker h1, .section-darker h2, .section-darker h3, .section-darker h4, .section-darker h5, .section-darker h6,
.section-gradient h1, .section-gradient h2, .section-gradient h3,
.section-gradient-webdev h1, .section-gradient-webdev h2,
.section-gradient-contact h1, .section-gradient-registration h1,
.hero-enhanced h1, .hero-enhanced h2, .hero-enhanced h3, .hero-enhanced h4,
.bg-gradient h1, .bg-gradient h2, .bg-gradient h3, .bg-gradient p,
.cta-band h2, .cta-band p,
.footer h5, .footer-heading {
    color: #FFFFFF;
}

.section-dark .card,
.section-darker .card,
.section-dark .course-card,
.section-dark .course-card-enhanced,
.section-dark .auth-card {
    background: #FFFFFF;
    color: #0B1F3A;
}

.section-dark .card h1,
.section-dark .card h2,
.section-dark .card h3,
.section-dark .card h4,
.section-dark .card h5,
.section-dark .card h6,
.section-darker .card h1,
.section-darker .card h2,
.section-darker .card h3,
.section-darker .card h4,
.section-darker .card h5,
.section-darker .card h6 {
    color: #0B1F3A;
}

.section-dark .card p,
.section-dark .card .card-text,
.section-darker .card p {
    color: #334155;
}

.section-dark p, .section-darker p, .section-gradient p,
.hero-enhanced p, .cta-band p,
.section-dark .section-header p,
.section-darker .section-header p,
.hero-enhanced .section-header p,
.section-dark .text-muted,
.hero-enhanced .text-muted,
.footer .text-muted {
    color: #DCE6F2;
}

.bg-white { background-color: var(--bg-primary) !important; }

.bg-gradient,
.cta-band {
    background:
        radial-gradient(circle at 80% 20%, rgba(6, 182, 212, 0.22), transparent 40%),
        linear-gradient(135deg, #071018 0%, #12306a 55%, #0b1220 100%);
    color: var(--text-on-dark);
}

.cta-band.scale-in,
.cta-band.fade-in,
.cta-band.slide-up {
    opacity: 1;
    transform: none;
}

.cta-frame {
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.14);
    border-radius: 1.35rem;
    padding: clamp(1.6rem, 4vw, 2.4rem);
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.25);
}

.cta-frame h2,
.cta-band h2 {
    color: #fff;
    font-weight: 800;
    font-size: clamp(1.5rem, 3vw, 2.15rem);
    margin-bottom: 0.75rem;
}

.cta-frame p,
.cta-band p {
    color: #DCE6F2;
    font-size: 1.05rem;
    line-height: 1.65;
    margin-bottom: 1.4rem;
}

.cta-band .hero-buttons a.btn {
    min-width: 180px;
    position: relative;
    z-index: 2;
}

/* ============================================
   Navbar — international institute header
   ============================================ */
.ktc-site-header {
    position: relative;
    top: auto;
    z-index: 1080;
    pointer-events: auto;
}

.ktc-navbar.navbar {
    padding: 0.45rem 0;
    background: #071018 !important;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    box-shadow: 0 10px 30px rgba(5, 8, 20, 0.35);
    z-index: 1080;
    pointer-events: auto;
}

.ktc-navbar.sticky-active {
    padding: 0.35rem 0;
    box-shadow: 0 14px 32px rgba(5, 8, 20, 0.45);
}

.ktc-navbar-inner {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    column-gap: 0.75rem;
    max-width: 1600px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 1.25rem;
    padding-right: 1.25rem;
}

.ktc-brand {
    display: flex;
    align-items: center;
    margin-right: 0;
    flex-shrink: 0;
    padding-top: 0.15rem;
    padding-bottom: 0.15rem;
}

.navbar-brand img,
.ktc-navbar-logo {
    height: 52px;
    width: auto;
    max-width: 180px;
    object-fit: contain;
    object-position: left center;
    display: block;
    flex-shrink: 0;
}

.ktc-navbar-collapse {
    align-items: center;
    min-width: 0;
}

.ktc-nav-links {
    flex-wrap: nowrap !important;
    align-items: center;
    column-gap: 0.1rem;
}

.ktc-nav-links .nav-item {
    flex-shrink: 0;
}

.ktc-nav-links .nav-link {
    font-weight: 600;
    font-size: 0.875rem;
    letter-spacing: 0.01em;
    line-height: 1.2;
    white-space: nowrap;
    color: #FFFFFF !important;
    padding: 0.45rem 0.55rem !important;
    border-radius: 0.5rem;
}

.ktc-nav-links .nav-link:hover,
.ktc-nav-links .nav-link.active {
    color: #ffffff !important;
    background: rgba(255, 255, 255, 0.1);
}

.ktc-navbar .nav-item.dropdown {
    position: relative;
}

.ktc-navbar .dropdown-menu.ktc-resources-menu {
    z-index: 1090;
    margin-top: 0.4rem;
    border: 0;
    border-radius: 0.75rem;
    padding: 0.4rem;
    box-shadow: 0 16px 40px rgba(5, 8, 20, 0.28);
}

.ktc-nav-actions {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    flex-wrap: nowrap;
    flex-shrink: 0;
    margin-left: 0.5rem;
}

.ktc-nav-toggle {
    border: 1px solid rgba(255,255,255,0.25);
    padding: 0.4rem 0.55rem;
    margin-left: auto;
}

.btn-ktc-login {
    background: transparent !important;
    color: #f8fafc !important;
    border: 2px solid rgba(255,255,255,0.55) !important;
    font-weight: 700;
    white-space: nowrap;
    padding: 0.42rem 0.9rem;
    cursor: pointer;
    pointer-events: auto;
    transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.btn-ktc-login:hover {
    background: #ffffff !important;
    color: #071018 !important;
    border-color: #ffffff !important;
}

.btn-ktc-apply {
    background: #f59e0b !important;
    color: #0b1220 !important;
    border: 2px solid #f59e0b !important;
    font-weight: 800;
    white-space: nowrap;
    padding: 0.42rem 0.95rem;
    cursor: pointer;
    pointer-events: auto;
}

.btn-ktc-apply:hover {
    background: #fbbf24 !important;
    border-color: #fbbf24 !important;
    color: #050814 !important;
}

.btn-ktc-ghost {
    background: transparent !important;
    color: #e2e8f0 !important;
    border: 1px solid rgba(255,255,255,0.25) !important;
}

@media (max-width: 1199.98px) {
    .ktc-navbar.navbar {
        padding: 0.4rem 0;
    }

    .ktc-navbar-inner {
        flex-wrap: wrap !important;
        padding-left: 1rem;
        padding-right: 1rem;
        column-gap: 0.5rem;
    }

    .navbar-brand img,
    .ktc-navbar-logo {
        height: 44px;
        max-width: 148px;
    }

    .ktc-navbar .navbar-collapse.ktc-navbar-collapse {
        flex-basis: 100%;
        width: 100%;
        margin-top: 0.35rem;
        padding: 0.5rem 0 0.4rem;
        border-top: 1px solid rgba(255, 255, 255, 0.1);
    }

    .ktc-navbar .ktc-nav-links {
        flex-direction: column !important;
        flex-wrap: nowrap !important;
        align-items: stretch !important;
        width: 100%;
        margin: 0;
        row-gap: 0.15rem;
    }

    .ktc-navbar .ktc-nav-links .nav-item,
    .ktc-navbar .ktc-nav-links .nav-link {
        width: 100%;
    }

    .ktc-navbar .ktc-nav-links .nav-link {
        min-height: 44px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        font-size: 0.95rem;
        padding: 0.7rem 0.85rem !important;
        border-radius: 0.6rem;
        white-space: nowrap;
    }

    .ktc-navbar .ktc-nav-actions {
        width: 100%;
        margin: 0.65rem 0 0.15rem;
        flex-wrap: wrap;
    }

    .ktc-navbar .ktc-nav-actions .btn {
        flex: 1 1 auto;
        min-height: 44px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }
}

@media (min-width: 1200px) {
    .ktc-navbar .navbar-collapse.ktc-navbar-collapse {
        display: flex !important;
        flex-wrap: nowrap;
        flex-basis: auto;
        align-items: center;
        min-width: 0;
    }

    .ktc-navbar .ktc-nav-links {
        flex-wrap: nowrap !important;
        flex-direction: row;
        align-items: center;
    }

    .ktc-navbar .dropdown-menu.ktc-resources-menu {
        position: absolute;
        inset: auto auto auto 0;
        max-width: min(22rem, calc(100vw - 1.5rem));
    }

    .ktc-navbar .dropdown-menu-end.ktc-resources-menu {
        inset: auto 0 auto auto;
        left: auto;
        right: 0;
    }
}

@media (max-width: 400px) {
    .navbar-brand img,
    .ktc-navbar-logo {
        height: 40px;
        max-width: 132px;
    }

    .ktc-navbar-inner {
        padding-left: 0.75rem;
        padding-right: 0.75rem;
    }
}

.ktc-journey-steps {
    list-style: none;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
    gap: 1rem;
    margin: 0 0 1.5rem;
}

.ktc-journey-steps li {
    display: flex;
    gap: 0.85rem;
    background: #fff;
    border: 1px solid var(--border-color);
    border-radius: 1rem;
    padding: 1rem 1.1rem;
}

.ktc-journey-steps span {
    flex-shrink: 0;
    width: 2rem;
    height: 2rem;
    border-radius: 50%;
    background: #1d4ed8;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 800;
}

.ktc-journey-note {
    background: #0b1220;
    color: #e2e8f0;
    border-radius: 1rem;
    padding: 1.35rem 1.5rem;
}

.ktc-journey-note p { color: #e2e8f0; }

.brand-text {
    background: linear-gradient(135deg, var(--primary-color), var(--electric-accent));
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

.ktc-navbar .navbar-toggler:focus {
    box-shadow: 0 0 0 3px rgba(6, 182, 212, 0.25);
}

/* ============================================
   Hero
   ============================================ */
.hero,
.hero-enhanced {
    background:
        radial-gradient(ellipse at 18% 20%, rgba(37, 99, 235, 0.38) 0%, transparent 42%),
        radial-gradient(ellipse at 86% 10%, rgba(6, 182, 212, 0.22) 0%, transparent 36%),
        radial-gradient(ellipse at 70% 90%, rgba(245, 158, 11, 0.12) 0%, transparent 40%),
        linear-gradient(160deg, #050814 0%, #0b1220 42%, #12306a 100%);
    color: var(--text-on-dark);
    padding: clamp(3rem, 6vw, 4.75rem) 0;
    text-align: center;
    position: relative;
    overflow: hidden;
}

.hero-enhanced::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(rgba(255, 255, 255, 0.04) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255, 255, 255, 0.04) 1px, transparent 1px);
    background-size: 52px 52px;
    mask-image: radial-gradient(ellipse at center, black 40%, transparent 80%);
    pointer-events: none;
}

.hero-enhanced::after {
    content: '';
    position: absolute;
    width: 420px;
    height: 420px;
    right: -80px;
    top: -80px;
    border: 1px solid rgba(34, 211, 238, 0.18);
    border-radius: 40% 60% 55% 45%;
    pointer-events: none;
}

.hero-orbs,
.hero-deco {
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 1;
}

.hero-orb {
    position: absolute;
    border-radius: 50%;
    filter: blur(8px);
    opacity: 0.55;
}

.hero-orb-1 {
    width: 180px;
    height: 180px;
    left: 6%;
    bottom: 12%;
    background: rgba(37, 99, 235, 0.35);
}

.hero-orb-2 {
    width: 110px;
    height: 110px;
    right: 12%;
    bottom: 22%;
    background: rgba(6, 182, 212, 0.32);
}

.hero-enhanced .container,
.hero-enhanced .row,
.hero-copy {
    position: relative;
    z-index: 3;
}

.hero-copy {
    max-width: 760px;
    margin: 0 auto;
    padding: 0 0.75rem;
}

.hero h1,
.hero-enhanced h1,
.hero-enhanced h1.display-4 {
    color: #fff;
    font-weight: 800;
    letter-spacing: -0.03em;
    line-height: 1.15;
    margin: 0 auto 0.85rem;
    max-width: 18ch;
    font-size: clamp(2rem, 4.6vw, 3.5rem);
    text-shadow: 0 10px 40px rgba(0, 0, 0, 0.35);
}

.hero-lead {
    color: rgba(248, 250, 252, 0.92) !important;
    font-size: clamp(1.05rem, 1.8vw, 1.25rem);
    font-weight: 600;
    line-height: 1.5;
    margin: 0 auto 0.85rem;
}

.hero-subtitle {
    color: rgba(226, 232, 240, 0.88) !important;
    font-size: clamp(1rem, 1.5vw, 1.125rem);
    font-weight: 400;
    max-width: 640px;
    margin: 0 auto 1.35rem;
    line-height: 1.7;
}

.hero-pills {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.5rem;
    margin: 0 auto 1.6rem;
    max-width: 680px;
    padding: 0.85rem;
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 1.15rem;
    background: rgba(255, 255, 255, 0.05);
}

.hero-pill {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: 0.4rem 0.85rem;
    border-radius: 999px;
    border: 1px solid rgba(255, 255, 255, 0.16);
    background: rgba(255, 255, 255, 0.06);
    color: #fff;
    font-size: 0.85rem;
    font-weight: 600;
}

.hero-buttons {
    display: flex;
    gap: 0.9rem;
    justify-content: center;
    align-items: stretch;
    flex-wrap: wrap;
    position: relative;
    z-index: 6;
}

.hero-buttons a.btn {
    pointer-events: auto;
    position: relative;
    z-index: 7;
    min-height: 52px;
    padding: 0.9rem 1.6rem;
    font-weight: 700;
}

/* ============================================
   Buttons
   ============================================ */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.85rem 1.6rem;
    font-size: 1rem;
    font-weight: 700;
    font-family: var(--font-family);
    border-radius: 0.85rem;
    border: 2px solid transparent;
    cursor: pointer;
    transition: transform var(--transition-base), box-shadow var(--transition-base), background var(--transition-base), color var(--transition-base), border-color var(--transition-base);
    line-height: 1.2;
    text-decoration: none;
}

a.btn.btn-primary,
a.btn.btn-hero-primary,
.btn-primary,
.btn-hero-primary {
    --bs-btn-bg: #1d4ed8;
    --bs-btn-border-color: #1e40af;
    --bs-btn-color: #fff;
    --bs-btn-hover-bg: #1e3a8a;
    --bs-btn-hover-border-color: #1e3a8a;
    --bs-btn-hover-color: #fff;
    background-color: #1d4ed8;
    background-image: linear-gradient(180deg, #3b82f6 0%, #1d4ed8 100%);
    color: #fff !important;
    border: 2px solid #1e40af;
    box-shadow: 0 10px 22px rgba(29, 78, 216, 0.32);
}

a.btn.btn-primary:hover,
a.btn.btn-hero-primary:hover,
.btn-primary:hover,
.btn-hero-primary:hover {
    transform: translateY(-2px);
    box-shadow: 0 16px 28px rgba(29, 78, 216, 0.4);
    color: #fff !important;
    background-color: #1e3a8a;
    background-image: linear-gradient(180deg, #2563eb 0%, #1e3a8a 100%);
}

a.btn.btn-warning,
a.btn.btn-hero-cta,
a.btn.btn-accent,
.btn-warning,
.btn-accent,
.btn-hero-cta,
.btn-hero-secondary {
    --bs-btn-bg: #f59e0b;
    --bs-btn-border-color: #d97706;
    --bs-btn-color: #111827;
    --bs-btn-hover-bg: #d97706;
    --bs-btn-hover-color: #fff;
    background-color: #f59e0b;
    background-image: linear-gradient(180deg, #fbbf24 0%, #d97706 100%);
    color: #111827 !important;
    border: 2px solid #d97706;
    box-shadow: var(--shadow-accent);
}

a.btn.btn-warning:hover,
a.btn.btn-hero-cta:hover,
.btn-warning:hover,
.btn-accent:hover,
.btn-hero-cta:hover,
.btn-hero-secondary:hover {
    transform: translateY(-2px);
    background-color: #d97706;
    background-image: linear-gradient(180deg, #f59e0b 0%, #b45309 100%);
    color: #fff !important;
}

a.btn.btn-success:hover,
.btn-success:hover {
    background-color: #0e7468;
    color: #fff !important;
    transform: translateY(-2px);
}

.btn-outline-white {
    background: rgba(255, 255, 255, 0.08);
    border: 2px solid #fff;
    color: #fff !important;
}

.btn-outline-white:hover {
    background: #fff;
    color: var(--bg-dark) !important;
    transform: translateY(-2px);
}

.btn-secondary,
.btn-outline-primary {
    background: #fff;
    border: 2px solid var(--primary-color);
    color: var(--primary-dark) !important;
}

.btn-secondary:hover,
.btn-outline-primary:hover {
    background: var(--primary-color);
    color: #fff !important;
    transform: translateY(-2px);
}

.btn-success {
    background: #128c7e;
    border-color: #0e7468;
    color: #fff !important;
}

.btn-success:hover {
    background: #0e7468;
    color: #fff !important;
    transform: translateY(-2px);
}

.btn-lg { padding: 1rem 2rem; font-size: 1.1rem; }
.btn-sm { padding: 0.5rem 1rem; font-size: 0.875rem; }

.btn-danger:hover {
    background-color: #dc2626;
    border-color: #dc2626;
}

/* ============================================
   Cards
   ============================================ */
.card {
    border: 1px solid var(--border-color);
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-sm);
    background: #fff;
    overflow: hidden;
    transition: transform var(--transition-base), box-shadow var(--transition-base), border-color var(--transition-base);
}

.card:hover {
    transform: translateY(-4px);
    box-shadow: var(--shadow-lg);
    border-color: #93c5fd;
}

.card-header {
    background: #fff;
    border-bottom: 1px solid var(--border-color);
    padding: var(--spacing-lg);
    font-weight: 700;
}

.card-body { padding: 1.35rem; }
.card-footer {
    background: var(--bg-secondary);
    border-top: 1px solid var(--border-color);
    padding: var(--spacing-lg);
}

.card-title { font-weight: 700; margin-bottom: var(--spacing-sm); }
.card-text { color: var(--text-secondary); }

.auth-card {
    border: 1px solid var(--border-strong);
    box-shadow: var(--shadow-xl);
    border-radius: var(--radius-2xl);
}

/* Course cards */
.course-card,
.course-card-enhanced {
    background: #fff;
    border: 1.5px solid var(--border-color);
    border-radius: var(--radius-2xl);
    overflow: hidden;
    height: 100%;
    display: flex;
    flex-direction: column;
    box-shadow: var(--shadow-md);
    transition: transform var(--transition-base), box-shadow var(--transition-base), border-color var(--transition-base);
}

.course-card:hover,
.course-card-enhanced:hover {
    transform: translateY(-6px);
    box-shadow: var(--shadow-xl);
    border-color: var(--electric-accent);
}

.course-image,
.course-card-enhanced .course-image,
.about-image-card .card-img-top {
    display: block;
    width: 100%;
    height: auto;
    object-fit: contain;
    background: linear-gradient(180deg, #eef4ff, #f8fafc);
}

.course-body,
.course-content {
    padding: 1.35rem 1.4rem 1.5rem;
    flex: 1;
    display: flex;
    flex-direction: column;
}

.course-title {
    font-size: 1.2rem;
    font-weight: 800;
    margin-bottom: 0.6rem;
    color: var(--text-primary);
}

.course-description {
    color: var(--text-secondary);
    font-size: 1rem;
    margin-bottom: 1rem;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.course-meta {
    display: flex;
    gap: 0.85rem;
    flex-wrap: wrap;
    margin-bottom: 0.85rem;
    font-size: 0.9rem;
    color: var(--text-muted);
}

.course-meta i,
.course-meta-item i { color: var(--primary-color); }

.course-meta-item {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
}

.course-price {
    font-size: 1.5rem;
    font-weight: 800;
    color: var(--primary-dark);
    margin-bottom: 0.75rem;
}

.course-features {
    list-style: none;
    padding: 0;
    margin: 0 0 1rem;
}

.course-features li {
    padding: 0.2rem 0;
    font-size: 0.92rem;
    color: var(--text-secondary);
    display: flex;
    align-items: center;
    gap: 0.4rem;
}

.course-features li i { color: var(--success-color); }

.course-actions {
    margin-top: auto;
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.course-actions .btn {
    flex: 1;
    min-width: 110px;
}

.course-badge {
    position: absolute;
    top: 0.9rem;
    right: 0.9rem;
    background: var(--accent-color);
    color: #1c1917;
    padding: 0.3rem 0.7rem;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 800;
    z-index: 2;
}

.about-image-card {
    border: 1px solid var(--border-color);
    border-radius: 1.25rem;
    overflow: hidden;
    box-shadow: var(--shadow-lg);
    background: var(--bg-tertiary);
}

/* Feature / trust / process */
.trust-strip {
    background: #fff;
    padding: 2rem 0;
    border-bottom: 1px solid var(--border-color);
    box-shadow: inset 0 8px 24px rgba(15, 23, 42, 0.03);
}

.trust-item { text-align: center; padding: 0.75rem; }

.trust-icon,
.feature-icon-wrapper,
.info-card-icon {
    width: 64px;
    height: 64px;
    margin: 0 auto 0.85rem;
    border-radius: 1rem;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient(135deg, #dbeafe, #67e8f9);
    color: var(--primary-dark);
    font-size: 1.6rem;
}

.feature-icon-wrapper {
    width: 76px;
    height: 76px;
    background: linear-gradient(145deg, #1d4ed8, #06b6d4);
    color: #fff;
    font-size: 1.85rem;
}

.trust-item h6 { margin-bottom: 0.2rem; color: #0B1F3A; }
.trust-item p { margin: 0; font-size: 0.95rem; color: #334155; }

.feature-card,
.benefit-card,
.process-card {
    background: #fff;
    border: 1.5px solid var(--border-color);
    border-radius: var(--radius-2xl);
    padding: 1.6rem;
    text-align: center;
    height: 100%;
    box-shadow: var(--shadow-sm);
    transition: transform var(--transition-base), box-shadow var(--transition-base), border-color var(--transition-base);
}

.feature-card:hover,
.benefit-card:hover,
.process-card:hover {
    transform: translateY(-5px);
    box-shadow: var(--shadow-lg);
    border-color: #7dd3fc;
}

.feature-card h5,
.benefit-card h5,
.process-card h5 {
    margin-bottom: 0.5rem;
}

.feature-card p,
.benefit-card p,
.process-card p {
    margin-bottom: 0;
    font-size: 0.95rem;
}

.section-dark .feature-card,
.section-darker .feature-card,
.section-dark .benefit-card,
.section-dark .info-card,
.section-dark .process-card,
.section-dark .review-card,
.section-dark .mentor-card {
    background: #FFFFFF;
    border: 1px solid #D7E0EC;
    box-shadow: 0 12px 28px rgba(5, 8, 20, 0.22);
    color: #0B1F3A;
}

.section-dark .feature-card h5,
.section-dark .benefit-card h5,
.section-dark .process-card h5,
.section-dark .info-card h5,
.section-dark .feature-card h4,
.section-dark .review-card h5,
.section-dark .mentor-card h4,
.section-dark .mentor-card h5 {
    color: #0B1F3A;
}

.section-dark .feature-card p,
.section-dark .benefit-card p,
.section-dark .process-card p,
.section-dark .info-card p,
.section-dark .review-card p,
.section-dark .mentor-card p {
    color: #334155;
}

.process-number {
    width: 56px;
    height: 56px;
    margin: 0 auto 1rem;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.15rem;
    font-weight: 800;
    color: #fff;
    background: linear-gradient(145deg, #2563eb, #0f172a);
    box-shadow: 0 8px 18px rgba(29, 78, 216, 0.35);
}

.process-icon {
    font-size: 1.6rem;
    color: var(--electric-accent);
    margin-top: 0.85rem;
}

.info-card {
    background: #fff;
    border: 1.5px solid var(--border-color);
    border-radius: var(--radius-2xl);
    padding: 1.6rem;
    display: flex;
    align-items: flex-start;
    gap: 1.1rem;
    box-shadow: var(--shadow-sm);
}

.info-card-icon { margin: 0; flex-shrink: 0; }
.info-icon { font-size: 2.6rem; color: var(--primary-color); margin-bottom: 0.75rem; display: block; }
.benefit-icon { font-size: 2.2rem; color: var(--primary-color); margin-bottom: 0.75rem; }

.info-list { list-style: none; padding: 0; margin: 0; }
.info-list li { padding: 0.4rem 0; }
.info-item {
    text-align: center;
    padding: 1rem;
    border-radius: var(--radius-lg);
    background: var(--bg-tertiary);
}
.info-item i { font-size: 1.7rem; color: var(--primary-color); display: block; margin-bottom: 0.4rem; }

.contact-method-card {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
    padding: 1.15rem 1.2rem;
    border: 1.5px solid var(--border-color);
    border-radius: 1.1rem;
    background: #fff;
    margin-bottom: 0.9rem;
    transition: border-color var(--transition-base), transform var(--transition-base);
}

.contact-method-card:hover {
    border-color: var(--electric-accent);
    transform: translateY(-2px);
}

.contact-method-card i {
    font-size: 1.5rem;
    color: var(--primary-color);
}

.enroll-panel {
    border: 1.5px solid var(--border-strong);
    border-radius: var(--radius-2xl);
    box-shadow: var(--shadow-xl);
    overflow: hidden;
}

.enroll-panel .price-display {
    font-size: 2rem;
    font-weight: 800;
    color: var(--primary-dark);
}

.ktc-demo-banner {
    background: linear-gradient(135deg, #0B1F3A 0%, #12306a 55%, #0b1220 100%);
    color: #FFFFFF;
    border-radius: 1.35rem;
    padding: clamp(1.4rem, 3.5vw, 2.2rem);
    border: 1px solid rgba(255, 255, 255, 0.12);
    box-shadow: 0 16px 40px rgba(11, 18, 32, 0.18);
}

.ktc-demo-kicker {
    display: inline-block;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    font-size: 0.75rem;
    font-weight: 700;
    color: #FBBF24;
    margin-bottom: 0.45rem;
}

.ktc-demo-banner h2 {
    color: #FFFFFF;
    font-size: clamp(1.4rem, 2.6vw, 2rem);
    margin-bottom: 0.6rem;
}

.ktc-demo-banner p {
    color: #DCE6F2;
    font-size: 1.05rem;
    margin-bottom: 0;
    max-width: 38rem;
}

.btn-ktc-demo {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    background: #F59E0B;
    color: #0B1F3A !important;
    font-weight: 800;
    font-size: 1.05rem;
    border: 2px solid #D97706;
    border-radius: 999px;
    padding: 0.85rem 1.4rem;
    box-shadow: 0 10px 24px rgba(245, 158, 11, 0.28);
    transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}

.btn-ktc-demo:hover {
    background: #FBBF24;
    color: #0B1F3A !important;
    transform: translateY(-2px);
    box-shadow: 0 14px 28px rgba(245, 158, 11, 0.38);
}

@media (max-width: 768px) {
    .ktc-demo-banner .btn-ktc-demo {
        width: 100%;
        margin-top: 0.75rem;
    }
}

/* Steps */
.step-item {
    position: relative;
    padding-left: 2.4rem;
    margin-bottom: 1.6rem;
}

.step-item::before {
    content: '';
    position: absolute;
    left: 10px;
    top: 28px;
    bottom: -16px;
    width: 2px;
    background: linear-gradient(to bottom, var(--electric-accent), transparent);
}

.step-item:last-child::before { display: none; }

.step-number {
    position: absolute;
    left: 0;
    top: 0;
    width: 22px;
    height: 22px;
    background: var(--primary-color);
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.75rem;
    font-weight: 800;
}

.section-dark .step-item h5 { color: #fff; }
.section-dark .step-item p { color: var(--text-on-dark-muted); }

/* Leadership / reviews / mentors */
.leadership-section { background: var(--bg-secondary); }

.leadership-card {
    background: #fff;
    border-radius: var(--radius-2xl);
    overflow: hidden;
    box-shadow: var(--shadow-xl);
    border: 1px solid var(--border-color);
}

.leadership-image,
.mentor-image {
    width: 100%;
    height: auto;
    object-fit: contain;
    object-position: top;
    background: var(--bg-tertiary);
}

.leadership-content,
.mentor-content { padding: 1.6rem; }
.leadership-position,
.mentor-expertise { color: var(--primary-color); font-weight: 600; }

/* Homepage CEO/Founder — two-column layout (scoped to index only) */
.ktc-home .ktc-leadership-home .ktc-leadership-card {
    display: grid;
    grid-template-columns: minmax(0, 32%) minmax(0, 1fr);
    gap: clamp(1.5rem, 3vw, 2.5rem);
    align-items: center;
    padding: clamp(1.5rem, 3vw, 2.25rem);
    overflow: visible;
}

.ktc-home .ktc-leadership-home .ktc-leadership-media {
    width: 100%;
    max-width: 280px;
    margin: 0 auto;
    aspect-ratio: 3 / 4;
    border-radius: var(--radius-xl);
    overflow: hidden;
    border: 1px solid var(--border-color);
    box-shadow: var(--shadow-md);
    background: var(--bg-tertiary);
}

.ktc-home .ktc-leadership-home .ktc-leadership-photo {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
    display: block;
}

.ktc-home .ktc-leadership-home .ktc-leadership-body {
    padding: 0;
}

.ktc-home .ktc-leadership-home .ktc-leadership-body h3 {
    margin-bottom: 0.35rem;
}

.ktc-home .ktc-leadership-home .ktc-leadership-body .leadership-position {
    margin-bottom: 1rem;
}

.ktc-home .ktc-leadership-home .ktc-leadership-message {
    margin-bottom: 0;
    line-height: 1.75;
    color: var(--text-secondary);
}

@media (min-width: 992px) {
    .ktc-home .ktc-leadership-home .ktc-leadership-media {
        max-width: none;
        margin: 0;
    }
}

@media (max-width: 991.98px) {
    .ktc-home .ktc-leadership-home .ktc-leadership-card {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }

    .ktc-home .ktc-leadership-home .ktc-leadership-media {
        max-width: 240px;
    }

    .ktc-home .ktc-leadership-home .ktc-leadership-body {
        text-align: left;
    }
}

@media (max-width: 575.98px) {
    .ktc-home .ktc-leadership-home .ktc-leadership-media {
        max-width: 200px;
    }

    .ktc-home .ktc-leadership-home .ktc-leadership-card {
        padding: 1.25rem;
    }
}

.review-card {
    background: #fff;
    border: 1.5px solid var(--border-color);
    border-radius: var(--radius-2xl);
    padding: 1.4rem;
    height: 100%;
    box-shadow: var(--shadow-sm);
}

.review-header {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    margin-bottom: 0.75rem;
}

.review-avatar {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    object-fit: contain;
    background: var(--bg-tertiary);
    border: 2px solid var(--border-color);
}

.review-rating { color: var(--accent-color); margin-bottom: 0.6rem; }
.review-text { color: var(--text-secondary); font-style: italic; }
.review-screenshot {
    margin-top: 0.75rem;
    border-radius: var(--radius-lg);
    width: 100%;
    height: auto;
    object-fit: contain;
}
.review-course { font-size: 0.85rem; color: var(--text-muted); }

.mentor-card {
    background: #fff;
    border: 1.5px solid var(--border-color);
    border-radius: var(--radius-2xl);
    overflow: hidden;
    height: 100%;
    transition: transform var(--transition-base), box-shadow var(--transition-base);
}

.mentor-card:hover {
    transform: translateY(-5px);
    box-shadow: var(--shadow-xl);
}

.mentor-courses-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    gap: 0.7rem;
}

.mentor-course-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0.5rem;
    border: 1px solid var(--border-color);
    border-radius: var(--radius-md);
    background: #fff;
    color: var(--text-primary);
    text-decoration: none;
}

.mentor-course-card:hover {
    border-color: var(--primary-color);
    color: var(--primary-color);
}

.mentor-course-thumb {
    width: 100%;
    height: auto;
    object-fit: contain;
    margin-bottom: 0.3rem;
}

.mentor-course-name {
    font-size: 0.75rem;
    text-align: center;
    line-height: 1.2;
}

.mentor-course-tag {
    background: var(--primary-lighter);
    color: var(--primary-dark);
    padding: 0.2rem 0.55rem;
    border-radius: 999px;
    font-size: 0.75rem;
    font-weight: 600;
}

/* Forms */
.form-label {
    font-weight: 600;
    color: var(--text-primary);
    margin-bottom: 0.35rem;
}

.form-control,
.form-select {
    border: 1.5px solid var(--border-color);
    border-radius: 0.8rem;
    padding: 0.75rem 0.95rem;
    font-size: 1rem;
}

.form-control:focus,
.form-select:focus {
    border-color: var(--electric-accent);
    box-shadow: 0 0 0 4px rgba(6, 182, 212, 0.15);
}

.course-search { margin-bottom: 0.5rem; }
.search-input {
    border: 2px solid var(--border-color);
    border-radius: 1rem;
    padding: 1rem 1.2rem;
    font-size: 1.05rem;
}

/* Accordion */
.accordion-item {
    border: 1.5px solid var(--border-color) !important;
    border-radius: 1rem !important;
    margin-bottom: 0.75rem;
    overflow: hidden;
    background: #fff;
}

.accordion-button {
    font-weight: 700;
    color: var(--text-primary);
    padding: 1rem 1.2rem;
}

.accordion-button:not(.collapsed) {
    background: #eff6ff;
    color: var(--primary-dark);
    box-shadow: none;
}

.accordion-body {
    padding: 1rem 1.2rem 1.2rem;
    color: var(--text-secondary);
}

/* Alerts / tables / badges */
.alert {
    border-radius: 0.9rem;
    border: none;
    padding: 0.95rem 1.15rem;
}

.alert-success { background: var(--success-light); color: #065f46; }
.alert-danger { background: var(--error-light); color: #991b1b; }
.alert-warning { background: var(--warning-light); color: #92400e; }
.alert-info { background: var(--info-light); color: #1e40af; }

.table thead { background: var(--bg-tertiary); }
.table th { font-weight: 700; color: var(--text-primary); }
.table td { color: var(--text-secondary); vertical-align: middle; }

.badge {
    padding: 0.3rem 0.65rem;
    border-radius: 999px;
    font-weight: 700;
}

.badge-primary { background: var(--primary-lighter); color: var(--primary-dark); }
.badge-success { background: var(--success-light); color: #065f46; }
.badge-warning { background: var(--warning-light); color: #92400e; }
.badge-danger { background: var(--error-light); color: #991b1b; }

/* Footer */
.footer {
    background: linear-gradient(180deg, #071018 0%, #050814 100%);
    color: var(--text-light);
    padding: 4.5rem 0 1.6rem;
    margin-top: auto;
    position: relative;
    overflow-x: hidden;
    overflow-y: visible;
}

.footer::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: linear-gradient(90deg, var(--primary-color), var(--electric-accent), var(--accent-color));
}

.footer-heading {
    color: #fff;
    font-weight: 800;
    margin-bottom: 1.1rem;
    font-size: 1.05rem;
}

.footer-text {
    color: #DCE6F2;
    font-size: 1rem;
    line-height: 1.7;
}

.footer-links,
.footer-contact {
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-links li { margin-bottom: 0.45rem; }

.footer-links a,
.footer-contact a {
    color: #DCE6F2;
    font-size: 1rem;
}

.footer-links a:hover,
.footer-contact a:hover { color: var(--electric-accent-light); }

.footer-contact li {
    display: flex;
    gap: 0.7rem;
    margin-bottom: 0.7rem;
    color: #DCE6F2;
    font-size: 0.95rem;
}

.footer-contact i { color: var(--electric-accent); }

.footer-cta {
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 255, 255, 0.1);
    border-radius: 1rem;
    padding: 1rem 1.1rem;
    margin-top: 1rem;
}

.footer-cta-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    gap: 0.65rem;
}

.footer-cta-actions .btn {
    flex: 1 1 8.5rem;
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    white-space: normal;
    text-align: center;
    margin: 0;
}

.footer-contact li {
    min-width: 0;
    align-items: flex-start;
    word-break: break-word;
    overflow-wrap: anywhere;
}

.footer-links a,
.footer-contact a {
    display: inline-block;
    max-width: 100%;
    overflow-wrap: anywhere;
}

.footer-bottom .copyright {
    padding-right: 0.5rem;
}

@media (max-width: 767.98px) {
    .footer-legal {
        justify-content: flex-start;
        flex-wrap: wrap;
        gap: 0.75rem 1.2rem;
    }
    .footer-links,
    .footer-contact {
        padding-right: 3.25rem;
    }
}

.footer-divider { border-color: rgba(255, 255, 255, 0.1); margin: 2rem 0 1.2rem; }
.copyright { color: #DCE6F2; margin: 0; font-size: 0.95rem; }

.footer-legal {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    justify-content: flex-end;
    gap: 1.2rem;
}

.footer-legal a { color: #DCE6F2; font-size: 0.95rem; }
.footer-legal a:hover { color: #fff; }

.social-links { display: flex; gap: 0.6rem; margin-top: 1rem; flex-wrap: wrap; }

.social-link {
    width: 42px;
    height: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.75rem;
    background: rgba(255, 255, 255, 0.08);
    color: #fff;
    border: 1px solid rgba(255, 255, 255, 0.12);
}

.social-link:hover {
    background: var(--primary-color);
    color: #fff;
    transform: translateY(-3px);
}

.card .social-link {
    background: var(--bg-tertiary);
    color: var(--primary-dark);
    border-color: var(--border-color);
}

/* WhatsApp / empty / utilities */
.whatsapp-float {
    position: fixed;
    bottom: 1.4rem;
    right: 1.4rem;
    width: 58px;
    height: 58px;
    background: #25D366;
    color: #fff;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.8rem;
    box-shadow: var(--shadow-lg);
    z-index: var(--z-fixed);
    text-decoration: none;
}

.whatsapp-float:hover {
    transform: translateY(-3px);
    color: #fff;
}

.mobile-sticky-cta {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background: #fff;
    padding: 0.75rem;
    box-shadow: 0 -8px 20px rgba(15, 23, 42, 0.12);
    z-index: var(--z-sticky);
    display: none;
}

.empty-state { text-align: center; padding: 3rem 1rem; }
.empty-icon { font-size: 3.4rem; color: var(--text-muted); display: block; margin-bottom: 0.8rem; }

.breadcrumb { background: transparent; padding: 0; }
.breadcrumb-item a { font-weight: 600; }

.text-gradient {
    background: linear-gradient(135deg, #60a5fa, #22d3ee);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

.pattern-grid {
    background-image:
        linear-gradient(rgba(37, 99, 235, 0.04) 1px, transparent 1px),
        linear-gradient(90deg, rgba(37, 99, 235, 0.04) 1px, transparent 1px);
    background-size: 40px 40px;
}

.fade-in,
.slide-up,
.scale-in {
    opacity: 1;
    transform: none;
}

.slide-up { transform: translateY(28px); }
.scale-in { transform: scale(0.97); }

.fade-in.visible,
.slide-up.visible,
.scale-in.visible {
    opacity: 1;
    transform: none;
}

.stagger-1 { transition-delay: 0.08s; }
.stagger-2 { transition-delay: 0.16s; }
.stagger-3 { transition-delay: 0.24s; }
.stagger-4 { transition-delay: 0.32s; }

.glass {
    background: rgba(255, 255, 255, 0.72);
    backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 255, 255, 0.3);
}

.glass-dark {
    background: rgba(15, 23, 42, 0.55);
    backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 255, 255, 0.1);
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after {
        animation: none !important;
        transition: none !important;
    }
    .fade-in, .slide-up, .scale-in {
        opacity: 1;
        transform: none;
    }
}

@media (max-width: 991px) {
    .hero-code-chip { display: none; }
    .course-actions .btn { min-width: 0; }
}

@media (max-width: 768px) {
    .section { padding: 3rem 0; }
    .hero-enhanced { padding: 3.4rem 0 3rem; }
    .hero-buttons { flex-direction: column; }
    .hero-buttons .btn { width: 100%; }
    .ktc-nav-actions .btn { flex: 1; min-width: 140px; }
    .whatsapp-float { width: 50px; height: 50px; font-size: 1.45rem; bottom: 1.2rem; }
}

.ktc-announce-strip {
    background: #f4f7fb;
    padding: 1.15rem 0 0.35rem;
}

.ktc-announce-banner,
.ktc-announce-card {
    background: #fff;
    border: 1px solid rgba(11, 18, 32, 0.08);
    border-radius: 18px;
    box-shadow: 0 12px 32px rgba(11, 18, 32, 0.08);
    padding: 1.25rem 2.6rem 1.25rem 1.4rem;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
    position: relative;
}

.ktc-announce-banner:hover,
.ktc-announce-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 16px 36px rgba(11, 18, 32, 0.12);
}

.ktc-announce-banner-featured {
    border-color: rgba(245, 158, 11, 0.45);
    background:
        linear-gradient(180deg, rgba(245, 158, 11, 0.08) 0%, #fff 42%);
}

.ktc-announce-kicker {
    color: #1d4ed8;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    margin-bottom: 0.35rem;
}

.ktc-announce-title {
    font-size: clamp(1.2rem, 2vw, 1.55rem);
    color: #0b1220;
    margin-bottom: 0.4rem;
}

.ktc-announce-card-title {
    font-size: 1.1rem;
    color: #0b1220;
    margin-bottom: 0.4rem;
}

.ktc-announce-text {
    color: #334155;
    margin-bottom: 0.85rem;
}

.ktc-announce-media {
    width: 100%;
    overflow: hidden;
    border-radius: 12px;
    background: #f8fafc;
    margin-bottom: 0.35rem;
}

.ktc-announce-media img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: contain;
}

.ktc-announce-dismiss {
    position: absolute;
    top: 0.7rem;
    right: 0.7rem;
    width: 32px;
    height: 32px;
    border: 0;
    border-radius: 50%;
    background: rgba(11, 18, 32, 0.06);
    color: #0b1220;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    z-index: 2;
}

.ktc-announce-cta {
    margin-top: 0.15rem;
}

.ktc-announce-banner-fill {
    width: 100%;
}
.ktc-announce-fillpanel {
    height: 100%;
    padding: 1.05rem 1.15rem 1.15rem;
    border-radius: 14px;
    background: linear-gradient(165deg, #0f172a 0%, #1e3a8a 100%);
    color: #f8fafc;
}
.ktc-announce-fillpanel .ktc-announce-kicker {
    color: #fbbf24;
}
.ktc-announce-fill-title {
    font-size: 1.15rem;
    font-weight: 700;
    color: #fff;
    margin-bottom: 0.4rem;
}
.ktc-announce-fillpanel .ktc-announce-text {
    color: rgba(248, 250, 252, 0.88);
}
.ktc-announce-fill-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin-bottom: 0.75rem;
}
.ktc-announce-fillpanel .btn-outline-primary {
    border-color: rgba(255, 255, 255, 0.55);
    color: #fff;
}
.ktc-announce-fillpanel .btn-outline-primary:hover,
.ktc-announce-fillpanel .btn-outline-primary:focus-visible {
    background: rgba(255, 255, 255, 0.12);
    color: #fff;
}
.ktc-announce-fill-sub {
    font-size: 0.75rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    font-weight: 700;
    color: #fbbf24;
    margin: 0.35rem 0 0.4rem;
}
.ktc-announce-fill-courses {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.35rem 0.65rem;
}
.ktc-announce-fill-courses a {
    color: #e2e8f0;
    text-decoration: none;
    font-size: 0.82rem;
    font-weight: 600;
}
.ktc-announce-fill-courses a:hover,
.ktc-announce-fill-courses a:focus-visible {
    color: #fbbf24;
    outline: none;
}
@media (max-width: 991.98px) {
    .ktc-announce-fill-courses {
        grid-template-columns: 1fr;
    }
}

.ktc-announce-grid {
    margin-top: 1rem;
    margin-bottom: 0.5rem;
}

@media (max-width: 768px) {
    .ktc-announce-banner,
    .ktc-announce-card {
        padding: 1rem 1.05rem 1.1rem;
    }
    .ktc-announce-dismiss {
        top: 0.45rem;
        right: 0.45rem;
    }
}

.ktc-online-notice {
    background: #fff;
    border: 1px solid rgba(29, 78, 216, 0.18);
    border-left: 4px solid #1d4ed8;
    border-radius: 14px;
    padding: 1.1rem 1.25rem;
    color: #0b1220;
    box-shadow: 0 10px 24px rgba(11, 18, 32, 0.06);
}

.ktc-admit-steps .ktc-admit-step {
    display: flex;
    gap: 0.85rem;
    background: #fff;
    border-radius: 16px;
    padding: 1.1rem;
    height: 100%;
    border: 1px solid rgba(11, 18, 32, 0.08);
    box-shadow: 0 8px 20px rgba(11, 18, 32, 0.05);
}

.ktc-admit-step span {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: #0b1220;
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    flex-shrink: 0;
}

.ktc-admit-step h3 {
    font-size: 1rem;
    margin-bottom: 0.25rem;
}

.ktc-admit-step p,
.ktc-admit-card p {
    color: #334155;
    margin-bottom: 0.75rem;
}

.ktc-admit-card,
.ktc-admit-success {
    background: #fff;
    border-radius: 18px;
    padding: 1.5rem;
    margin-bottom: 1.25rem;
    border: 1px solid rgba(11, 18, 32, 0.08);
    box-shadow: 0 12px 32px rgba(11, 18, 32, 0.07);
}

.ktc-admit-card h2,
.ktc-admit-success h2 {
    font-size: 1.25rem;
    margin-bottom: 0.85rem;
    color: #0b1220;
}

.ktc-course-choice {
    display: flex;
    gap: 0.75rem;
    align-items: flex-start;
    border: 1px solid rgba(11, 18, 32, 0.1);
    border-radius: 14px;
    padding: 0.9rem;
    cursor: pointer;
    height: auto;
    background: #f8fafc;
}

.ktc-course-pick {
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
    height: 100%;
}

.ktc-course-batch {
    position: relative;
    z-index: 2;
    background: #fff;
    border: 1px solid rgba(11, 18, 32, 0.1);
    border-radius: 12px;
    padding: 0.75rem 0.85rem;
}

.ktc-course-batch .form-text {
    position: static;
    display: block;
    margin-top: 0.4rem;
    line-height: 1.45;
    white-space: normal;
}

.ktc-course-choice:hover {
    border-color: #1d4ed8;
}

.ktc-course-choice input {
    margin-top: 0.3rem;
}

.ktc-course-choice strong,
.ktc-course-choice em {
    display: block;
}

.ktc-course-choice em {
    font-style: normal;
    color: #1d4ed8;
    font-weight: 700;
}

.ktc-course-choice small,
.ktc-course-choice a {
    display: block;
    font-size: 0.82rem;
}

.ktc-fee-box {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
    flex-wrap: wrap;
    background: #0b1220;
    color: #fff;
    border-radius: 14px;
    padding: 1rem 1.15rem;
    position: relative;
    z-index: 1;
    margin-top: 0.35rem;
    clear: both;
}

.ktc-fee-box #selectedCourseList {
    margin-top: 0.35rem;
    line-height: 1.45;
}

.ktc-pay-method {
    border: 1px solid rgba(11, 18, 32, 0.08);
    border-radius: 14px;
    padding: 1rem;
    height: 100%;
    background: #f8fafc;
}

.ktc-payment-section {
    overflow: hidden;
}

.ktc-payment-head {
    margin-bottom: 1.25rem;
}

.ktc-payment-title {
    font-size: clamp(1.35rem, 2.4vw, 1.55rem);
    font-weight: 700;
    color: var(--primary-dark);
    margin-bottom: 0.45rem;
    line-height: 1.25;
}

.ktc-payment-subtitle {
    color: var(--text-secondary);
    font-size: 1rem;
    margin-bottom: 0;
    max-width: 52rem;
}

.ktc-payment-amount-card {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    padding: 1rem 1.15rem;
    margin-bottom: 1.15rem;
    border-radius: 14px;
    border: 1px solid rgba(5, 150, 105, 0.18);
    background: linear-gradient(135deg, rgba(209, 250, 229, 0.55), rgba(248, 250, 252, 0.95));
    box-shadow: 0 8px 20px rgba(5, 150, 105, 0.06);
}

.ktc-payment-amount-icon {
    width: 46px;
    height: 46px;
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    background: var(--success-light);
    color: var(--success-color);
    font-size: 1.35rem;
}

.ktc-payment-amount-body {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    min-width: 0;
}

.ktc-payment-amount-label {
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #065f46;
}

.ktc-payment-amount-value {
    font-size: clamp(1.35rem, 2.5vw, 1.75rem);
    line-height: 1.15;
    color: var(--primary-dark);
}

.ktc-payment-amount-note {
    font-size: 0.88rem;
    color: var(--text-secondary);
    line-height: 1.45;
}

.ktc-payment-guidance {
    padding: 0.95rem 1rem;
    margin-bottom: 1.15rem;
    border-radius: 12px;
    border-left: 4px solid var(--success-color);
    background: #f8fafc;
    color: var(--text-secondary);
}

.ktc-payment-guidance p {
    margin-bottom: 0.55rem;
}

.ktc-payment-methods {
    margin-top: 0.25rem;
}

.ktc-pay-method-card {
    height: 100%;
    display: flex;
    flex-direction: column;
    border: 1px solid rgba(29, 78, 216, 0.12);
    border-radius: 16px;
    padding: 1.1rem 1.15rem;
    background: #fff;
    box-shadow: 0 10px 24px rgba(11, 18, 32, 0.05);
    transition: border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}

.ktc-pay-method-card:hover {
    border-color: rgba(29, 78, 216, 0.28);
    box-shadow: 0 14px 28px rgba(11, 18, 32, 0.08);
}

.ktc-pay-method-card:has(.form-check-input:checked) {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px rgba(29, 78, 216, 0.12);
}

.ktc-pay-method-card-head {
    display: flex;
    align-items: flex-start;
    gap: 0.85rem;
}

.ktc-pay-method-icon {
    width: 44px;
    height: 44px;
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    background: rgba(5, 150, 105, 0.1);
    color: var(--success-color);
    font-size: 1.25rem;
}

.ktc-pay-method-card-titles h3 {
    font-size: 1.05rem;
    margin: 0 0 0.25rem;
    color: var(--primary-dark);
    line-height: 1.3;
}

.ktc-pay-method-type {
    display: inline-block;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    color: #065f46;
    background: var(--success-light);
    border-radius: 999px;
    padding: 0.18rem 0.55rem;
}

.ktc-pay-method-divider {
    height: 1px;
    margin: 0.9rem 0;
    background: linear-gradient(90deg, rgba(5, 150, 105, 0.35), rgba(29, 78, 216, 0.08), transparent);
}

.ktc-pay-details {
    margin: 0;
}

.ktc-pay-detail-row {
    display: grid;
    grid-template-columns: minmax(7.5rem, 38%) 1fr;
    gap: 0.55rem 0.75rem;
    align-items: start;
    padding: 0.55rem 0;
    border-bottom: 1px dashed rgba(11, 18, 32, 0.08);
}

.ktc-pay-detail-row:last-child {
    border-bottom: 0;
    padding-bottom: 0;
}

.ktc-pay-detail-row dt {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    margin: 0;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    color: var(--text-secondary);
}

.ktc-pay-detail-row dt i {
    color: var(--success-color);
    font-size: 0.95rem;
}

.ktc-pay-detail-row dd {
    margin: 0;
    display: flex;
    align-items: center;
    gap: 0.45rem;
    min-width: 0;
}

.ktc-pay-detail-value {
    font-size: 0.98rem;
    font-weight: 600;
    color: var(--primary-dark);
    word-break: break-word;
    font-variant-numeric: tabular-nums;
    letter-spacing: 0.01em;
}

.ktc-pay-copy-btn {
    border: 1px solid rgba(29, 78, 216, 0.18);
    background: #fff;
    color: var(--primary-color);
    width: 32px;
    height: 32px;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    cursor: pointer;
    transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.ktc-pay-copy-btn:hover,
.ktc-pay-copy-btn:focus-visible {
    background: var(--primary-lighter);
    border-color: var(--primary-color);
    outline: none;
}

.ktc-pay-copy-btn.is-copied {
    background: var(--success-light);
    border-color: rgba(5, 150, 105, 0.35);
    color: var(--success-color);
}

.ktc-pay-method-instructions {
    display: flex;
    gap: 0.55rem;
    margin-top: 0.85rem;
    padding: 0.75rem 0.85rem;
    border-radius: 10px;
    background: #f8fafc;
    color: var(--text-secondary);
    font-size: 0.9rem;
    line-height: 1.5;
}

.ktc-pay-method-instructions i {
    color: var(--success-color);
    margin-top: 0.15rem;
    flex-shrink: 0;
}

.ktc-pay-method-select {
    margin-top: auto;
    padding-top: 0.95rem;
}

.ktc-pay-method-select .form-check-label {
    font-weight: 600;
    color: var(--primary-dark);
}

.ktc-payment-global-instructions {
    display: flex;
    gap: 0.65rem;
    align-items: flex-start;
    margin-top: 1rem;
}

.ktc-payment-global-instructions i {
    color: var(--primary-color);
    font-size: 1.1rem;
    margin-top: 0.1rem;
}

.ktc-pay-method h3 {
    font-size: 1.05rem;
    color: #0B1F3A;
}

.ktc-pay-method p {
    margin-bottom: 0.3rem;
    color: #334155;
}

@media (max-width: 767.98px) {
    .ktc-payment-amount-card {
        flex-direction: column;
    }

    .ktc-pay-detail-row {
        grid-template-columns: 1fr;
        gap: 0.25rem;
    }

    .ktc-pay-method-card {
        padding: 1rem;
    }
}

@media (max-width: 575.98px) {
    .ktc-payment-guidance {
        padding: 0.85rem;
    }
}

body .text-muted {
    color: #334155 !important;
}

.section-dark .text-muted,
.section-darker .text-muted,
.hero-enhanced .text-muted,
.footer .text-muted {
    color: #DCE6F2 !important;
}

.section-dark .card .text-muted,
.section-dark .benefit-card .text-muted,
.section-dark .feature-card .text-muted,
.section-dark .info-card .text-muted,
.section-dark .process-card .text-muted,
.section-dark .review-card .text-muted {
    color: #334155 !important;
}

.benefit-card h5 {
    font-size: 1.2rem;
    color: #0B1F3A;
}

.benefit-card p,
.benefit-card .text-muted {
    font-size: 1rem;
    color: #334155 !important;
    line-height: 1.6;
}

.section-dark .ktc-admit-step h3,
.section-dark .ktc-admit-card h3,
.section-dark .ktc-pay-method h3,
.section-dark .ktc-online-notice h3,
.section-dark .ktc-online-notice h4,
.section-dark .alert:not(.alert-dark) {
    color: #0B1F3A;
}

.section-dark .ktc-admit-step p,
.section-dark .ktc-admit-card p,
.section-dark .ktc-pay-method p,
.section-dark .ktc-online-notice,
.section-dark .ktc-online-notice p {
    color: #334155;
}

.section-dark .accordion-button,
.section-dark .accordion-body {
    color: #0B1F3A;
}

.section-dark .accordion-body {
    color: #334155;
}

.feature-card h5,
.benefit-card h5,
.process-card h5 {
    color: #0B1F3A;
    font-size: 1.2rem;
}

.feature-card p,
.benefit-card p,
.process-card p {
    color: #334155;
    font-size: 1rem;
}

.ktc-live-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.ktc-live-list li {
    padding: 0.45rem 0;
    color: #e2e8f0;
}

.ktc-live-list i {
    color: #22d3ee;
    margin-right: 0.4rem;
}

@media (max-width: 576px) {
    .trust-strip .row > div { width: 50%; margin-bottom: 0.8rem; }
    .course-card-enhanced .course-actions,
    .course-actions { flex-direction: column; }
    .course-actions .btn { width: 100%; }
}

/* ============================================
   Top announcement ticker + sticky header stack
   ============================================ */
.ktc-top-stack {
    position: sticky;
    top: 0;
    z-index: 1080;
}

.ktc-ticker {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    min-height: 2.6rem;
    background: #0f172a;
    color: #f8fafc;
    border-bottom: 1px solid rgba(245, 158, 11, 0.45);
    overflow: hidden;
    width: 100%;
}

.ktc-ticker-urgent { background: #7f1d1d; border-bottom-color: #fca5a5; }
.ktc-ticker-important { background: #1e3a8a; border-bottom-color: #93c5fd; }

.ktc-ticker-viewport {
    flex: 1;
    overflow: hidden;
    min-width: 0;
}

.ktc-ticker-track {
    display: flex;
    align-items: center;
    gap: 2.5rem;
    width: max-content;
    animation: ktc-ticker-scroll 28s linear infinite;
}

.ktc-ticker:hover .ktc-ticker-track {
    animation-play-state: paused;
}

.ktc-ticker-item {
    display: inline-flex;
    align-items: center;
    gap: 0.65rem;
    white-space: nowrap;
    padding: 0.45rem 0.25rem;
}

.ktc-ticker-badge {
    display: inline-flex;
    align-items: center;
    font-size: 0.7rem;
    font-weight: 800;
    letter-spacing: 0.06em;
    background: #f59e0b;
    color: #0b1220;
    border-radius: 999px;
    padding: 0.2rem 0.55rem;
}

.ktc-ticker-text {
    color: #f8fafc !important;
    font-weight: 600;
    font-size: 0.95rem;
    text-decoration: none;
}

a.ktc-ticker-text:hover {
    color: #fbbf24 !important;
    text-decoration: underline;
}

.ktc-ticker-close {
    flex-shrink: 0;
    width: 2rem;
    height: 2rem;
    border: 0;
    background: transparent;
    color: #e2e8f0;
    font-size: 1.25rem;
    margin-right: 0.35rem;
    border-radius: 0.35rem;
}

.ktc-ticker-close:hover,
.ktc-ticker-close:focus {
    background: rgba(255,255,255,0.12);
    color: #fff;
}

@keyframes ktc-ticker-scroll {
    from { transform: translateX(0); }
    to { transform: translateX(-50%); }
}

@media (prefers-reduced-motion: reduce) {
    .ktc-ticker-track {
        animation: none;
        flex-wrap: wrap;
        width: 100%;
        gap: 0.75rem 1.25rem;
        padding: 0.35rem 0.75rem;
    }
}

@media (max-width: 768px) {
    .ktc-ticker-text { font-size: 0.875rem; }
    .ktc-ticker-track { animation-duration: 36s; }
}

/* ============================================
   Scholarships
   ============================================ */
.ktc-sch-hero {
    padding: 3.5rem 0 2.75rem;
    background:
        radial-gradient(circle at 12% 20%, rgba(6, 182, 212, 0.18), transparent 42%),
        linear-gradient(135deg, #0b1220 0%, #152445 55%, #1e3a8a 100%);
    color: #fff;
}

.ktc-sch-hero h1 {
    color: #fff;
    font-size: clamp(2rem, 4vw, 3.15rem);
}

.ktc-sch-hero .hero-lead,
.ktc-sch-hero p {
    color: #dbe7f5;
    max-width: 42rem;
}

.ktc-sch-card {
    background: #fff;
    border: 1px solid var(--border-color);
    border-radius: 1.1rem;
    box-shadow: var(--shadow-md);
    padding: 1.4rem 1.45rem 1.3rem;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.ktc-sch-card h2,
.ktc-sch-card h3 {
    font-size: 1.25rem;
    margin-bottom: 0.5rem;
}

.ktc-sch-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    margin: 0.75rem 0;
}

.ktc-sch-meta span {
    background: #eef2ff;
    color: #1e3a8a;
    border-radius: 999px;
    font-size: 0.8rem;
    font-weight: 700;
    padding: 0.2rem 0.6rem;
}

.ktc-sch-card .ktc-sch-actions {
    margin-top: auto;
    padding-top: 1rem;
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
}

.ktc-sch-panel {
    background: #fff;
    border: 1px solid var(--border-color);
    border-radius: 1.1rem;
    padding: 1.5rem;
    box-shadow: var(--shadow-sm);
}

.ktc-sch-success {
    background: #fff;
    border: 1px solid #bbf7d0;
    border-radius: 1.1rem;
    padding: 1.75rem;
    box-shadow: var(--shadow-md);
}

/* ============================================
   Resources / public verification
   ============================================ */
.ktc-resources-menu {
    border: 1px solid rgba(15, 23, 42, 0.12);
    border-radius: 0.75rem;
    padding: 0.4rem 0;
    box-shadow: 0 16px 40px rgba(11, 18, 32, 0.18);
}

.ktc-resources-menu .dropdown-item {
    font-weight: 600;
    color: #0b1220;
    padding: 0.55rem 1.1rem;
}

.ktc-resources-menu .dropdown-item:hover,
.ktc-resources-menu .dropdown-item:focus {
    background: #eef2ff;
    color: #1e3a8a;
}

.ktc-res-card {
    background: #fff;
    border: 1px solid var(--border-color);
    border-radius: 1.1rem;
    box-shadow: var(--shadow-md);
    padding: 1.5rem 1.45rem 1.4rem;
    display: flex;
    flex-direction: column;
    min-height: 100%;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.ktc-res-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 18px 36px rgba(11, 18, 32, 0.12);
}

.ktc-res-icon {
    width: 3rem;
    height: 3rem;
    border-radius: 0.85rem;
    background: #eef2ff;
    color: #1d4ed8;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.45rem;
    margin-bottom: 1rem;
}

.ktc-res-card h2 {
    font-size: 1.2rem;
    margin-bottom: 0.5rem;
    color: #0b1220;
}

.ktc-res-card p {
    color: #334155;
    font-size: 0.98rem;
    line-height: 1.55;
    margin-bottom: 1rem;
}

.ktc-result {
    border-radius: 1rem;
    padding: 1.25rem 1.35rem;
    border: 1px solid transparent;
}

.ktc-result strong {
    display: block;
    font-size: 1.1rem;
    margin-bottom: 0.45rem;
}

.ktc-result-ok {
    background: #f0fdf4;
    border-color: #86efac;
    color: #14532d;
}

.ktc-result-pending {
    background: #fffbeb;
    border-color: #fcd34d;
    color: #78350f;
}

.ktc-result-fail {
    background: #fef2f2;
    border-color: #fca5a5;
    color: #7f1d1d;
}

.ktc-result-missing {
    background: #f8fafc;
    border-color: #cbd5e1;
    color: #0f172a;
}

/* Public verification method selector (Skill Passport / Certificate / Result Card) */
.ktc-verify-form .ktc-verify-legend {
    font-size: 0.95rem;
    font-weight: 700;
    margin-bottom: 0.65rem;
    color: var(--text-primary, #0f1c3d);
}
.ktc-verify-options {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}
.ktc-verify-option {
    margin: 0;
    cursor: pointer;
}
.ktc-verify-option input {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}
.ktc-verify-option span {
    display: inline-block;
    border: 1px solid var(--border-color, #dbe3ef);
    border-radius: 999px;
    padding: 0.45rem 0.9rem;
    font-size: 0.88rem;
    font-weight: 700;
    background: #fff;
    color: #0f1c3d;
}
.ktc-verify-option input:checked + span {
    background: #0f1c3d;
    border-color: #0f1c3d;
    color: #fff;
}
.ktc-verify-option input:focus-visible + span {
    outline: 2px solid #2563eb;
    outline-offset: 2px;
}
.ktc-verify-pick-btn {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0.15rem;
    width: 100%;
    border: 0;
    background: transparent;
    text-align: left;
    padding: 0.85rem 1rem;
}
.ktc-verify-pick-btn span {
    font-size: 0.85rem;
    color: #64748b;
}
.ktc-verify-summary {
    background: #fff;
    border: 1px solid #bbf7d0;
    border-radius: 1rem;
    padding: 1.25rem 1.35rem;
}
.ktc-result-card-public {
    max-width: 720px;
    margin: 0 auto 1.5rem;
}

@media (max-width: 767px) {
    .ktc-verify-option span {
        width: 100%;
        text-align: center;
    }
    .ktc-verify-option {
        flex: 1 1 calc(50% - 0.5rem);
    }
}

/* KTC promotional offer popup */
.ktc-offer-overlay {
    position: fixed;
    inset: 0;
    z-index: 2000;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
    background: rgba(5, 8, 20, 0.72);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
}
.ktc-offer-overlay[hidden] { display: none !important; }
.ktc-offer-dialog {
    position: relative;
    width: min(640px, 100%);
    max-height: min(90dvh, 900px);
    overflow: auto;
    background: linear-gradient(180deg, #0f1c3d 0%, #0b1220 100%);
    color: #f8fafc;
    border: 1px solid rgba(245, 158, 11, 0.35);
    border-radius: 1.15rem;
    padding: 1.35rem;
    box-shadow: 0 24px 64px rgba(0, 0, 0, 0.45);
    animation: ktcOfferIn 0.35s ease-out;
}
@keyframes ktcOfferIn {
    from { opacity: 0; transform: translateY(18px) scale(0.98); }
    to { opacity: 1; transform: none; }
}
.ktc-offer-close {
    position: absolute;
    top: 0.7rem;
    right: 0.7rem;
    width: 2.5rem;
    height: 2.5rem;
    border: 0;
    border-radius: 999px;
    background: rgba(255,255,255,0.1);
    color: #fff;
}
.ktc-offer-close:focus-visible { outline: 2px solid #fbbf24; }
.ktc-offer-brand { display: flex; align-items: center; gap: 0.75rem; margin-bottom: 0.85rem; color: #dbeafe; font-size: 0.85rem; font-weight: 600; }
.ktc-offer-logo { max-height: 44px; width: auto; }
.ktc-offer-badge { display: inline-block; background: #f59e0b; color: #0b1220; font-size: 0.72rem; font-weight: 800; letter-spacing: 0.06em; text-transform: uppercase; padding: 0.25rem 0.55rem; border-radius: 999px; margin-bottom: 0.5rem; }
.ktc-offer-chip { display: inline-block; border: 1px solid rgba(34, 211, 238, 0.5); color: #67e8f9; font-weight: 700; font-size: 0.85rem; padding: 0.2rem 0.55rem; border-radius: 0.4rem; margin-bottom: 0.55rem; }
.ktc-offer-heading { font-size: clamp(1.35rem, 4vw, 1.85rem); font-weight: 800; line-height: 1.2; margin: 0 0 0.4rem; color: #fff; }
.ktc-offer-highlight { color: #fbbf24; font-weight: 600; margin-bottom: 0.5rem; }
.ktc-offer-copy { color: #dce6f2; margin-bottom: 0.85rem; }
.ktc-offer-countdown { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.45rem; margin-bottom: 0.9rem; }
.ktc-offer-count-box { background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.1); border-radius: 0.65rem; text-align: center; padding: 0.45rem 0.2rem; }
.ktc-offer-count-box span { display: block; font-size: 1.15rem; font-weight: 800; }
.ktc-offer-count-box small { color: #93c5fd; font-size: 0.7rem; }
.ktc-offer-banner { width: 100%; height: auto; border-radius: 0.75rem; margin-bottom: 0.85rem; }
.ktc-offer-facts, .ktc-offer-extra { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.55rem; margin: 0 0 0.9rem; }
.ktc-offer-facts div, .ktc-offer-extra div { background: rgba(255,255,255,0.05); border-radius: 0.55rem; padding: 0.45rem 0.55rem; }
.ktc-offer-facts dt, .ktc-offer-extra dt { font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.04em; color: #93c5fd; margin: 0; }
.ktc-offer-facts dd, .ktc-offer-extra dd { margin: 0; font-weight: 700; color: #fff; }
.ktc-offer-actions { display: flex; flex-wrap: wrap; gap: 0.55rem; }
.ktc-offer-cta { background: #f59e0b; color: #0b1220; font-weight: 800; border-radius: 0.7rem; padding: 0.7rem 1.1rem; min-height: 44px; }
.ktc-offer-cta-secondary { background: transparent; color: #fff; border: 1px solid rgba(255,255,255,0.35); border-radius: 0.7rem; padding: 0.7rem 1.1rem; min-height: 44px; }
.ktc-offer-note { margin: 0.75rem 0 0; font-size: 0.78rem; color: #94a3b8; }
@media (max-width: 576px) {
    .ktc-offer-dialog { padding: 1.1rem; }
    .ktc-offer-actions { flex-direction: column; }
    .ktc-offer-cta, .ktc-offer-cta-secondary { width: 100%; text-align: center; }
}
@media (prefers-reduced-motion: reduce) {
    .ktc-offer-dialog { animation: none; }
}
}

@media (max-width: 1199.98px) {
    .ktc-navbar.navbar {
        padding: 0.4rem 0;
    }

    .ktc-navbar-inner {
        flex-wrap: wrap;
        padding-left: 1rem;
        padding-right: 1rem;
        column-gap: 0.5rem;
    }

    .navbar-brand img,
    .ktc-navbar-logo {
        height: 46px;
        max-width: 160px;
    }

    .ktc-navbar-collapse {
        flex-basis: 100%;
        width: 100%;
        margin-top: 0.15rem;
        padding: 0.65rem 0 0.35rem;
        border-top: 1px solid rgba(255, 255, 255, 0.1);
    }

    .ktc-navbar .ktc-nav-links {
        flex-direction: column;
        flex-wrap: nowrap !important;
        align-items: stretch;
        width: 100%;
        margin: 0;
        row-gap: 0.15rem;
    }

    .ktc-navbar .ktc-nav-links .nav-link {
        width: 100%;
        min-height: 44px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        font-size: 0.95rem;
        padding: 0.7rem 0.85rem !important;
        border-radius: 0.6rem;
    }

    .ktc-navbar .dropdown-menu.ktc-resources-menu {
        position: static;
        float: none;
        transform: none;
        width: 100%;
        max-width: 100%;
        margin: 0.15rem 0 0.45rem;
        box-shadow: none;
        border: 1px solid rgba(255, 255, 255, 0.12);
        background: rgba(255, 255, 255, 0.08);
    }

    .ktc-navbar .ktc-resources-menu .dropdown-item {
        color: #f8fafc;
        white-space: normal;
        min-height: 44px;
        display: flex;
        align-items: center;
        padding: 0.65rem 0.9rem;
        border-radius: 0.5rem;
    }

    .ktc-navbar .ktc-resources-menu .dropdown-item:hover,
    .ktc-navbar .ktc-resources-menu .dropdown-item:focus {
        background: rgba(255, 255, 255, 0.12);
        color: #fff;
    }

    .ktc-navbar .ktc-resources-menu .dropdown-divider {
        border-color: rgba(255, 255, 255, 0.18);
    }

    .ktc-navbar .ktc-nav-actions {
        width: 100%;
        margin: 0.65rem 0 0.2rem;
        flex-wrap: wrap;
    }

    .ktc-navbar .ktc-nav-actions .btn {
        flex: 1 1 auto;
        min-height: 44px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }
}

.ktc-navbar .navbar-collapse.show .dropdown-menu.ktc-resources-menu,
.ktc-navbar .navbar-collapse.collapsing .dropdown-menu.ktc-resources-menu {
    position: static !important;
    float: none !important;
    transform: none !important;
    inset: auto !important;
    width: 100%;
    max-width: 100%;
    margin: 0.15rem 0 0.4rem;
    box-shadow: none;
    border: 1px solid rgba(255, 255, 255, 0.12);
    background: rgba(255, 255, 255, 0.08);
}

@media (min-width: 1200px) {
    .ktc-navbar .navbar-collapse.ktc-navbar-collapse {
        display: flex !important;
        flex-wrap: nowrap;
        flex-basis: auto;
        align-items: center;
        min-width: 0;
    }

    .ktc-navbar .dropdown-menu.ktc-resources-menu {
        position: absolute;
        inset: auto auto auto 0;
        max-width: min(22rem, calc(100vw - 1.5rem));
    }

    .ktc-navbar .dropdown-menu-end.ktc-resources-menu {
        inset: auto 0 auto auto;
        left: auto;
        right: 0;
    }
}

@media (max-width: 400px) {
    .navbar-brand img,
    .ktc-navbar-logo {
        height: 40px;
        max-width: 132px;
    }

    .ktc-navbar-inner {
        padding-left: 0.75rem;
        padding-right: 0.75rem;
    }
}

/* Public sample certificate showcase */
.ktc-cert-sample {
    background: #f8fafc;
    overflow: hidden;
}
.ktc-cert-path {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    justify-content: center;
    padding: 0;
    margin: 0 0 2.5rem;
}
.ktc-cert-path li {
    position: relative;
    background: #fff;
    border: 1px solid var(--border-color);
    border-radius: 999px;
    padding: 0.55rem 1.1rem;
    font-size: 0.82rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--primary-dark);
    box-shadow: var(--shadow-sm);
}
.ktc-cert-path li:not(:last-child)::after {
    content: '→';
    position: absolute;
    right: -0.85rem;
    top: 50%;
    transform: translateY(-50%);
    color: var(--accent-color);
    font-weight: 800;
}
.ktc-cert-frame {
    position: relative;
    margin: 0;
    background: #fff;
    border: 1px solid var(--border-color);
    border-radius: 1.15rem;
    box-shadow: var(--shadow-lg);
    padding: 1rem 1rem 0.85rem;
    overflow: hidden;
}
.ktc-cert-frame img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 0.65rem;
    background: #fff;
}
.ktc-cert-badge {
    position: absolute;
    top: 1.35rem;
    left: 1.35rem;
    z-index: 2;
    background: #0f1c3d;
    color: #fff;
    font-size: 0.72rem;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    padding: 0.4rem 0.7rem;
    border-radius: 0.4rem;
    box-shadow: 0 8px 18px rgba(15, 28, 61, 0.28);
}
.ktc-cert-caption {
    margin: 0.75rem 0 0;
    font-size: 0.82rem;
    color: var(--text-secondary);
}
.ktc-cert-heading {
    font-size: 1.2rem;
    margin: 0 0 0.55rem;
    color: var(--text-primary);
}
.ktc-cert-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.65rem;
    margin-top: 1.4rem;
}
.ktc-cert-actions .btn {
    border-radius: 0.65rem;
    padding: 0.65rem 1.05rem;
}
@media (max-width: 767px) {
    .ktc-cert-path li:not(:last-child)::after {
        display: none;
    }
    .ktc-cert-actions .btn {
        width: 100%;
        text-align: center;
    }
    .ktc-cert-badge {
        left: 1rem;
        top: 1rem;
    }
}

/* Public Skill Passport sample (homepage + Skill Passport page) */
.ktc-sp-home-sample {
    overflow: visible;
}
.ktc-sp-sample-frame {
    overflow: visible;
}
.ktc-sp-sample-frame img {
    width: 100%;
    height: auto;
    object-fit: contain;
    object-position: center;
}
.ktc-sp-sample-open {
    display: block;
    width: 100%;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
    text-align: left;
}
.ktc-sp-sample-open img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: contain;
    border-radius: 0.65rem;
    background: #fff;
}
.ktc-sp-sample-pdfhint {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 220px;
    width: 100%;
    border-radius: 0.65rem;
    background: #eef2f7;
    color: #0f1c3d;
    font-weight: 700;
    font-size: 0.95rem;
}
.ktc-sp-sample-lightbox-img {
    max-width: 100%;
    height: auto;
    object-fit: contain;
}
.ktc-sp-sample-embed {
    width: 100%;
    min-height: 70vh;
    border: 0;
}
@media (max-width: 767px) {
    .ktc-sp-sample-embed {
        min-height: 50vh;
    }
}

/* Public student-journey upgrade */
.ktc-ur {
    font-family: "Noto Nastaliq Urdu", "Noto Naskh Arabic", Tahoma, serif;
    font-size: 1.02rem;
    line-height: 2;
    color: inherit;
}
.ktc-bi {
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
}
.ktc-hero-simple .hero-buttons .btn small,
.ktc-hero-simple .hero-buttons .btn .ktc-ur {
    display: block;
    font-size: 0.82rem;
    font-weight: 600;
    opacity: 0.92;
}
.ktc-hero-simple .hero-pills {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.45rem;
    margin: 1.25rem 0 1.5rem;
}
.ktc-hero-simple .hero-pill {
    background: rgba(255,255,255,0.12);
    border: 1px solid rgba(255,255,255,0.18);
    color: #fff;
    border-radius: 999px;
    padding: 0.35rem 0.8rem;
    font-size: 0.86rem;
}
.ktc-step-card,
.ktc-join-steps .ktc-step-card {
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 18px;
    padding: 1.25rem;
    height: 100%;
    box-shadow: 0 10px 28px rgba(15, 23, 42, 0.06);
}
.ktc-step-num {
    display: inline-flex;
    width: 2.1rem;
    height: 2.1rem;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #1d4ed8;
    color: #fff;
    font-weight: 800;
    margin-bottom: 0.7rem;
}
.ktc-dash-card,
.ktc-mini-card,
.ktc-why-item,
.ktc-res-mini,
.ktc-fact {
    background: #fff;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 16px;
    padding: 1rem;
    height: 100%;
}
.ktc-dash-card i,
.ktc-mini-card i {
    font-size: 1.4rem;
    color: #1d4ed8;
    display: block;
    margin-bottom: 0.4rem;
}
.ktc-res-mini {
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    text-decoration: none;
    color: inherit;
    min-height: 7.5rem;
}
.ktc-info-banner {
    background: #f8fafc;
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 18px;
    padding: 1.25rem 1.4rem;
}
.ktc-process-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: grid;
    gap: 0.75rem;
}
.ktc-process-list li {
    display: flex;
    gap: 0.85rem;
    background: #fff;
    border-radius: 14px;
    padding: 0.9rem 1rem;
    border: 1px solid rgba(15, 23, 42, 0.08);
}
.ktc-process-list li span {
    flex: 0 0 2rem;
    height: 2rem;
    border-radius: 50%;
    background: #0f172a;
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
}
.ktc-course-card .ktc-mode-chip {
    position: absolute;
    left: 0.75rem;
    bottom: 0.75rem;
    background: #0f172a;
    color: #fff;
    border-radius: 999px;
    font-size: 0.72rem;
    padding: 0.2rem 0.55rem;
}
.ktc-fee-row {
    display: flex;
    justify-content: space-between;
    gap: 0.75rem;
    margin: 0.75rem 0;
}
.ktc-fee-label {
    display: block;
    font-size: 0.75rem;
    color: #64748b;
}
.ktc-learn-kicker,
.ktc-mentor-line {
    font-size: 0.88rem;
    color: #334155;
}
.ktc-status-approved { border-color: #16a34a; }
.ktc-status-rejected { border-color: #dc2626; }
.ktc-status-payment,
.ktc-status-review,
.ktc-status-verify { border-color: #d97706; }
.ktc-mobile-cta {
    display: none;
}
@media (max-width: 991px) {
    .ktc-mobile-cta {
        display: flex;
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        z-index: 1030;
        gap: 0.55rem;
        padding: 0.7rem 0.85rem calc(0.7rem + env(safe-area-inset-bottom));
        background: #fff;
        box-shadow: 0 -8px 24px rgba(15, 23, 42, 0.12);
    }
    .ktc-mobile-cta .btn {
        flex: 1;
        min-height: 46px;
        font-weight: 700;
    }
    body:has(.ktc-mobile-cta) {
        padding-bottom: 5.25rem;
    }
    .whatsapp-float,
    .whatsapp-float {
        bottom: 5.4rem;
    }
    .hero-enhanced h1,
    .ktc-hero-simple h1 {
        font-size: 1.85rem;
        line-height: 1.25;
    }
    .hero-lead,
    .hero-subtitle {
        font-size: 1.02rem;
    }
    .course-actions {
        display: flex;
        flex-direction: column;
    }
    .course-actions .btn {
        width: 100%;
    }
}
@media (min-width: 992px) {
    .ktc-mobile-cta { display: none !important; }
}

/* Institute public refinement */
.ktc-hero-institute {
    padding: 4.2rem 0 3.4rem;
}
.ktc-hero-institute h1 {
    letter-spacing: -0.03em;
    max-width: min(40rem, 100%);
    margin-left: auto;
    margin-right: auto;
}
.ktc-trust-line {
    margin: 1rem auto 1.4rem;
    max-width: 38rem;
    color: rgba(255,255,255,0.86);
    font-weight: 600;
}
.ktc-lang-tag {
    display: inline-block;
    font-size: 0.72rem;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    font-weight: 700;
    color: #1f2937;
    margin-bottom: 0.45rem;
    font-family: Inter, system-ui, sans-serif;
    direction: ltr;
}
.ktc-ur-panel {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    padding: 1rem 1.15rem;
    text-align: right;
    color: #111827;
}
.hero-enhanced .ktc-ur-panel,
.hero-enhanced .ktc-ur-panel p,
.hero-enhanced .ktc-ur-panel li,
.hero-enhanced .ktc-ur-panel span,
.hero-enhanced .ktc-ur-panel h3,
.hero-enhanced .ktc-ur-panel .ktc-lang-tag,
.hero-enhanced .ktc-ur-panel .ktc-lang-tag,
.cta-band .ktc-ur-panel:not(.ktc-ur-on-dark),
.cta-band .ktc-ur-panel:not(.ktc-ur-on-dark) p,
.ktc-ur-panel,
.ktc-ur-panel p,
.ktc-ur-panel li,
.ktc-ur-panel h3,
.ktc-ur-panel span,
.ktc-ur-panel .ktc-lang-tag,
.ktc-ur-panel .ktc-lang-tag,
.ktc-en-col,
.ktc-en-col p,
.ktc-en-col h3,
.ktc-en-col span,
.ktc-ur-col,
.ktc-ur-col p,
.ktc-ur-col h3,
.ktc-ur-col span,
.ktc-highlight-card,
.ktc-highlight-card p,
.ktc-highlight-card h2,
.ktc-highlight-card h3,
.ktc-why-card,
.ktc-why-card strong,
.ktc-why-card span,
.ktc-mini-card,
.ktc-mini-card strong,
.ktc-dash-card,
.ktc-dash-card h3,
.ktc-dash-card p,
.ktc-step-card,
.ktc-step-card h3 {
    color: #111827 !important;
}
.ktc-ur-panel p,
.ktc-ur-panel li,
.ktc-ur-col p,
.ktc-ur-col h3 {
    font-family: "Noto Nastaliq Urdu", "Noto Naskh Arabic", serif;
    line-height: 2.05;
}
.ktc-ur-ol {
    padding-right: 1.2rem;
    margin: 0.4rem 0 0;
}
.ktc-ur-on-dark {
    background: rgba(15, 23, 42, 0.35);
    border-color: rgba(255,255,255,0.22);
    color: #ffffff;
    max-width: 40rem;
}
.cta-band .ktc-ur-on-dark,
.cta-band .ktc-ur-on-dark p,
.cta-band .ktc-ur-on-dark li,
.cta-band .ktc-ur-on-dark span,
.cta-band .ktc-ur-on-dark h3,
.hero-enhanced .ktc-ur-on-dark,
.hero-enhanced .ktc-ur-on-dark p,
.ktc-ur-on-dark p,
.ktc-ur-on-dark li,
.ktc-ur-on-dark span,
.ktc-ur-on-dark h3 {
    color: #ffffff !important;
}
.ktc-ur-on-dark .ktc-lang-tag {
    color: #e5e7eb;
}
.ktc-bi-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.25rem;
}
.ktc-en-col,
.ktc-ur-col {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    padding: 1.15rem 1.25rem;
}
.ktc-en-col h3,
.ktc-ur-col h3 {
    font-size: 1.15rem;
    margin-bottom: 0.55rem;
}
.ktc-highlight-card {
    background: #fff;
    border: 1px solid #dbe4f0;
    border-radius: 20px;
    padding: 1.5rem 1.35rem 1.35rem;
    box-shadow: 0 16px 40px rgba(15, 23, 42, 0.06);
}
.ktc-why-card,
.ktc-mini-card,
.ktc-dash-card,
.ktc-step-card,
.ktc-demo-card,
.ktc-mentor-home {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    padding: 1rem;
    height: 100%;
}
.ktc-why-card i,
.ktc-mini-card i {
    color: #1d4ed8;
    font-size: 1.35rem;
    display: block;
    margin-bottom: 0.4rem;
}
.ktc-step-num {
    display: inline-flex;
    width: 1.85rem;
    height: 1.85rem;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #0f172a;
    color: #fff;
    font-weight: 800;
    margin-bottom: 0.55rem;
}
.ktc-step-card h3,
.ktc-dash-card h3,
.ktc-demo-card h3,
.ktc-mentor-home h3 {
    font-size: 0.98rem;
    margin: 0 0 0.35rem;
}
.ktc-mentor-home img {
    width: 72px;
    height: 72px;
    object-fit: cover;
    border-radius: 50%;
    margin-bottom: 0.6rem;
}
.ktc-nav-links {
    flex-wrap: wrap;
}
.ktc-nav-links .nav-link {
    padding-left: 0.55rem;
    padding-right: 0.55rem;
    font-size: 0.9rem;
}
@media (max-width: 991px) {
    .ktc-bi-grid {
        grid-template-columns: 1fr;
    }
    .ktc-hero-institute h1 {
        max-width: none;
        font-size: 1.7rem;
    }
    .hero-buttons .btn,
    .ktc-highlight-card .btn {
        width: 100%;
        margin-bottom: 0.45rem;
    }
    .ktc-join-grid .col-lg {
        flex: 0 0 50%;
        max-width: 50%;
    }
}
@media (max-width: 420px) {
    .ktc-join-grid .col-6 {
        flex: 0 0 100%;
        max-width: 100%;
    }
}

.ktc-sch-thumb,
.ktc-sch-hero-img {
    width: 100%;
    max-height: 220px;
    object-fit: cover;
    border-radius: 0.85rem;
}
.ktc-sch-search {
    display: flex;
    gap: 0.6rem;
    flex-wrap: wrap;
}
.ktc-sch-search .form-control {
    flex: 1 1 220px;
}
.ktc-sch-verify .ktc-sch-success {
    background: #f0fdf4;
    border: 1px solid #bbf7d0;
    border-radius: 0.9rem;
    padding: 1rem 1.1rem;
}
.ktc-quiz-home,
.ktc-quiz-card {
    background: #fff;
    border: 1px solid var(--border-color, #e5e7eb);
    border-radius: 1.1rem;
    padding: 1.5rem;
    box-shadow: var(--shadow-sm, 0 8px 24px rgba(15, 23, 42, 0.06));
}
.ktc-quiz-options {
    display: grid;
    gap: 0.7rem;
    margin-top: 1rem;
}
.ktc-quiz-option {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    border: 1px solid #dbe3ef;
    border-radius: 0.9rem;
    padding: 0.95rem 1rem;
    font-weight: 600;
    cursor: pointer;
}
.ktc-quiz-option input {
    margin-top: 0.25rem;
    width: 1.15rem;
    height: 1.15rem;
}
.ktc-quiz-bar {
    height: 8px;
    background: #e5e7eb;
    border-radius: 999px;
    overflow: hidden;
}
.ktc-quiz-bar span {
    display: block;
    height: 100%;
    background: #1e3a8a;
}
.ktc-quiz-result-card {
    border: 1px solid #e5e7eb;
    border-radius: 1rem;
    padding: 1.15rem;
    margin-top: 1rem;
}
.ktc-quiz-result-card img {
    width: 100%;
    max-height: 180px;
    object-fit: cover;
    border-radius: 0.75rem;
    margin-bottom: 0.75rem;
}
@media (max-width: 576px) {
    .ktc-quiz-option {
        font-size: 1.02rem;
        min-height: 52px;
    }
    .ktc-quiz-card .btn-lg {
        min-height: 48px;
    }
}

.ktc-notify-card {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    padding: 1rem;
    margin-bottom: 0.85rem;
    color: #111827;
}
.ktc-notify-unread {
    border-color: #f59e0b;
}
.ktc-notify-media img {
    width: 100%;
    height: auto;
    max-height: 220px;
    object-fit: contain;
    background: #f8fafc;
    border-radius: 12px;
}
@media (min-width: 768px) {
    .ktc-notify-card {
        flex-direction: row;
        align-items: flex-start;
    }
    .ktc-notify-media {
        flex: 0 0 220px;
        max-width: 220px;
    }
}

.ktc-admit-guide-card { margin-top: 0.25rem; }
.ktc-admit-guide-thumb {
    position: relative;
    display: block;
    overflow: hidden;
    border-radius: 16px;
    background: #0b1220;
}
.ktc-admit-guide-thumb img {
    width: 100%;
    height: auto;
    max-height: 360px;
    object-fit: contain;
    display: block;
}
.ktc-admit-guide-play {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 2.5rem;
    background: rgba(11, 18, 32, 0.28);
}
.ktc-admit-guide-cta-bar {
    display: flex;
    gap: 1rem;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 16px;
    padding: 1.15rem 1.25rem;
}
.ktc-admit-guide-player,
.ktc-admit-guide-video {
    position: relative;
    width: 100%;
    background: #0b1220;
    border-radius: 16px;
    overflow: hidden;
}
.ktc-admit-guide-video iframe,
.ktc-admit-guide-video video {
    width: 100%;
    min-height: 320px;
    border: 0;
    display: block;
}
@media (max-width: 767.98px) {
    .ktc-admit-guide-cta-bar { align-items: stretch; }
    .ktc-admit-guide-cta-bar .btn { width: 100%; }
}

.ktc-page-part {
    scroll-margin-top: 5.5rem;
}
.ktc-page-split {
    height: 1px;
    max-width: 72rem;
    margin: 0 auto;
    background: linear-gradient(90deg, transparent, #cbd5e1, transparent);
}
.ktc-page-part-process,
.ktc-page-part-faq {
    background: #f8fafc;
    border-top: 1px solid #e2e8f0;
    border-bottom: 1px solid #e2e8f0;
}
.ktc-page-part-process .section-header h2,
.ktc-page-part-faq .section-header h2,
.ktc-page-part-about .section-kicker,
.ktc-page-part-contact .section-header h2 {
    letter-spacing: 0.01em;
}
.ktc-page-part-faq .accordion-button {
    min-height: 3rem;
}
@media (max-width: 767.98px) {
    .ktc-page-part {
        scroll-margin-top: 4.75rem;
    }
    .ktc-page-part .hero-buttons .btn,
    .ktc-page-part .btn-lg {
        min-height: 44px;
    }
    .ktc-page-part img {
        max-width: 100%;
        height: auto;
    }
}

.ktc-fee-note-compact {
    margin-top: 0.35rem;
    margin-bottom: 0.15rem;
}
.ktc-fee-note-compact strong {
    display: block;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    color: #1d4ed8;
}
.ktc-fee-note-compact p {
    margin: 0.2rem 0 0;
    font-size: 0.82rem;
    line-height: 1.45;
    color: #475569;
}
.ktc-fee-note-compact-line,
.ktc-fee-note-compact-line {
    font-size: 0.8rem;
    color: #334155;
    margin: 0.2rem 0 0.75rem;
}
.ktc-fee-note-panel {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    padding: 0.85rem 0.95rem;
    margin: 0.35rem 0 1rem;
}
.ktc-fee-note-panel strong {
    display: block;
    color: #0f172a;
    font-size: 0.92rem;
    margin-bottom: 0.25rem;
}
.ktc-fee-note-panel p {
    margin: 0;
    font-size: 0.86rem;
    line-height: 1.5;
    color: #334155;
}
.ktc-fee-note-full,
.ktc-fee-note-apply {
    margin-bottom: 1.25rem;
}
.ktc-fee-note-full p,
.ktc-fee-note-apply p {
    color: #334155;
}
@media (max-width: 767.98px) {
    .ktc-fee-note-compact p,
    .ktc-fee-note-panel p {
        font-size: 0.84rem;
    }
    .ktc-fee-note-apply,
    .ktc-fee-note-full {
        padding: 1.1rem 1rem;
    }
}

.ktc-jobs-hero {
    background: linear-gradient(160deg, #071018 0%, #0b1c33 55%, #123056 100%);
    color: #fff;
    padding: 3.2rem 0 2.6rem;
}
.ktc-jobs-hero h1,
.ktc-jobs-hero h2,
.ktc-jobs-hero .ktc-jobs-lead,
.ktc-jobs-hero p:not(.ktc-jobs-kicker) {
    color: #ffffff !important;
}
.ktc-jobs-kicker {
    letter-spacing: .12em;
    text-transform: uppercase;
    font-size: .78rem;
    color: #fbbf24 !important;
    font-weight: 700;
    margin-bottom: .6rem;
}
.ktc-jobs-hero h1 {
    font-weight: 800;
    margin-bottom: .75rem;
    color: #ffffff !important;
    text-shadow: 0 1px 8px rgba(0, 0, 0, .35);
}
.ktc-jobs-lead {
    max-width: 42rem;
    color: rgba(255, 255, 255, .92) !important;
    margin: 0;
}
.ktc-jobs-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .65rem;
    margin-top: 1.15rem;
}
.ktc-jobs-hero-actions .btn {
    min-height: 44px;
}
.ktc-jobs-hero .btn-outline-light {
    color: #fff;
    border-color: rgba(255, 255, 255, .85);
}
.ktc-jobs-hero .btn-outline-light:hover {
    color: #0b1c33;
    background: #fff;
}
.ktc-jobs-hero .ktc-job-badge {
    background: rgba(251, 191, 36, .18);
    color: #fde68a;
}
.ktc-jobs-filters .form-label {
    color: #0f172a;
    font-weight: 700;
}
.ktc-jobs-section h2,
.ktc-jobs-section h3,
.ktc-job-card h3,
.ktc-job-franchise h3 {
    color: #0b1f3a;
}
.ktc-job-card-excerpt {
    color: #475569;
    font-size: .92rem;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.ktc-job-card-actions {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
}
.ktc-job-card-actions .btn {
    flex: 1 1 8rem;
    min-height: 44px;
}
.ktc-job-franchise-status {
    color: #15803d;
    font-weight: 700;
    font-size: .85rem;
}
.ktc-jobs-pagination {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .75rem;
    margin-top: 1.5rem;
}
.ktc-jobs-page-status {
    color: #334155;
    font-weight: 600;
}
.ktc-jobs-filters {
    background: #fff;
    border: 1px solid rgba(15,23,42,.08);
    border-radius: 1rem;
    padding: 1rem 1.1rem;
    box-shadow: 0 10px 30px rgba(15,23,42,.06);
}
.ktc-job-card, .ktc-job-franchise, .ktc-job-side, .ktc-job-block {
    background: #fff;
    border: 1px solid rgba(15,23,42,.08);
    border-radius: 1rem;
    padding: 1.15rem 1.2rem;
    height: 100%;
    min-width: 0;
    overflow-wrap: anywhere;
    box-shadow: 0 8px 24px rgba(15,23,42,.05);
}
.ktc-job-card h3 { font-size: 1.15rem; margin-bottom: .35rem; }
.ktc-job-card-cat, .ktc-job-card-provider { color: #475569; margin-bottom: .35rem; }
.ktc-job-card-meta { list-style: none; padding: 0; margin: 0 0 .75rem; color: #334155; font-size: .92rem; }
.ktc-job-card-meta li { margin-bottom: .2rem; }
.ktc-job-cert-flag { color: #1d4ed8; font-weight: 700; font-size: .85rem; }
.ktc-job-card-img, .ktc-job-hero-img { width: 100%; height: auto; border-radius: .8rem; margin-bottom: .8rem; }
.ktc-job-facts { display: grid; gap: .55rem; }
.ktc-job-facts div { display: grid; grid-template-columns: 7.5rem 1fr; gap: .4rem; }
.ktc-job-facts dt { color: #64748b; font-weight: 600; }
.ktc-job-elig, .ktc-jobs-empty { background: #f8fafc; border-radius: .8rem; padding: .9rem 1rem; margin: 1rem 0; }
.ktc-job-share { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .75rem; }
.ktc-job-cert-option { display: flex; gap: .75rem; border: 1px solid #e2e8f0; border-radius: .75rem; padding: .75rem; margin-bottom: .5rem; }
.ktc-career-wrap { padding-top: 0; }
.ktc-career { max-width: 920px; }
.ktc-career-note, .ktc-career-quiet {
    color: #475569;
    font-size: .95rem;
    margin-bottom: 1rem;
}
.ktc-career-block {
    background: #fff;
    border: 1px solid rgba(15,23,42,.08);
    border-radius: 1rem;
    padding: 1.25rem 1.3rem;
    margin-bottom: 1rem;
    box-shadow: 0 8px 24px rgba(15,23,42,.04);
}
.ktc-career-block h2 {
    font-size: 1.35rem;
    font-weight: 800;
    margin-bottom: .75rem;
}
.ktc-career-lead { font-size: 1.05rem; color: #1e293b; }
.ktc-career-card {
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: .85rem;
    padding: 1rem;
    height: 100%;
}
.ktc-career-card-sm { min-height: 4.5rem; }
.ktc-career-card .bi { display: block; color: #1d4ed8; margin-bottom: .35rem; }
.ktc-career-chips { display: flex; flex-wrap: wrap; gap: .45rem; }
.ktc-career-chip {
    display: inline-block;
    background: #eff6ff;
    color: #1e3a8a;
    border-radius: 999px;
    padding: .35rem .75rem;
    font-weight: 600;
    font-size: .88rem;
}
.ktc-career-chip-tool { background: #f1f5f9; color: #0f172a; }
.ktc-career-roles { padding-left: 1.1rem; margin: 0; }
.ktc-career-roles li { margin-bottom: .45rem; }
.ktc-career-meta { list-style: none; padding: 0; margin: .5rem 0 0; font-size: .9rem; color: #334155; }
.ktc-career-roadmap {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: .6rem;
    list-style: none;
    padding: 0;
    margin: 0;
    counter-reset: ktc-step;
}
.ktc-career-roadmap li {
    background: #0f172a;
    color: #fff;
    border-radius: .8rem;
    padding: .85rem .7rem;
    counter-increment: ktc-step;
}
.ktc-career-roadmap li strong { display: block; font-size: .95rem; }
.ktc-career-roadmap li span { display: block; font-size: .78rem; opacity: .85; margin-top: .25rem; }
.ktc-career-roadmap li::before {
    content: counter(ktc-step);
    display: inline-flex;
    width: 1.4rem;
    height: 1.4rem;
    align-items: center;
    justify-content: center;
    background: #fbbf24;
    color: #111827;
    border-radius: 50%;
    font-weight: 800;
    font-size: .75rem;
    margin-bottom: .4rem;
}
@media (max-width: 991px) {
    .ktc-career-roadmap { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 576px) {
    .ktc-career-roadmap { grid-template-columns: 1fr 1fr; }
    .ktc-career-block { padding: 1rem; }
    .ktc-career-card-sm { min-height: 0; }
}

.ktc-job-badge {
    display: inline-block;
    background: #eff6ff;
    color: #1d4ed8;
    font-weight: 700;
    font-size: .78rem;
    letter-spacing: .04em;
    text-transform: uppercase;
    padding: .25rem .55rem;
    border-radius: .4rem;
}
.ktc-job-franchise {
    background: #fff;
    border: 1px solid rgba(15,23,42,.08);
    border-radius: 1rem;
    padding: 1.1rem 1.15rem;
    height: 100%;
    box-shadow: 0 8px 24px rgba(15,23,42,.05);
}
.ktc-job-franchise-logo {
    width: 56px;
    height: 56px;
    object-fit: cover;
    border-radius: .7rem;
    margin-bottom: .7rem;
    background: #f8fafc;
}
.ktc-jobs-filters .form-control,
.ktc-jobs-filters .form-select,
.ktc-jobs-filters .btn {
    min-height: 44px;
}
@media (max-width: 767.98px) {
    .ktc-jobs-hero { padding: 2.2rem 0 1.8rem; }
    .ktc-jobs-hero h1 { font-size: clamp(2rem, 9vw, 2.6rem); }
    .ktc-jobs-filters { padding: .85rem; }
    .ktc-job-facts div { grid-template-columns: 1fr; }
    .ktc-job-share .btn { min-height: 44px; }
    .ktc-job-card .btn,
    .ktc-job-franchise .btn { min-height: 44px; }
}

.ktc-lang-switch {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    flex-shrink: 0;
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.02em;
    padding: 0.2rem 0.45rem;
    border: 1px solid rgba(255, 255, 255, 0.35);
    border-radius: 999px;
    background: rgba(15, 23, 42, 0.25);
}
.ktc-lang-switch a {
    color: rgba(248, 250, 252, 0.78);
    text-decoration: none;
    padding: 0.12rem 0.4rem;
    border-radius: 999px;
    line-height: 1.2;
}
.ktc-lang-switch a.is-active {
    color: #0b1220;
    background: #f8fafc;
}
.ktc-lang-switch .ktc-lang-sep {
    opacity: 0.45;
    color: #fff;
}
.ktc-lang-switch-dark {
    border-color: rgba(148, 163, 184, 0.45);
    background: rgba(15, 23, 42, 0.45);
}
.admin-topbar .ktc-lang-switch {
    border-color: rgba(15, 23, 42, 0.15);
    background: #fff;
}
.admin-topbar .ktc-lang-switch a {
    color: #334155;
}
.admin-topbar .ktc-lang-switch a.is-active {
    background: #0b3d91;
    color: #fff;
}
.ktc-footer-portals {
    margin-bottom: 0;
}
.ktc-bi-grid-single {
    grid-template-columns: 1fr;
}
html[dir="rtl"] body.locale-ur,
body.locale-ur .hero-lead,
body.locale-ur .footer-text,
body.locale-ur .ktc-ur-col {
    font-family: "Noto Nastaliq Urdu", "Noto Naskh Arabic", "Plus Jakarta Sans", Tahoma, serif;
}
@media (max-width: 1199.98px) {
    .ktc-nav-actions {
        flex-wrap: wrap;
        width: 100%;
        margin: 0.75rem 0 0;
    }
    .ktc-lang-switch {
        width: 100%;
        justify-content: center;
        margin-bottom: 0.35rem;
    }
}

/* Public presentation upgrade — scoped, no panel styles */
html {
    overflow-x: hidden;
}
.ktc-hero-institute h1 {
    max-width: 22rem;
    font-size: clamp(1.75rem, 4vw, 2.75rem);
    line-height: 1.15;
}
.ktc-journey-grid {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
    gap: 1rem;
}
.ktc-journey-step {
    background: #fff;
    border: 1px solid var(--border-color);
    border-radius: 16px;
    padding: 1.15rem 1.2rem 1.2rem;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.05);
    height: 100%;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.ktc-journey-step:hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.08);
}
.ktc-journey-num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2rem;
    height: 2rem;
    border-radius: 999px;
    background: #1e3a8a;
    color: #fff;
    font-weight: 700;
    font-size: 0.85rem;
    margin-bottom: 0.65rem;
}
.ktc-journey-step h3 {
    font-size: 1.05rem;
    margin: 0 0 0.4rem;
    color: var(--text-primary);
}
.ktc-journey-step p {
    margin: 0;
    color: var(--text-secondary);
    font-size: 0.92rem;
    line-height: 1.5;
}
.ktc-course-card .course-image {
    width: 100%;
    height: auto;
    max-height: 220px;
    object-fit: contain;
    background: #f8fafc;
}
.ktc-site-header .btn-ktc-apply {
    font-weight: 700;
}
.ktc-navbar .nav-link:focus-visible,
.ktc-nav-actions a:focus-visible,
.footer a:focus-visible,
.ktc-journey-step:focus-within {
    outline: 2px solid var(--accent-color);
    outline-offset: 3px;
}
@media (max-width: 767.98px) {
    .hero-buttons .btn {
        width: 100%;
    }
    .ktc-hero-institute {
        padding: 2.6rem 0 2.2rem;
    }
    .footer-cta-actions .btn {
        width: 100%;
    }
}
@media (prefers-reduced-motion: reduce) {
    .ktc-journey-step,
    .ktc-course-card,
    .btn {
        transition: none !important;
    }
    .ktc-journey-step:hover {
        transform: none;
    }
}

/* Split hero + trust strip + course TOC */
.ktc-hero-split {
    padding: 3.2rem 0 2.4rem;
    text-align: left;
}
.ktc-hero-split .ktc-hero-grid {
    display: grid;
    gap: 1.25rem;
    position: relative;
    z-index: 3;
}
.ktc-hero-intro { order: 1; }
.ktc-hero-visual { order: 2; }
.ktc-hero-actions { order: 3; }
.ktc-hero-split h1,
.ktc-hero-institute.ktc-hero-split h1,
.ktc-hero-split .hero-lead {
    margin-left: 0;
    margin-right: 0;
    max-width: 36rem;
    text-align: left;
}
.ktc-hero-eyebrow {
    display: inline-block;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    font-size: 0.72rem;
    font-weight: 700;
    color: #fbbf24;
    margin-bottom: 0.65rem;
}
.ktc-hero-split .btn-outline-light {
    border: 2px solid rgba(255, 255, 255, 0.85);
    color: #fff;
    background: transparent;
}
.ktc-hero-split .btn-outline-light:hover,
.ktc-hero-split .btn-outline-light:focus-visible {
    background: rgba(255, 255, 255, 0.12);
    color: #fff;
}
.ktc-hero-trust {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem 1.1rem;
    margin-top: 1rem;
    color: rgba(248, 250, 252, 0.88);
    font-size: 0.9rem;
    font-weight: 600;
}
.ktc-hero-trust i { color: #fbbf24; margin-right: 0.3rem; }
.ktc-hero-stage {
    background: rgba(255, 255, 255, 0.07);
    border: 1px solid rgba(255, 255, 255, 0.12);
    border-radius: 20px;
    padding: 1.15rem 1.15rem 1.25rem;
    text-align: center;
}
.ktc-hero-logo {
    max-width: min(220px, 70%);
    height: auto;
    max-height: 72px;
    object-fit: contain;
}
.ktc-hero-stage-label {
    color: rgba(226, 232, 240, 0.9);
    font-size: 0.85rem;
    font-weight: 600;
    margin: 0.65rem 0 0;
}
.ktc-hero-mosaic {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.45rem;
    margin-top: 0.85rem;
}
.ktc-hero-mosaic-card {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    min-height: 2.5rem;
    padding: 0.4rem 0.55rem;
    cursor: pointer;
    text-decoration: none;
    border-radius: 10px;
    background: rgba(15, 23, 42, 0.55);
    border: 1px solid rgba(255, 255, 255, 0.08);
    transition: transform 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
}
.ktc-hero-mosaic-card i {
    flex-shrink: 0;
    font-size: 1.05rem;
    color: #fbbf24;
    line-height: 1;
}
.ktc-hero-mosaic-card span {
    color: #f8fafc;
    font-size: 0.75rem;
    font-weight: 600;
    text-align: left;
    line-height: 1.25;
}
.ktc-hero-mosaic-card:hover,
.ktc-hero-mosaic-card:focus-visible {
    transform: translateY(-2px);
    background: rgba(15, 23, 42, 0.78);
    box-shadow: 0 10px 22px rgba(0, 0, 0, 0.28);
    outline: 2px solid #fbbf24;
    outline-offset: 2px;
}
.ktc-trust-strip {
    background: #0f172a;
    border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    padding: 0.75rem 0;
}
.ktc-trust-strip-list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem 1.15rem;
    justify-content: center;
    list-style: none;
    margin: 0;
    padding: 0;
    color: #e2e8f0;
    font-size: 0.86rem;
    font-weight: 600;
}
.ktc-trust-strip-list i {
    color: #fbbf24;
    margin-right: 0.3rem;
}
.ktc-course-toc {
    display: flex;
    flex-wrap: wrap;
    gap: 0.45rem 0.75rem;
    font-size: 0.86rem;
}
.ktc-course-toc a {
    color: var(--text-secondary, #475569);
    text-decoration: none;
    border: 1px solid var(--border-color, #e2e8f0);
    border-radius: 999px;
    padding: 0.28rem 0.7rem;
    background: #fff;
}
.ktc-course-toc a:hover,
.ktc-course-toc a:focus-visible {
    color: var(--primary-color, #1e3a8a);
    outline: 2px solid var(--accent-color, #f59e0b);
    outline-offset: 2px;
}
.ktc-course-card .course-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}
.ktc-course-card .course-description {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
@media (min-width: 992px) {
    .ktc-hero-split {
        padding: 4rem 0 3rem;
    }
    .ktc-hero-split .ktc-hero-grid {
        grid-template-columns: 1.05fr 0.95fr;
        grid-template-areas: "intro visual" "actions visual";
        align-items: center;
        column-gap: 2.5rem;
        row-gap: 1.1rem;
    }
    .ktc-hero-intro { grid-area: intro; order: unset; }
    .ktc-hero-actions { grid-area: actions; order: unset; }
    .ktc-hero-visual { grid-area: visual; order: unset; }
    .ktc-hero-split .hero-buttons .btn { width: auto; }
}
@media (max-width: 991.98px) {
    .ktc-hero-split { padding: 2rem 0 1.5rem; }
}
@media (max-width: 359.98px) {
    .ktc-hero-split h1 { font-size: 1.45rem; }
    .ktc-trust-strip-list { font-size: 0.78rem; }
}

/* Homepage: How online learning works — scoped to this section only */
.ktc-how-online .section-header p {
    max-width: 40rem;
    margin-left: auto;
    margin-right: auto;
}
.ktc-how-online-grid {
    list-style: none;
    margin: 1.5rem 0 0;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.85rem;
}
.ktc-how-online-card {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-height: 11rem;
    padding: 1.05rem 1.1rem 1.15rem;
    background: #fff;
    border: 1px solid var(--border-color, #e2e8f0);
    border-radius: 16px;
    box-shadow: 0 8px 22px rgba(15, 23, 42, 0.05);
    color: inherit;
    text-decoration: none;
    cursor: pointer;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.ktc-how-online-card:hover,
.ktc-how-online-card:focus-visible {
    transform: translateY(-3px);
    box-shadow: 0 12px 28px rgba(30, 58, 138, 0.12);
    outline: 2px solid #1e3a8a;
    outline-offset: 2px;
    color: inherit;
}
.ktc-how-online-num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1.85rem;
    height: 1.85rem;
    border-radius: 999px;
    background: #1e3a8a;
    color: #fff;
    font-size: 0.72rem;
    font-weight: 700;
    margin-bottom: 0.45rem;
}
.ktc-how-online-card > .bi {
    color: #1e3a8a;
    font-size: 1.25rem;
    margin-bottom: 0.35rem;
}
.ktc-how-online-card h3 {
    font-size: 0.98rem;
    font-weight: 700;
    color: #0f172a;
    margin: 0 0 0.35rem;
}
.ktc-how-online-card p {
    margin: 0;
    font-size: 0.86rem;
    color: #475569;
    line-height: 1.45;
}
.ktc-how-online-ctas {
    display: flex;
    flex-wrap: wrap;
    gap: 0.6rem;
    justify-content: center;
    margin-top: 1.5rem;
}
@media (min-width: 768px) {
    .ktc-how-online-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}
@media (min-width: 1200px) {
    .ktc-how-online-grid {
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }
}
@media (max-width: 575.98px) {
    .ktc-how-online-grid {
        grid-template-columns: 1fr;
    }
    .ktc-how-online-card {
        min-height: unset;
        padding: 1rem 1.05rem;
    }
    .ktc-how-online-ctas .btn {
        width: 100%;
    }
}
@media (prefers-reduced-motion: reduce) {
    .ktc-hero-mosaic-card,
    .ktc-how-online-card,
    #courses .ktc-home-course-item,
    #course-quiz .ktc-quiz-course-item,
    #what-is-ktc a.ktc-why-card {
        transition: none;
    }
    .ktc-hero-mosaic-card:hover,
    .ktc-how-online-card:hover,
    #courses .ktc-home-course-item:hover,
    #course-quiz .ktc-quiz-course-item:hover,
    #what-is-ktc a.ktc-why-card:hover {
        transform: none;
    }
}

/* Homepage course picker — scoped to #courses and #course-quiz only */
#courses .ktc-home-course-grid,
#course-quiz .ktc-quiz-course-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.65rem;
    margin: 1.25rem 0 1.35rem;
}
#courses .ktc-home-course-item,
#course-quiz .ktc-quiz-course-item {
    display: flex;
    align-items: center;
    gap: 0.6rem;
    min-height: 3.1rem;
    padding: 0.7rem 0.85rem;
    background: #fff;
    border: 1px solid var(--border-color, #e5e7eb);
    border-radius: 12px;
    text-decoration: none;
    color: var(--text-color, #0f172a);
    box-shadow: var(--shadow-sm, 0 8px 24px rgba(15, 23, 42, 0.06));
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}
#courses .ktc-home-course-item i,
#course-quiz .ktc-quiz-course-item i {
    flex-shrink: 0;
    font-size: 1.15rem;
    color: var(--primary-color, #1d4ed8);
    line-height: 1;
}
#courses .ktc-home-course-item span,
#course-quiz .ktc-quiz-course-item span {
    font-size: 0.9rem;
    font-weight: 600;
    line-height: 1.3;
}
#courses .ktc-home-course-item:hover,
#courses .ktc-home-course-item:focus-visible,
#course-quiz .ktc-quiz-course-item:hover,
#course-quiz .ktc-quiz-course-item:focus-visible {
    transform: translateY(-2px);
    border-color: var(--primary-color, #1d4ed8);
    box-shadow: 0 10px 22px rgba(15, 23, 42, 0.1);
    outline: 2px solid var(--accent-color, #f59e0b);
    outline-offset: 2px;
    color: var(--primary-color, #1d4ed8);
}
#course-quiz .ktc-quiz-course-grid {
    margin: 1.1rem 0 0;
}
@media (min-width: 768px) {
    #courses .ktc-home-course-grid,
    #course-quiz .ktc-quiz-course-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
}
@media (min-width: 992px) {
    #courses .ktc-home-course-grid {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
    #course-quiz .ktc-quiz-course-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* Homepage only: clickable Why-KTC cards + section gap ornaments */
.ktc-home {
    background-image:
        radial-gradient(ellipse 70% 28% at 8% 12%, rgba(29, 78, 216, 0.05), transparent 70%),
        radial-gradient(ellipse 55% 22% at 94% 38%, rgba(245, 158, 11, 0.06), transparent 68%),
        radial-gradient(ellipse 50% 20% at 50% 72%, rgba(14, 165, 233, 0.04), transparent 70%);
}
.ktc-home > .section {
    padding-top: 3rem;
    padding-bottom: 3rem;
}
.ktc-home-bridge {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.45rem;
    padding: 0.35rem 1rem;
    pointer-events: none;
}
.ktc-home-bridge-line {
    display: block;
    width: min(28vw, 7.5rem);
    height: 2px;
    border-radius: 99px;
    background: linear-gradient(90deg, transparent, #93c5fd, #fbbf24, #93c5fd, transparent);
}
.ktc-home-bridge-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #f59e0b;
    box-shadow: 0 0 0 3px rgba(245, 158, 11, 0.18);
}
.ktc-home-bridge i {
    color: #1d4ed8;
    font-size: 1.05rem;
    line-height: 1;
}
#what-is-ktc a.ktc-why-card {
    display: block;
    text-decoration: none;
    cursor: pointer;
    transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}
#what-is-ktc a.ktc-why-card:hover,
#what-is-ktc a.ktc-why-card:focus-visible {
    transform: translateY(-3px);
    border-color: #1d4ed8;
    box-shadow: 0 12px 26px rgba(15, 23, 42, 0.1);
    outline: 2px solid #f59e0b;
    outline-offset: 2px;
}

/* Production polish — public website only (existing components) */
.ktc-site-header {
    isolation: isolate;
}
.ktc-navbar .dropdown-item {
    padding: 0.55rem 1.1rem;
    font-size: 0.92rem;
    border-radius: 8px;
    margin: 0 0.35rem;
}
.ktc-navbar .dropdown-item:hover,
.ktc-navbar .dropdown-item:focus {
    background: #f8fafc;
    color: #0f172a;
}
.ktc-navbar .dropdown-header {
    font-size: 0.72rem;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #64748b;
}
.ktc-enroll-acc .accordion-item {
    border: 1px solid #e2e8f0;
    border-radius: 12px !important;
    overflow: hidden;
    margin-bottom: 0.55rem;
    background: #fff;
}
.ktc-enroll-acc .accordion-button {
    font-weight: 650;
    font-size: 0.98rem;
    box-shadow: none;
}
.ktc-enroll-acc .accordion-button:not(.collapsed) {
    background: #f8fafc;
    color: #0f172a;
}
.ktc-mini-card,
.ktc-dash-card {
    min-height: 5.25rem;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.ktc-mini-card:hover,
.ktc-dash-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 24px rgba(15, 23, 42, 0.08);
}
.footer {
    overflow-x: hidden;
}
@media (max-width: 575.98px) {
    .ktc-home .hero-buttons .btn,
    .ktc-how-online-ctas .btn {
        width: 100%;
    }
    .ktc-navbar .ktc-nav-actions .btn {
        width: 100%;
    }
}
@media (prefers-reduced-motion: reduce) {
    .ktc-how-online-card,
    .ktc-why-card,
    .ktc-journey-step,
    .ktc-mini-card,
    .ktc-dash-card,
    #what-is-ktc a.ktc-why-card {
        transition: none;
    }
    .ktc-how-online-card:hover,
    .ktc-why-card:hover,
    .ktc-journey-step:hover,
    .ktc-mini-card:hover,
    .ktc-dash-card:hover,
    #what-is-ktc a.ktc-why-card:hover {
        transform: none;
    }
}







