/* ----------------------------------- */
/* TOPBAR */
/* ----------------------------------- */
.topbar {
    background: #f9fbff;
    border-bottom: 1px solid #e5eaf3;
    font-size: 13px;
    color: #6b7280;
    padding: 6px 0;
}
.topbar a { 
    color:#374151; 
    text-decoration:none; 
    transition:.2s;
}
.topbar a:hover { color:#0d6efd; }

/* ----------------------------------- */
/* NAVBAR */
/* ----------------------------------- */
.navbar-ss {
    background: rgba(255,255,255,0.9);
    backdrop-filter: blur(14px);
    box-shadow: 0 4px 18px rgba(0,0,0,0.05);
    padding: 15px 0;
    transition: .35s ease-in-out;
}
.navbar-ss.shrink {
    padding: 8px 0;
    box-shadow: 0 8px 30px rgba(0,0,0,.12);
}

/* LOGO */
.brand-ss {
    font-weight: 900;
    font-size: 22px;
    display:flex;
    align-items:center;
    gap:10px;
    color:#0d6efd !important;
}
.logo-mark {
    width: 40px;
    height: 40px;
    border-radius: 12px;
    display:grid;
    place-items:center;
    background: linear-gradient(135deg,#0d6efd,#4a90ff,#00c8ff);
    color:#fff;
    font-weight:700;
    font-size:15px;
    box-shadow:0 6px 16px rgba(0,120,255,0.25);
    transition:.3s;
}
.brand-ss:hover .logo-mark { transform:translateY(-2px); }

/* NAV LINKS */
.nav-link-ss {
    color:#1f2937 !important;
    font-weight:600;
    padding:10px 16px;
    border-radius:8px;
    position:relative;
    display:flex;
    align-items:center;
    gap:8px;
    transition:.25s;
    font-size:15px;
}
.nav-link-ss i { opacity:.8; transition:.25s; }

.nav-link-ss::after {
    content:"";
    position:absolute;
    bottom:6px;
    left:50%;
    transform:translateX(-50%);
    width:0%;
    height:2px;
    background:#0d6efd;
    border-radius:50px;
    transition:.3s ease;
}
.nav-link-ss:hover::after { width:70%; }
.nav-link-ss:hover { background:rgba(13,110,253,0.07); color:#0d6efd !important; }
.nav-link-ss:hover i { opacity:1; color:#0d6efd; }

/* BUTTONS */
.btn-login {
    border-radius:30px;
    padding:7px 16px;
    font-weight:600;
    border:1.7px solid #0d6efd;
    color:#0d6efd;
    background:transparent;
    transition:.3s;
}
.btn-login:hover { background:#e8f1ff; }

.btn-signup {
    border-radius:30px;
    padding:7px 18px;
    font-weight:600;
    background:linear-gradient(135deg,#0d6efd,#4e8df7);
    border:none;
    color:#fff;
    box-shadow:0 4px 15px rgba(13,110,253,0.27);
    transition:.3s;
}
.btn-signup:hover { transform:translateY(-2px); }

/* MOBILE */
@media(max-width:991px){
    .topbar { display:none; }
}

/* ----------------------------------------- */
/* HERO SECTION */
/* ----------------------------------------- */
.hero-section {
    position: relative;
    width: 100%;
    padding: 14px 20px;
    background: #f8f9fa;
    color: #0d1a3a;
    overflow: hidden;
}

/* Soft Glow */
.hero-section::before {
    content: "";
    position: absolute;
    top: -120px;
    right: -160px;
    width: 400px;
    height: 400px;
    background: rgba(13,110,253,0.15);
    filter: blur(140px);
    border-radius: 50%;
}

/* Badge */
.hero-badge {
    background:#dbe8ff;
    padding:8px 16px;
    font-weight:600;
    display:inline-block;
    border-radius:50px;
    font-size:14px;
    color:#0d6efd;
}

/* Hero Text */
.hero-title {
    font-size: 48px;
    font-weight: 900;
    line-height: 1.2;
    margin-top: 20px;
}
.hero-title span.blue { color:#0d6efd; }
.hero-title span.green { color:#20c997; }

.hero-subtitle {
    font-size: 20px;
    opacity:.88;
    margin-top:20px;
    line-height:1.8;
    color:#475569;
}

/* Buttons */
.hero-buttons {
    margin-top: 40px;
    display:flex;
    gap:18px;
    flex-wrap:wrap;
}

.btn-hero-primary {
    padding:14px 32px;
    border-radius:50px;
    font-size:18px;
    font-weight:700;
    background:#0d6efd;
    color:white;
    border:none;
    box-shadow:0 10px 25px rgba(13,110,253,0.25);
}
.btn-hero-primary:hover { transform:translateY(-3px); }

.btn-hero-outline {
    padding:14px 32px;
    border-radius:50px;
    border:2px solid #0d6efd;
    background:transparent;
    color:#0d6efd;
    font-weight:700;
    font-size:18px;
}
.btn-hero-outline:hover { background:#eaf3ff; }

/* Right Image */
.hero-image-wrap { position:relative; text-align:center; }
.hero-image {
    width:650px;
    max-width:700px;
    border-radius:18px;
    box-shadow:0 12px 38px rgba(0,0,0,0.15);
}

/* Floating Cards */
.float-card {
    position:absolute;
    background:white;
    padding:10px 18px;
    border-radius:12px;
    font-size:14px;
    font-weight:600;
    box-shadow:0 8px 25px rgba(0,0,0,0.1);
}
.float-card i { margin-right:6px; }

.float-top { top:-25px; right:15%; }
.float-bottom { bottom:-15px; left:14%; background:#fff7e3; color:#F5A300; }

/* Features */
.hero-features {
    display:flex;
    gap:24px;
    flex-wrap:wrap;
    margin-top:30px;
    color:#475569;
    font-size:15px;
    font-weight:600;
}
.hero-features i { margin-right:6px; }

@media(max-width:992px){
    .hero-title { font-size:40px; text-align:center; }
    .hero-subtitle { text-align:center; }
    .hero-buttons { justify-content:center; }
    .hero-features { justify-content:center; }
    .float-card { display:none; }
    .hero-image { margin-top:40px; }
}
/* =============================== */
/* ABOUT SECTION */
/* =============================== */
.about-section {
    position: relative;
    padding: 120px 0;
    background: #ffffff;
    overflow: hidden;
}

/* BG Glow */
.about-section::before {
    content: "";
    position: absolute;
    top: -80px;
    left: -120px;
    width: 380px;
    height: 380px;
    background: rgba(0, 140, 255, 0.13);
    filter: blur(140px);
    border-radius: 50%;
    z-index: 0;
}

/* Badge */
.about-badge {
    background:#dbe8ff;
    display:inline-block;
    padding:7px 20px;
    border-radius:50px;
    font-size:14px;
    font-weight:700;
    color:#0d6efd;
    margin-bottom: 10px;
}

/* Title */
.about-title {
    font-size: 42px;
    font-weight: 900;
    line-height: 1.3;
    margin-bottom: 20px;
}
.about-title .blue { color:#0d6efd; }
.about-title .green { color:#20c997; }

/* Text */
.about-text {
    font-size: 18px;
    color:#475569;
    line-height:1.8;
    margin-bottom: 25px;
}

/* Features */
.about-features {
    display:grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px 20px;
    margin-bottom: 35px;
}
.about-feature i {
    color:#16a34a;
    margin-right: 8px;
    font-size: 18px;
}

/* CTA Button */
.btn-about {
    display:inline-block;
    padding:14px 34px;
    background:#0d6efd;
    color:white;
    font-weight:700;
    border-radius:50px;
    font-size:17px;
    box-shadow:0 10px 25px rgba(13,110,253,0.25);
    text-decoration:none;
}
.btn-about:hover { transform:translateY(-3px); }

/* =============================== */
/* RIGHT SIDE CATEGORY BOXES */
/* =============================== */
.about-categories {
    display:grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
}

.cat-box {
    background:#f8f9ff;
    padding:25px 22px;
    border-radius:16px;
    border:1px solid #e4e9f2;
    box-shadow:0 8px 25px rgba(0,0,0,0.05);
    transition:.3s;
}
.cat-box:hover {
    transform:translateY(-4px);
    box-shadow:0 12px 30px rgba(0,0,0,0.1);
}

.cat-box i {
    font-size:32px;
    color:#0d6efd;
    margin-bottom:10px;
    display:block;
}

.cat-box h4 {
    font-size:20px;
    font-weight:700;
    margin-bottom:10px;
}

.cat-box p {
    font-size:15px;
    color:#4b5563;
    line-height:1.6;
}

/* RESPONSIVE */
@media(max-width:992px){
    .about-title { font-size:34px; text-align:center; }
    .about-text { text-align:center; }
    .about-badge { display:block; text-align:center; margin:auto; margin-bottom:15px; }
    .btn-about { display:block; margin:auto; text-align:center; width:max-content; }
    .about-features { grid-template-columns:1fr; text-align:center; }
    .about-categories { grid-template-columns:1fr; }
    .cat-box { text-align:center; }
}
/* =============================== */
/* COURSES SECTION */
/* =============================== */
.courses-section {
    position: relative;
    padding: 140px 0;
    background: #f9faff;
    overflow: hidden;
}

/* Glow Background */
.courses-section::before {
    content:"";
    position:absolute;
    right:-150px;
    top:-100px;
    width:420px;
    height:420px;
    background: rgba(13,110,253,0.12);
    filter:blur(140px);
    border-radius:50%;
}

/* Badge */
.courses-badge {
    background:#dbe8ff;
    padding:7px 20px;
    border-radius:50px;
    font-size:14px;
    font-weight:700;
    color:#0d6efd;
    display:inline-block;
    margin:auto;
    margin-bottom:15px;
}

/* Title */
.courses-title {
    text-align:center;
    font-size:42px;
    font-weight:900;
    color:#0d1a3a;
}
.courses-title .blue { color:#0d6efd; }
.courses-title .green { color:#20c997; }

/* Subtitle */
.courses-subtitle {
    text-align:center;
    max-width:720px;
    font-size:17px;
    margin:18px auto 30px;
    color:#475569;
    line-height:1.7;
}

/* Course card */
.course-card {
    background:#ffffff;
    padding:30px 24px;
    border-radius:16px;
    border:1px solid #e5e9f2;
    box-shadow:0 10px 25px rgba(0,0,0,0.05);
    transition:.3s;
    height:100%;
    position:relative;
}
.course-card:hover {
    transform:translateY(-6px);
    box-shadow:0 15px 32px rgba(0,0,0,0.12);
}

/* Icons */
.course-card i {
    font-size:40px;
    color:#0d6efd;
    margin-bottom:15px;
    display:block;
}

/* Heading */
.course-card h4 {
    font-size:22px;
    font-weight:700;
    margin-bottom:10px;
}

/* Text */
.course-card p {
    font-size:15px;
    color:#4b5563;
    line-height:1.7;
    margin-bottom:18px;
}

/* Button */
.course-btn {
    font-weight:600;
    color:#0d6efd;
    text-decoration:none;
    font-size:15px;
    transition:.3s;
}
.course-btn:hover {
    letter-spacing:1px;
}
.course-btn i {
    font-size:17px;
    margin-left:5px;
}

/* Responsive */
@media(max-width:992px){
    .courses-title { font-size:34px; }
    .course-card { text-align:center; }
    .course-card i { margin:auto; margin-bottom:12px; }
}


/* =============================== */
/* SERVICES SECTION */
/* =============================== */
.services-section {
    position: relative;
    padding: 140px 0;
    background: #ffffff;
    overflow: hidden;
}

/* Background Glow */
.services-section::before {
    content: "";
    position: absolute;
    top: 0;
    left: -140px;
    width: 420px;
    height: 420px;
    background: rgba(13,110,253,0.12);
    filter: blur(140px);
    border-radius: 50%;
}

/* Badge */
.services-badge {
    background:#dbe8ff;
    display:inline-block;
    padding:7px 20px;
    border-radius:50px;
    color:#0d6efd;
    font-weight:700;
    font-size:14px;
    margin:auto;
}

/* Title */
.services-title {
    text-align:center;
    font-size:42px;
    font-weight:900;
    margin-top:15px;
}
.services-title .blue { color:#0d6efd; }
.services-title .green { color:#20c997; }

/* Subtitle */
.services-subtitle {
    text-align:center;
    max-width:760px;
    margin:20px auto 40px;
    font-size:17px;
    color:#475569;
    line-height:1.7;
}

/* SERVICE CARD */
.service-card {
    background:#f8f9ff;
    padding:35px 26px;
    border-radius:18px;
    border:1px solid #e3e8f3;
    box-shadow:0 10px 25px rgba(0,0,0,0.05);
    transition:.3s;
    height:100%;
    position:relative;
    overflow:hidden;
}

.service-card:hover {
    transform:translateY(-6px);
    box-shadow:0 15px 35px rgba(0,0,0,0.12);
    background:white;
}

/* Icons */
.service-card i {
    font-size:42px;
    color:#0d6efd;
    margin-bottom:15px;
    display:block;
}

/* Heading */
.service-card h4 {
    font-size:22px;
    font-weight:800;
    margin-bottom:10px;
}

/* Text */
.service-card p {
    font-size:15px;
    color:#4b5563;
    line-height:1.6;
    margin-bottom:0;
}

/* Arrow */
.service-arrow {
    position:absolute;
    bottom:20px;
    right:22px;
    font-size:20px;
    color:#0d6efd;
    opacity:0;
    transition:.3s;
}
.service-card:hover .service-arrow {
    opacity:1;
    transform:translateX(4px);
}

/* Responsive */
@media(max-width:992px){
    .services-title { font-size:34px; }
    .service-card { text-align:center; }
    .service-arrow { display:none; }
}
/* =============================== */
/* CONTACT SECTION */
/* =============================== */
.contact-section {
    position: relative;
    padding: 140px 0;
    background:#f9fbff;
    overflow:hidden;
}

/* Glow */
.contact-section::before {
    content:"";
    position:absolute;
    top: -120px;
    left:-160px;
    width:420px;
    height:420px;
    background:rgba(13,110,253,0.12);
    filter:blur(140px);
    border-radius:50%;
}

/* Badge */
.contact-badge {
    background:#dbe8ff;
    padding:7px 20px;
    border-radius:50px;
    font-size:14px;
    color:#0d6efd;
    font-weight:700;
    display:inline-block;
    margin:auto;
}

/* Title */
.contact-title {
    text-align:center;
    font-size:42px;
    font-weight:900;
    margin-top:15px;
}
.contact-title .blue { color:#0d6efd; }
.contact-title .green { color:#20c997; }

/* Subtitle */
.contact-subtitle {
    text-align:center;
    max-width:760px;
    margin:18px auto 40px;
    font-size:17px;
    color:#475569;
    line-height:1.7;
}

/* LEFT INFO BOX */
.contact-info-box {
    background:linear-gradient(135deg,#0d6efd,#4a9bff,#20c997);
    padding:40px 32px;
    border-radius:18px;
    color:white;
    box-shadow:0 10px 25px rgba(0,0,0,0.12);
}

/* Info title */
.info-title {
    font-size:34px;
    font-weight:900;
    margin-bottom:20px;
}

.info-intro {
    font-size:17px;
    line-height:1.8;
    opacity:.95;
    margin-bottom:20px;
}

/* Next steps title */
.next-step-title {
    font-size:24px;
    margin-top:25px;
    margin-bottom:15px;
    font-weight:800;
}

/* Next steps list */
.next-step-list {
    list-style:none;
    padding:0;
}
.next-step-list li {
    font-size:16px;
    margin-bottom:10px;
    line-height:1.6;
}
.next-step-list i {
    color:#ffffff;
    margin-right:8px;
}

/* RIGHT FORM BOX */
.contact-form-box {
    background:#ffffff;
    padding:40px 32px;
    border-radius:18px;
    border:1px solid #e3e8f3;
    box-shadow:0 10px 25px rgba(0,0,0,0.05);
}

/* Form title */
.form-title {
    font-size:28px;
    font-weight:800;
    margin-bottom:25px;
}

/* Submit button */
.contact-btn {
    width:100%;
    padding:15px;
    font-size:17px;
    font-weight:700;
    border:none;
    border-radius:50px;
    background:#0d6efd;
    color:white;
    box-shadow:0 10px 25px rgba(13,110,253,0.25);
    transition:.3s;
}
.contact-btn:hover {
    transform:translateY(-3px);
}

/* Responsive */
@media(max-width:992px){
    .contact-title { font-size:34px; }
    .contact-info-box, .contact-form-box { padding:30px 22px; }
}






/* =============================== */
/* PROJECTS SECTION */
/* =============================== */
.projects-section {
    position: relative;
    padding: 140px 0;
    background:#ffffff;
    overflow:hidden;
}

/* Glow background */
.projects-section::before {
    content:"";
    position:absolute;
    top:-160px;
    right:-160px;
    width:450px;
    height:450px;
    background:rgba(13,110,253,0.12);
    filter:blur(150px);
    border-radius:50%;
}

/* Badge */
.projects-badge {
    background:#dbe8ff;
    padding:7px 20px;
    border-radius:50px;
    font-size:14px;
    font-weight:700;
    color:#0d6efd;
    display:inline-block;
    margin:auto;
}

/* Title */
.projects-title {
    text-align:center;
    font-size:42px;
    font-weight:900;
    margin-top:15px;
}
.projects-title .blue { color:#0d6efd; }
.projects-title .green { color:#20c997; }

/* Subtitle */
.projects-subtitle {
    text-align:center;
    max-width:760px;
    margin:18px auto 40px;
    font-size:17px;
    color:#475569;
    line-height:1.7;
}

/* Card */
.project-card {
    background:#f8f9ff;
    padding:30px 26px;
    border-radius:18px;
    border:1px solid #e6ebf4;
    box-shadow:0 10px 25px rgba(0,0,0,0.05);
    transition:.3s;
    height:100%;
}
.project-card:hover {
    transform:translateY(-6px);
    background:white;
    box-shadow:0 15px 32px rgba(0,0,0,0.12);
}

/* Tag */
.project-tag {
    background:#0d6efd;
    color:white;
    font-size:13px;
    padding:6px 14px;
    border-radius:50px;
    font-weight:600;
    display:inline-block;
    margin-bottom:12px;
}

/* Title small */
.project-title-sm {
    font-size:20px;
    font-weight:800;
    margin-bottom:10px;
    color:#1e293b;
}

/* Text */
.project-text {
    font-size:15px;
    color:#4b5563;
    margin-bottom:18px;
    line-height:1.6;
}

/* Button */
.project-btn {
    font-weight:700;
    color:#0d6efd;
    font-size:15px;
    text-decoration:none;
}
.project-btn:hover {
    letter-spacing:1px;
}
.project-btn i { margin-left:6px; }

/* Responsive */
@media(max-width:992px){
    .projects-title { font-size:34px; }
}
/* =============================== */
/* FOOTER SECTION */
/* =============================== */
.footer-section {
    position: relative;
    padding: 80px 0 40px;
    background:#0d1a3a;
    color:white;
    overflow:hidden;
}

/* Glow Background */
.footer-section::before {
    content:"";
    position:absolute;
    top:-200px;
    right:-180px;
    width:550px;
    height:550px;
    background:rgba(0, 120, 255, 0.25);
    filter:blur(180px);
    border-radius:50%;
}

/* Footer boxes */
.footer-box { margin-bottom:20px; }

/* Title */
.footer-title {
    font-size:30px;
    font-weight:900;
    margin-bottom:12px;
}

/* About text */
.footer-text {
    color:#dbe4ff;
    line-height:1.7;
    font-size:15px;
}

/* Social icons */
.footer-social a {
    display:inline-block;
    width:38px;
    height:38px;
    line-height:38px;
    text-align:center;
    margin-right:8px;
    background:rgba(255,255,255,0.1);
    color:white;
    border-radius:50%;
    font-size:17px;
    transition:.3s;
}
.footer-social a:hover {
    background:#0d6efd;
}

/* Headings */
.footer-heading {
    font-size:20px;
    font-weight:800;
    margin-bottom:12px;
}

/* Links */
.footer-links {
    list-style:none;
    padding:0;
}
.footer-links li { margin-bottom:10px; }
.footer-links a {
    color:#dbe4ff;
    text-decoration:none;
    font-size:15px;
    transition:.3s;
}
.footer-links a:hover {
    color:white;
    margin-left:4px;
}
.footer-links i {
    margin-right:6px;
    color:#0d6efd;
}

/* Divider */
.footer-divider {
    border-color:rgba(255,255,255,0.1);
    margin:30px 0 20px;
}

/* Copyright */
.footer-bottom {
    text-align:center;
    color:#c9d3f5;
    font-size:14px;
}

/* Responsive */
@media(max-width:992px){
    .footer-title { font-size:26px; }
    .footer-heading { font-size:19px; }
    .footer-section { padding-top:60px; }
}


/* =============================== */
/* BLOG SECTION */
/* =============================== */
.blog-section {
    position: relative;
    padding: 140px 0;
    background: #f9fbff;
    overflow: hidden;
}

/* Glow Background */
.blog-section::before {
    content:"";
    position:absolute;
    bottom:-120px;
    right:-140px;
    width:420px;
    height:420px;
    background: rgba(13,110,253,0.12);
    filter:blur(140px);
    border-radius:50%;
}

/* Badge */
.blog-badge {
    background:#dbe8ff;
    padding:7px 20px;
    border-radius:50px;
    color:#0d6efd;
    font-size:14px;
    font-weight:700;
    display:inline-block;
    margin:auto;
}

/* Title */
.blog-title {
    text-align:center;
    font-size:42px;
    font-weight:900;
    margin-top:15px;
}
.blog-title .blue { color:#0d6efd; }
.blog-title .green { color:#20c997; }

/* Subtitle */
.blog-subtitle {
    text-align:center;
    max-width:740px;
    margin:18px auto 35px;
    color:#475569;
    font-size:17px;
    line-height:1.7;
}

/* BLOG CARD */
.blog-card {
    background:#ffffff;
    padding:28px 24px;
    border-radius:18px;
    border:1px solid #e5e9f2;
    box-shadow:0 10px 25px rgba(0,0,0,0.05);
    height:100%;
    transition:.3s;
    position:relative;
}
.blog-card:hover {
    transform:translateY(-6px);
    box-shadow:0 15px 32px rgba(0,0,0,0.12);
}

/* Category Label */
.blog-category {
    display:inline-block;
    background:#0d6efd;
    color:white;
    padding:5px 14px;
    font-size:13px;
    border-radius:50px;
    font-weight:600;
    margin-bottom:12px;
}

/* Heading */
.blog-card h4 {
    font-size:20px;
    font-weight:800;
    margin-bottom:10px;
    color:#1e293b;
    line-height:1.4;
}

/* Text */
.blog-text {
    font-size:15px;
    color:#4b5563;
    margin-bottom:18px;
    line-height:1.6;
}

/* Date */
.blog-date {
    font-size:14px;
    color:#6b7280;
    margin-bottom:10px;
}
.blog-date i { margin-right:6px; }

/* Read More Button */
.blog-btn {
    font-weight:700;
    color:#0d6efd;
    font-size:15px;
    text-decoration:none;
    transition:.3s;
}
.blog-btn:hover {
    letter-spacing:1px;
}
.blog-btn i {
    margin-left:6px;
}

/* Responsive */
@media(max-width:992px){
    .blog-title { font-size:34px; }
    .blog-card { text-align:center; }
}
/* =============================== */
/* MOBILE RESPONSIVE FIXES */
/* =============================== */

@media (max-width: 768px) {

  /* Hero */
  .hero-section {
    padding: 40px 0;
    text-align: center;
  }

  .hero-title {
    font-size: 32px;
    line-height: 42px;
  }

  .hero-subtitle {
    font-size: 15px;
  }

  .hero-buttons a {
    width: 100%;
    text-align: center;
  }

  .hero-image {
    width: 100%;
    margin-top: 20px;
  }

  .float-card {
    display: none; /* hide floating cards for clean mobile view */
  }

  /* About */
  .about-section {
    padding: 40px 0;
  }

  .about-categories {
    display: grid;
    grid-template-columns: 1fr;
    gap: 15px;
  }

  /* Courses */
  .course-card {
    text-align: center;
    padding: 20px;
  }

  .course-card i {
    font-size: 40px;
  }

  /* Services */
  .service-card {
    padding: 20px;
  }

  /* Blog */
  .blog-card {
    padding: 20px;
  }

  /* Projects */
  .project-card {
    padding: 20px;
  }

  /* Contact */
  .contact-info-box, 
  .contact-form-box {
    padding: 20px;
  }

  .contact-btn {
    width: 100%;
    text-align: center;
  }
}

/* Extra-small devices */
@media (max-width: 480px) {
  .hero-title {
    font-size: 28px;
  }

  .courses-title,
  .services-title,
  .blog-title,
  .projects-title,
  .contact-title {
    font-size: 26px;
  }
}
/* ===== Small text-like icons inside buttons ===== */
.course-card .btn i{
  font-size: 0.65rem;      /* text-sized icon */
  margin-right: 4px;
  vertical-align: middle;
  opacity: 0.8;
}

/* Optional: slightly highlight icon on hover */
.course-card .btn:hover i{
  opacity: 1;
}