/* SCUK Theme */
:root {
    --primary-red: #d62828;
    --primary-blue: #0a3d91;
    --accent-blue: #3b82f6;
    --white: #ffffff;
    --dark: #0f172a;
    --muted: #64748b;
    --light-bg: #f8fafc;
    --border: #e5e7eb;

    /* Main theme colors - Red primary, Blue accent */
    --scuk-red: #d62828;
    --scuk-blue: #0a3d91;
    --scuk-dark: #0f172a;
    --scuk-muted: #64748b;
}

* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html, body {
    font-family: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    color: var(--dark);
    background: var(--white);
    line-height: 1.6;
}

body {
    padding-top: 0;
}

.container {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 16px;
}

a {
    color: var(--primary-red);
    text-decoration: none;
    transition: all 0.3s ease;
}

a:hover {
    color: var(--accent-blue);
}

/* Buttons */
.btn {
    display: inline-block;
    padding: 12px 24px;
    border-radius: 6px;
    border: 1px solid transparent;
    font-weight: 600;
    text-align: center;
    cursor: pointer;
    transition: all 0.3s ease;
    text-decoration: none;
}

.btn-primary {
    background: var(--primary-blue);
    color: var(--white);
    border-color: var(--primary-blue);
}

.btn-primary:hover {
    background: var(--primary-red);
    border-color: var(--primary-red);
    color: var(--white);
}

.btn-outline {
    border-color: var(--primary-blue);
    color: var(--primary-blue);
    background: transparent;
}

.btn-outline:hover {
    background: var(--primary-blue);
    color: var(--white);
}

.btn-large {
    padding: 16px 32px;
    font-size: 18px;
}

.btn-sm {
    padding: 8px 16px;
    font-size: 14px;
}

/* Header */

.site-header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    background: transparent;
}

.main-nav {
    background: rgba(214, 40, 40, 0.08);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    padding: 12px 0;
    transition: all 0.3s ease;
}

/* Mobile Navigation - Working Solution */

/* Base mobile navigation styles that work on all screen sizes */
.nav-list.mobile-open {
    display: flex !important;
    flex-direction: column !important;
    position: absolute !important;
    top: 100% !important;
    left: 0 !important;
    right: 0 !important;
    background: var(--scuk-blue) !important;
    z-index: 9999 !important;
    box-shadow: 0 4px 12px rgba(0,0,0,0.3) !important;
    margin: 0 !important;
    padding: 0 !important;
    list-style: none !important;
}

.nav-list.mobile-open li {
    margin: 0 !important;
    border-bottom: 1px solid rgba(255,255,255,0.1) !important;
}

.nav-list.mobile-open li:last-child {
    border-bottom: none !important;
}

.nav-list.mobile-open li a {
    display: block !important;
    padding: 15px 20px !important;
    color: white !important;
    text-decoration: none !important;
    font-size: 16px !important;
    border: none !important;
    background: none !important;
}

.nav-list.mobile-open li a:hover {
    background: rgba(255,255,255,0.1) !important;
}

/* Mobile dropdown styles */
.nav-list.mobile-open .dropdown {
    position: static !important;
    display: none !important;
    background: rgba(0,0,0,0.2) !important;
    box-shadow: none !important;
}

.nav-list.mobile-open .dropdown.open {
    display: block !important;
}

.nav-list.mobile-open .dropdown li a {
    padding-left: 40px !important;
    background: rgba(0,0,0,0.1) !important;
    font-size: 14px !important;
}

.main-nav.scrolled {
    background: rgba(255, 255, 255, 0.98) !important;
    backdrop-filter: blur(15px);
    -webkit-backdrop-filter: blur(15px);
    border-bottom: 1px solid rgba(0, 0, 0, 0.15);
    box-shadow: 0 2px 15px rgba(0, 0, 0, 0.15);
}

.main-nav .container {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.logo a {
    display: flex;
    align-items: center;
    font-weight: 700;
    color: var(--white);
    font-size: 24px;
    text-decoration: none;
    text-shadow: 2px 2px 4px rgba(0,0,0,0.8);
    letter-spacing: 1px;
}

.logo-img {
    height: 40px;
    width: auto;
    max-width: 160px;
    object-fit: contain;
    transition: all 0.3s ease;
    filter: brightness(0) invert(1) drop-shadow(2px 2px 4px rgba(0,0,0,0.8));
}

.logo-text {
    display: none;
    font-family: 'Poppins', sans-serif;
    font-weight: 700;
    font-size: 28px;
    color: white;
    text-shadow: 2px 2px 4px rgba(0,0,0,0.8);
    letter-spacing: 2px;
    transition: all 0.3s ease;
}

/* Show text logo instead of image if preferred */
.logo.text-logo .logo-img {
    display: none;
}

.logo.text-logo .logo-text {
    display: inline-block;
}



.nav-toggle {
    display: none;
    margin: 8px 0;
    background: none;
    border: none;
    color: var(--dark);
    cursor: pointer;
    padding: 8px;
    border-radius: 4px;
    transition: all 0.3s ease;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    width: 40px;
    height: 40px;
}

/* Nav toggle color for home page (transparent background) */
.main-nav:not(.scrolled) .nav-toggle {
    color: var(--white);
}

/* Nav toggle color for other pages (white background) */
.main-nav.scrolled .nav-toggle {
    color: var(--dark);
}

/* Show nav toggle on mobile - this should override the display: none */
@media (max-width: 768px) {
    .nav-toggle {
        display: flex !important;
    }
}

.nav-toggle:hover {
    background: rgba(0,0,0,0.1);
}

.nav-toggle:focus {
    outline: 2px solid rgba(0,0,0,0.3);
    outline-offset: 2px;
}

/* Nav toggle hover/focus for home page (transparent background) */
.main-nav:not(.scrolled) .nav-toggle:hover {
    background: rgba(255,255,255,0.1);
}

.main-nav:not(.scrolled) .nav-toggle:focus {
    outline: 2px solid rgba(255,255,255,0.3);
    outline-offset: 2px;
}

/* Nav toggle hover/focus for other pages (white background) */
.main-nav.scrolled .nav-toggle:hover {
    background: rgba(0,0,0,0.1);
}

.main-nav.scrolled .nav-toggle:focus {
    outline: 2px solid rgba(0,0,0,0.3);
    outline-offset: 2px;
}

.hamburger-line {
    display: block;
    width: 24px;
    height: 3px;
    background: var(--dark);
    margin: 3px 0;
    transition: all 0.3s ease;
    border-radius: 2px;
}

/* Hamburger lines color for home page (transparent background) */
.main-nav:not(.scrolled) .hamburger-line {
    background: white;
}

/* Hamburger lines color for other pages (white background) */
.main-nav.scrolled .hamburger-line {
    background: var(--dark);
}

/* Hamburger animation when menu is open */
.nav-toggle[aria-expanded="true"] .hamburger-line:nth-child(1) {
    transform: rotate(45deg) translate(6px, 6px);
}

.nav-toggle[aria-expanded="true"] .hamburger-line:nth-child(2) {
    opacity: 0;
}

.nav-toggle[aria-expanded="true"] .hamburger-line:nth-child(3) {
    transform: rotate(-45deg) translate(6px, -6px);
}

.nav-list {
    list-style: none;
    display: flex;
    gap: 20px;
    margin: 0;
    padding: 0;
    align-items: center;
}

.nav-list a {
    color: var(--white);
    font-weight: 500;
    font-size: 14px;
    padding: 6px 10px;
    border-radius: 4px;
    transition: all 0.3s ease;
    text-shadow: 1px 1px 3px rgba(0,0,0,0.7);
    white-space: nowrap;
}

.main-nav.scrolled .nav-list a {
    color: var(--dark);
    text-shadow: none;
}

.main-nav.scrolled .logo a {
    color: var(--dark);
    text-shadow: none;
}

.main-nav.scrolled .logo-img {
    filter: brightness(1) invert(0) drop-shadow(0 2px 4px rgba(0,0,0,0.2));
}

.main-nav.scrolled .logo-text {
    color: var(--dark);
    text-shadow: none;
}

.nav-list a:hover {
    background: rgba(255,255,255,0.1);
    color: var(--white);
}

.main-nav.scrolled .nav-list a:hover {
    background: rgba(214, 40, 40, 0.1);
    color: var(--scuk-red);
}

.has-dropdown {
    position: relative;
}

.has-dropdown > a::after {
    content: '▼';
    font-size: 10px;
    margin-left: 8px;
    transition: transform 0.3s ease;
}

.has-dropdown:hover > a::after {
    transform: rotate(180deg);
}

.dropdown {
    position: absolute;
    top: 100%;
    left: 0;
    background: var(--white);
    border: 1px solid var(--border);
    border-radius: 6px;
    display: none;
    min-width: 200px;
    box-shadow: 0 10px 25px rgba(0,0,0,0.15);
    z-index: 1000;
    list-style: none;
    margin: 0;
    padding: 8px 0;
    opacity: 0;
    transform: translateY(-10px);
    transition: all 0.3s ease;
}

.dropdown.open {
    display: block;
    opacity: 1;
    transform: translateY(0);
}

.dropdown a {
    color: var(--dark);
    display: block;
    padding: 12px 16px;
    border-radius: 0;
}

.dropdown a:hover {
    background: var(--light-bg);
    color: var(--primary-red);
}

.dropdown li {
    list-style: none;
    margin: 0;
    padding: 0;
}

/* Responsive Navigation */
@media (max-width: 1024px) {
    .nav-list {
        gap: 15px;
    }

    .nav-list a {
        font-size: 13px;
        padding: 5px 8px;
    }

    .logo a {
        font-size: 22px;
    }

    .logo-img {
        height: 35px;
        max-width: 140px;
    }

    .logo-text {
        font-size: 24px;
        letter-spacing: 1.5px;
    }
}

@media (max-width: 768px) {
    .main-nav {
        padding: 12px 0;
        position: relative;
    }

    .main-nav .container {
        display: flex;
        justify-content: space-between;
        align-items: center;
        position: relative;
    }

    .logo a {
        font-size: 20px;
    }

    .logo-img {
        height: 32px;
        max-width: 130px;
    }

    .logo-text {
        font-size: 22px;
        letter-spacing: 1px;
    }

    .nav-toggle {
        display: block !important;
        z-index: 1001;
    }

    .nav-list {
        display: none !important;
        flex-direction: column;
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        background: var(--scuk-blue) !important;
        padding: 0;
        box-shadow: 0 4px 12px rgba(0,0,0,0.1);
        z-index: 1000;
        margin: 0;
        list-style: none;
    }

    .nav-list.open {
        display: flex !important;
    }

    .nav-list li {
        border-bottom: 1px solid rgba(255,255,255,0.1);
    }

    .nav-list li:last-child {
        border-bottom: none;
    }

    .nav-list li a {
        padding: 15px 20px;
        display: block;
        color: white;
        font-size: 16px;
        border-bottom: none;
    }

    .nav-list li a:hover {
        background: rgba(255,255,255,0.1);
    }

    /* Hide desktop dropdown hover effects on mobile */
    .has-dropdown:hover .dropdown {
        display: none !important;
    }

    /* Mobile dropdown styles */
    .dropdown {
        position: static;
        background: rgba(0,0,0,0.1);
        box-shadow: none;
        display: none;
        padding: 0;
    }

    .dropdown.open {
        display: block !important;
    }

    .dropdown li a {
        padding: 12px 30px;
        font-size: 14px;
        background: rgba(0,0,0,0.1);
    }

    .dropdown li a:hover {
        background: rgba(255,255,255,0.1);
    }



    .logo a {
        font-size: 20px;
    }

    .logo-img {
        height: 30px;
        max-width: 120px;
    }

    .logo-text {
        font-size: 20px;
        letter-spacing: 1px;
    }
}

@media (max-width: 480px) {
    .header-top {
        padding: 10px 0;
    }



    .logo a {
        font-size: 18px;
    }

    .logo-img {
        height: 28px;
        max-width: 110px;
    }

    .logo-text {
        font-size: 18px;
        letter-spacing: 0.5px;
    }


}

/* Hero Carousel */
.hero-carousel {
    position: relative;
    color: var(--white);
    min-height: 100vh;
    display: flex;
    align-items: center;
    overflow: hidden;
    background: url('assets/images/WhatsApp Image 2025-08-25 at 2.34.40 PM.jpeg') center/cover no-repeat;
}

.hero-video-background {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}

.hero-video-background video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
    /* Optimize for 4K video performance */
    transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

.hero-red-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, rgba(214,40,40,0.65), rgba(220,38,38,0.55));
    z-index: 2;
    pointer-events: none;
}

.hero-animated-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    overflow: hidden;
}

.floating-element {
    position: absolute;
    font-size: 2rem;
    opacity: 0.1;
    animation: float 6s ease-in-out infinite;
}

.floating-element.book {
    top: 20%;
    left: 10%;
    animation-delay: 0s;
}

.floating-element.graduation {
    top: 60%;
    right: 15%;
    animation-delay: 1.5s;
}

.floating-element.globe {
    top: 30%;
    right: 25%;
    animation-delay: 3s;
}

.floating-element.pencil {
    bottom: 30%;
    left: 20%;
    animation-delay: 4.5s;
}

@keyframes float {
    0%, 100% {
        transform: translateY(0px) rotate(0deg);
        opacity: 0.1;
    }
    50% {
        transform: translateY(-20px) rotate(5deg);
        opacity: 0.2;
    }
}

.video-control-btn {
    position: absolute;
    bottom: 30px;
    left: 30px;
    background: rgba(255, 255, 255, 0.2);
    border: 2px solid rgba(255, 255, 255, 0.3);
    color: var(--white);
    width: 50px;
    height: 50px;
    border-radius: 50%;
    font-size: 20px;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    backdrop-filter: blur(10px);
    z-index: 5;
}

.video-control-btn:hover {
    background: rgba(255, 255, 255, 0.3);
    border-color: rgba(255, 255, 255, 0.5);
    transform: scale(1.1);
}

.hero-slide {
    display: none;
    width: 100%;
    position: relative;
    z-index: 3;
}

.hero-slide.active {
    display: block;
}

.hero-content {
    max-width: 600px;
    padding: 80px 16px;
    position: relative;
    z-index: 3;
    margin: 0 auto;
    text-align: center;
}

.hero-content h1 {
    font-size: 48px;
    line-height: 1.2;
    margin: 0 0 20px;
    font-weight: 700;
}

.hero-content p {
    font-size: 18px;
    margin: 0 0 30px;
    line-height: 1.6;
    opacity: 0.95;
}

.hero-navigation {
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    transform: translateY(-50%);
    display: flex;
    justify-content: space-between;
    padding: 0 30px;
    z-index: 4;
    pointer-events: none;
}

.hero-navigation .hero-nav-btn {
    pointer-events: all;
}

.hero-nav-btn {
    background: rgba(255,255,255,0.2);
    border: 2px solid rgba(255,255,255,0.3);
    color: var(--white);
    width: 50px;
    height: 50px;
    border-radius: 50%;
    font-size: 20px;
    cursor: pointer;
    transition: all 0.3s ease;
    display: flex;
    align-items: center;
    justify-content: center;
}

.hero-nav-btn:hover {
    background: rgba(255,255,255,0.3);
    border-color: rgba(255,255,255,0.5);
    transform: scale(1.1);
}

.hero-contact-sidebar {
    position: absolute;
    right: 30px;
    bottom: 30px;
    background: rgba(255,255,255,0.95);
    color: var(--dark);
    padding: 25px;
    border-radius: 12px;
    min-width: 220px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.2);
    z-index: 4;
}

.contact-item {
    margin-bottom: 15px;
}

.contact-item:last-child {
    margin-bottom: 0;
}

.contact-item h4 {
    margin: 0 0 5px;
    font-size: 14px;
    font-weight: 600;
    color: var(--muted);
}

.contact-item p {
    margin: 0 0 10px;
    font-size: 16px;
    font-weight: 700;
    color: var(--primary-red);
}

.pill {
    display: inline-block;
    background: rgba(255,255,255,0.2);
    color: var(--white);
    padding: 8px 16px;
    border-radius: 25px;
    font-size: 14px;
    font-weight: 500;
    margin-bottom: 15px;
}

/* Hero Responsive */
@media (max-width: 1024px) {
    .hero-contact-sidebar {
        display: none;
    }

    .hero-navigation {
        position: absolute;
        top: 50%;
        left: 0;
        right: 0;
        transform: translateY(-50%);
        display: flex;
        justify-content: space-between;
        padding: 0 20px;
        z-index: 4;
        pointer-events: none;
    }

    .hero-navigation .hero-nav-btn {
        pointer-events: all;
    }
}

@media (max-width: 768px) {
    .hero-carousel {
        min-height: 500px;
    }

    .hero-video-background video {
        /* Ensure video covers properly on mobile */
        min-width: 100%;
        min-height: 100%;
    }

    .video-control-btn {
        bottom: 20px;
        left: 20px;
        width: 40px;
        height: 40px;
        font-size: 16px;
    }

    .hero-content {
        padding: 60px 16px;
        text-align: center;
        margin: 0 auto;
    }

    .hero-content h1 {
        font-size: 36px;
    }

    .hero-content p {
        font-size: 16px;
    }

    .hero-nav-btn {
        width: 40px;
        height: 40px;
        font-size: 16px;
    }

    .hero-contact-sidebar {
        display: none;
    }
}

@media (max-width: 480px) {
    .hero-carousel {
        min-height: 400px;
    }

    .hero-content {
        padding: 40px 16px;
        text-align: center;
        margin: 0 auto;
    }

    .hero-content h1 {
        font-size: 28px;
    }

    .hero-content p {
        font-size: 14px;
    }

    .hero-nav-btn {
        width: 35px;
        height: 35px;
        font-size: 14px;
    }

    .hero-contact-sidebar {
        display: none;
    }
}

/* Sections */
section {
    padding: 60px 0;
}

.section-title {
    font-size: 36px;
    margin: 0 0 15px;
    font-weight: 700;
    color: var(--dark);
}

.section-sub {
    color: var(--muted);
    margin: 0 0 40px;
    font-size: 18px;
    line-height: 1.6;
    max-width: 800px;
}

.center {
    text-align: center;
}

.center .section-sub {
    margin-left: auto;
    margin-right: auto;
}

/* Grid System */
.grid {
    display: grid;
    gap: 24px;
}

.cols-2 {
    grid-template-columns: repeat(2, 1fr);
}

.cols-3 {
    grid-template-columns: repeat(3, 1fr);
}

.cols-4 {
    grid-template-columns: repeat(4, 1fr);
}

/* Cards */
.card {
    border: 1px solid var(--border);
    border-radius: 12px;
    overflow: hidden;
    background: var(--white);
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.card:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 25px rgba(0,0,0,0.15);
}

.card .body {
    padding: 24px;
}

.card h3 {
    margin: 0 0 12px;
    font-size: 20px;
    color: var(--dark);
}

.card p {
    margin: 0;
    color: var(--muted);
    line-height: 1.6;
}

/* Dark Sections */
.dark-section {
    background: #1f2937;
    color: #e5e7eb;
}

.dark-section .section-title {
    color: var(--white);
}

.dark-section .section-sub {
    color: #d1d5db;
}

/* General Responsive Design */
@media (max-width: 1024px) {
    .cols-4 {
        grid-template-columns: repeat(2, 1fr);
    }

    .cols-3 {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .container {
        padding: 0 12px;
    }

    section {
        padding: 40px 0;
    }

    .section-title {
        font-size: 28px;
    }

    .section-sub {
        font-size: 16px;
    }

    .cols-4,
    .cols-3,
    .cols-2 {
        grid-template-columns: 1fr;
    }

    .grid {
        gap: 16px;
    }

    .btn {
        padding: 10px 20px;
    }

    .btn-large {
        padding: 14px 28px;
        font-size: 16px;
    }
}

@media (max-width: 480px) {
    section {
        padding: 30px 0;
    }

    .section-title {
        font-size: 24px;
    }

    .section-sub {
        font-size: 14px;
    }

    .btn {
        padding: 8px 16px;
        font-size: 14px;
    }

    .btn-large {
        padding: 12px 24px;
        font-size: 14px;
    }

    .card .body {
        padding: 16px;
    }

    .card h3 {
        font-size: 18px;
    }
}

/* Degree Tiles */
.degree-tiles{background:#1f2937}
.degree-tiles .tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;padding:24px 0}
.tile{position:relative;display:block;height:260px;background-size:cover;background-position:center;border-radius:10px;overflow:hidden}
.tile::after{content:"";position:absolute;inset:0;background:rgba(2,6,23,0.5)}
.tile-overlay{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:flex-start;padding:20px;color:#fff;z-index:1}
.tile-overlay h3{margin:0 0 8px;font-size:24px}
.tile-overlay p{margin:0;opacity:0.9}

/* Feature Block */
.feature-block{background:#fff}
.feature-grid{display:grid;grid-template-columns:480px 1fr;gap:24px;align-items:center}
.feature-image img{width:100%;height:auto;border-radius:12px;box-shadow:0 10px 30px rgba(2,6,23,0.1)}
.feature-content .checks{list-style:none;padding:0;margin:16px 0;display:grid;gap:8px}
.feature-content .checks li{position:relative;padding-left:22px}
.feature-content .checks li::before{content:"✔";position:absolute;left:0;color:var(--scuk-red)}
.experience{display:flex;gap:10px;align-items:center;margin-top:8px}
.experience span{display:inline-flex;justify-content:center;align-items:center;width:64px;height:64px;border-radius:999px;background:var(--scuk-red);color:#fff;font-weight:700;font-size:22px}

/* CTA UK */
.cta-uk{background:#111827;color:#e5e7eb}
.cta-grid{display:grid;grid-template-columns:1fr 520px;gap:24px;align-items:center}

/* Dark Section */
.dark-section{background:#1f2937;color:#e5e7eb}
.dark-section .card{background:#111827;border-color:#374151}
.dark-section .btn.btn-outline{border-color:#e5e7eb;color:#e5e7eb}

/* Country tiles */
.country-tiles{display:grid;grid-template-columns:repeat(5,1fr);gap:16px}
.country{display:flex;justify-content:center;align-items:center;height:140px;background:#111827;color:#fff;border-radius:10px;position:relative;overflow:hidden}
.country span{position:relative;z-index:1;font-weight:700;font-size:22px}
.country::before{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.45),rgba(0,0,0,.45)),url('assets/images/WhatsApp Image 2025-08-25 at 2.34.41 PM (2).jpeg') center/cover no-repeat;filter:grayscale(100%)}

/* Testimonial */
.testimonial .quote{font-size:18px;max-width:900px;margin:0 auto 8px}

/* Steps */
.steps{background:#f3f4f6}
.steps-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:16px}
.step{background:#fff;border:1px solid #e5e7eb;border-radius:999px;aspect-ratio:1/1;display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative}
.step-badge{position:absolute;top:-10px;right:24px;background:var(--scuk-red);color:#fff;border-radius:999px;width:72px;height:72px;display:flex;align-items:center;justify-content:center;font-weight:700;border:2px dashed #fff;box-shadow:0 6px 16px rgba(2,6,23,0.15)}

/* Footer */
.site-footer{background:#8b1538;color:#e5e7eb;margin-top:40px}
.site-footer a{color:#e5e7eb;text-decoration:none}
.site-footer a:hover{color:#fff}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:32px;padding:48px 0}
.footer-about{max-width:300px}
.footer-about h4{color:#fff;margin:0 0 16px;font-size:20px;font-weight:700}
.footer-about p{margin:0 0 16px;line-height:1.6}
.footer-contact p{margin:0 0 8px;font-size:14px}
.footer-grid h4{color:#fff;margin:0 0 16px;font-size:16px;font-weight:600}
.footer-grid ul{list-style:none;padding:0;margin:0}
.footer-grid ul li{margin-bottom:8px}
.footer-grid ul li a{font-size:14px;transition:color 0.3s ease}
.footer-bottom{padding:20px 0;border-top:1px solid rgba(255,255,255,0.15)}
.footer-bottom-content{display:flex;justify-content:space-between;align-items:center}
.social-links{display:flex;gap:16px}
.social-links a{color:#e5e7eb;transition:all 0.3s ease;padding:8px;border-radius:6px}
.social-links a:hover{color:#fff;transform:translateY(-2px);background:rgba(255,255,255,0.1)}
.social-links svg{width:24px;height:24px;fill:currentColor}

/* Footer Responsive */
@media (max-width: 1024px) {
    .footer-grid {
        grid-template-columns: 1fr 1fr 1fr 1fr;
        gap: 24px;
    }
}

@media (max-width: 768px) {
    .footer-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 32px;
        padding: 32px 0;
    }

    .footer-about {
        grid-column: span 2;
        max-width: none;
        text-align: center;
    }

    .footer-bottom-content {
        flex-direction: column;
        gap: 16px;
        text-align: center;
    }
}

@media (max-width: 480px) {
    .footer-grid {
        grid-template-columns: 1fr;
        text-align: center;
    }

    .footer-about {
        grid-column: span 1;
    }

    .footer-contact p {
        font-size: 12px;
    }

    .footer-grid h4 {
        font-size: 14px;
    }

    .footer-grid ul li a {
        font-size: 12px;
    }
}

/* Course Categories */
.course-categories{background:#f8fafc}
.course-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;margin-top:32px}
.course-card{background:#fff;padding:32px 24px;border-radius:12px;text-align:center;box-shadow:0 4px 12px rgba(0,0,0,0.1);transition:transform 0.3s ease}
.course-card:hover{transform:translateY(-5px)}
.course-icon{font-size:48px;margin-bottom:16px}
.course-card h3{font-size:24px;margin:0 0 8px;color:var(--scuk-red)}
.course-card h4{font-size:16px;margin:0 0 16px;color:var(--scuk-blue);font-weight:600}
.course-card p{color:var(--scuk-muted);line-height:1.6}

/* About Section */
.about-section{background:#fff}
.about-grid{display:grid;grid-template-columns:1fr 480px;gap:48px;align-items:center}
.about-content{position:relative}
.experience-badge{position:absolute;top:-20px;right:0;display:flex;align-items:center;gap:12px;background:var(--scuk-red);color:#fff;padding:16px 20px;border-radius:12px;box-shadow:0 8px 24px rgba(214,40,40,0.3)}
.experience-number{font-size:32px;font-weight:700}
.experience-text{font-size:14px;line-height:1.2}
.feature-list{list-style:none;padding:0;margin:24px 0}
.feature-list li{padding:8px 0;font-size:16px;color:var(--scuk-dark)}
.about-image img{width:100%;border-radius:12px;box-shadow:0 12px 32px rgba(0,0,0,0.15)}

/* UK Admissions CTA */
.uk-admissions-cta{background:linear-gradient(135deg,var(--scuk-red),#dc2626);color:#fff;text-align:center}
.cta-content{max-width:800px;margin:0 auto}
.cta-content .section-title{color:#fff}
.cta-content p{font-size:18px;margin-bottom:32px;opacity:0.9}

/* Services Section */
.services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;margin-top:32px}
.service-card{background:#111827;border:1px solid #374151;border-radius:12px;padding:32px 24px;text-align:center;transition:transform 0.3s ease}
.service-card:hover{transform:translateY(-5px);border-color:#4b5563}
.service-icon{font-size:48px;margin-bottom:20px}
.service-card h3{color:#fff;margin:0 0 16px;font-size:20px}
.service-card p{color:#d1d5db;margin:0 0 24px;line-height:1.6}

/* Countries Section */
.countries-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:24px;margin-top:32px}
.country-card{background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:24px;text-align:center;transition:all 0.3s ease;text-decoration:none;color:var(--scuk-dark)}
.country-card:hover{transform:translateY(-5px);box-shadow:0 8px 24px rgba(0,0,0,0.1);border-color:var(--scuk-red)}
.country-flag{font-size:48px;margin-bottom:16px}
.country-card h3{margin:0;font-size:18px;font-weight:600}

/* Country Pages */
.country-hero .hero-image img {
    max-width: 400px;
    max-height: 300px;
    object-fit: cover;
    border-radius: 12px;
}

.content-image img {
    max-width: 350px;
    max-height: 250px;
    object-fit: cover;
    border-radius: 8px;
}

.requirements-image img {
    max-width: 350px;
    max-height: 250px;
    object-fit: cover;
    border-radius: 8px;
}

/* Testimonials */
.testimonials-section{position:relative}
.testimonial-carousel{max-width:900px;margin:0 auto;position:relative}
.testimonial-slide{display:none;text-align:center;padding:0 20px}
.testimonial-slide.active{display:block}
.testimonial-text{font-size:20px;line-height:1.6;margin:0 0 24px;color:#e5e7eb;font-style:italic}
.testimonial-author{color:#9ca3af}
.testimonial-author strong{color:#fff;display:block;margin-bottom:4px}
.testimonial-dots{display:flex;justify-content:center;gap:12px;margin-top:32px}
.dot{width:12px;height:12px;border-radius:50%;background:#374151;cursor:pointer;transition:background 0.3s ease}
.dot.active{background:var(--scuk-red)}

/* Statistics Section */
.statistics-section{background:#f8fafc;padding:60px 0}
.stats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:48px;text-align:center}
.stat-item{background:#fff;padding:40px 20px;border-radius:12px;box-shadow:0 4px 12px rgba(0,0,0,0.1)}
.stat-number{font-size:48px;font-weight:700;color:var(--scuk-red);margin-bottom:8px}
.stat-label{font-size:16px;color:var(--scuk-muted);font-weight:500}

/* Steps Section */
.steps-section{background:#fff}
.steps-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;margin-top:32px}
.step-card{background:#f8fafc;border:1px solid #e5e7eb;border-radius:12px;padding:32px 24px;text-align:center;position:relative;transition:transform 0.3s ease}
.step-card:hover{transform:translateY(-5px)}
.step-number{background:var(--scuk-red);color:#fff;width:80px;height:80px;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;margin:0 auto 24px;font-size:24px;font-weight:700;position:relative;top:-40px}
.step-number span{font-size:12px;font-weight:500}
.step-card h3{margin:0 0 16px;font-size:20px;color:var(--scuk-dark)}
.step-card p{color:var(--scuk-muted);line-height:1.6}

/* Quality Education Section */
.quality-education-section{background:#f8fafc}
.university-stats{display:flex;align-items:center;justify-content:center;gap:48px;margin-top:32px;flex-wrap:wrap}
.university-stat{text-align:center}
.university-stat .stat-number{font-size:48px;font-weight:700;color:var(--scuk-red);margin-bottom:8px}
.university-stat .stat-label{font-size:16px;color:var(--scuk-muted)}
.university-countries{display:flex;gap:12px;flex-wrap:wrap}
.country-tag{background:var(--scuk-red);color:#fff;padding:8px 16px;border-radius:20px;font-size:14px;font-weight:500}

/* Testimonials Section */
.testimonials-section {
    background: #f8fafc;
    padding: 80px 0;
    overflow: hidden;
}

.testimonials-marquee {
    width: 100%;
    overflow: hidden;
    position: relative;
    margin-top: 40px;
}

.testimonials-track {
    display: flex;
    gap: 30px;
    animation: marquee 60s linear infinite;
    width: max-content;
}

@keyframes marquee {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(-50%);
    }
}

.testimonial-card {
    background: white;
    padding: 30px 25px;
    border-radius: 16px;
    box-shadow: 0 8px 32px rgba(0,0,0,0.1);
    text-align: center;
    min-width: 350px;
    max-width: 350px;
    flex-shrink: 0;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.testimonial-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 12px 40px rgba(0,0,0,0.15);
}

.testimonial-content {
    margin-bottom: 25px;
}

.stars {
    font-size: 18px;
    margin-bottom: 15px;
    color: #fbbf24;
}

.testimonial-content p {
    font-size: 15px;
    line-height: 1.5;
    color: var(--muted);
    font-style: italic;
    margin: 0;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.testimonial-author {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 15px;
}

.author-info h4 {
    font-size: 16px;
    font-weight: 600;
    color: var(--dark);
    margin: 0 0 5px 0;
}

.author-info span {
    font-size: 13px;
    color: var(--primary);
    font-weight: 500;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Pause animation on hover */
.testimonials-marquee:hover .testimonials-track {
    animation-play-state: paused;
}

/* Testimonials Responsive */
@media (max-width: 1024px) {
    .testimonials-track {
        gap: 25px;
        animation-duration: 50s;
    }

    .testimonial-card {
        min-width: 320px;
        max-width: 320px;
        padding: 25px 20px;
    }
}

@media (max-width: 768px) {
    .testimonials-section {
        padding: 60px 0;
    }

    .testimonials-track {
        gap: 20px;
        animation-duration: 40s;
    }

    .testimonial-card {
        min-width: 280px;
        max-width: 280px;
        padding: 20px 15px;
    }

    .testimonial-content p {
        font-size: 14px;
        -webkit-line-clamp: 3;
    }

    .author-info h4 {
        font-size: 15px;
    }

    .author-info span {
        font-size: 12px;
    }
}

@media (max-width: 480px) {
    .testimonials-track {
        gap: 15px;
        animation-duration: 35s;
    }

    .testimonial-card {
        min-width: 250px;
        max-width: 250px;
        padding: 18px 12px;
    }

    .testimonial-content p {
        font-size: 13px;
        -webkit-line-clamp: 3;
    }

    .author-info h4 {
        font-size: 14px;
    }

    .author-info span {
        font-size: 11px;
    }

    .stars {
        font-size: 16px;
        margin-bottom: 12px;
    }
}

/* Final CTA Section */
.final-cta-section{text-align:center}
.cta-contact{margin-top:32px}
.contact-info{display:flex;justify-content:center;gap:48px;margin-bottom:32px;flex-wrap:wrap}
.contact-info .contact-item{color:#e5e7eb}
.contact-info .contact-item strong{font-size:18px}

/* Responsive Design */
@media (max-width: 1024px) {
    .about-grid{grid-template-columns:1fr;gap:32px}
    .cta-grid{grid-template-columns:1fr;gap:24px}
    .feature-grid{grid-template-columns:1fr;gap:24px}
    .course-grid{grid-template-columns:repeat(2,1fr)}
    .services-grid{grid-template-columns:repeat(2,1fr)}
    .countries-grid{grid-template-columns:repeat(3,1fr)}
    .hero-contact-sidebar{display:none}
    .hero-navigation{position:absolute;top:50%;left:0;right:0;transform:translateY(-50%);display:flex;justify-content:space-between;padding:0 20px;z-index:4;pointer-events:none}
    .hero-navigation .hero-nav-btn{pointer-events:all}
}

@media (max-width: 768px) {
    .container{padding:0 12px}
    .hero-content{padding:48px 12px;text-align:center;margin:0 auto}
    .hero-content h1{font-size:36px}
    .section-title{font-size:28px}
    .course-grid{grid-template-columns:1fr}
    .services-grid{grid-template-columns:1fr}
    .services-list{grid-template-columns:1fr}
    .countries-grid{grid-template-columns:repeat(2,1fr)}
    .stats-grid{grid-template-columns:1fr;gap:24px}
    .steps-grid{grid-template-columns:1fr}
    .university-stats{flex-direction:column;gap:24px}



    .btn{padding:8px 12px;font-size:14px}
    .experience-badge{position:static;margin-bottom:20px;justify-content:center}
}

@media (max-width: 480px) {
    .hero-content h1{font-size:28px}
    .section-title{font-size:24px}
    .countries-grid{grid-template-columns:1fr}
    .course-icon,.service-icon{font-size:36px}
    .stat-number{font-size:36px}
    .step-number{width:60px;height:60px;font-size:18px}
    .testimonial-text{font-size:18px}
    .hero-nav-btn{width:40px;height:40px;font-size:18px}

    /* Mobile navigation improvements */
    .container {
        padding: 0 15px;
    }

    .logo a {
        font-size: 18px;
    }

    .nav-toggle {
        font-size: 20px;
        padding: 6px;
    }

    .nav-list li a {
        padding: 12px 15px;
        font-size: 15px;
    }

    .dropdown li a {
        padding: 10px 25px;
        font-size: 13px;
    }

    /* Improve button sizes for mobile */
    .btn {
        padding: 12px 20px;
        font-size: 14px;
        min-height: 44px; /* Touch-friendly size */
    }

    /* Better spacing for mobile */
    section {
        padding: 40px 0;
    }
}

/* About Page Styles */
.about-hero {
    background: var(--white);
    padding: 80px 0;
}

.about-hero .container {
    display: grid;
    grid-template-columns: 1fr 480px;
    gap: 48px;
    align-items: center;
}

.about-hero .hero-content {
    max-width: none;
}

.about-hero .section-title {
    color: var(--dark);
    font-size: 48px;
    margin-bottom: 16px;
}

.about-hero .section-sub {
    color: var(--primary-red);
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 20px;
}

.about-hero .hero-content p {
    color: var(--muted);
    font-size: 16px;
    line-height: 1.6;
    margin-bottom: 30px;
}

.about-hero .hero-image img {
    width: 100%;
    border-radius: 12px;
    box-shadow: 0 12px 32px rgba(0,0,0,0.15);
}

/* Hero Icon Styles */
.hero-icon-large {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    min-height: 300px;
}

.contact-icon-bg,
.branches-icon-bg,
.blog-icon-bg {
    width: 200px;
    height: 200px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 20px 40px rgba(0,0,0,0.1);
    position: relative;
    animation: float 3s ease-in-out infinite;
}

.contact-icon-bg {
    background: linear-gradient(135deg, #10b981, #059669);
}

.branches-icon-bg {
    background: linear-gradient(135deg, #3b82f6, #1d4ed8);
}

.blog-icon-bg {
    background: linear-gradient(135deg, #f59e0b, #d97706);
}

.contact-icon,
.branches-icon,
.blog-icon {
    font-size: 80px;
    filter: drop-shadow(0 4px 8px rgba(0,0,0,0.2));
}

@keyframes float {
    0%, 100% {
        transform: translateY(0px);
    }
    50% {
        transform: translateY(-10px);
    }
}

/* Contact Hero */
.contact-hero {
    background: var(--white);
    padding: 80px 0;
}

.contact-hero .container {
    display: grid;
    grid-template-columns: 1fr 400px;
    gap: 48px;
    align-items: center;
}

.contact-hero .section-title {
    color: var(--dark);
    font-size: 48px;
}

.contact-hero .section-sub {
    color: var(--primary-red);
    font-size: 20px;
    font-weight: 600;
}

/* Vision Section */
.vision-section {
    padding: 80px 0;
    background: #f8fafc;
}

.vision-content {
    display: grid;
    grid-template-columns: 1fr 400px;
    gap: 48px;
    align-items: center;
}

.vision-text h2 {
    color: var(--dark);
    font-size: 36px;
    margin-bottom: 24px;
}

.vision-text p {
    color: var(--muted);
    line-height: 1.6;
    margin-bottom: 20px;
}

.vision-features {
    list-style: none;
    padding: 0;
    margin: 0;
}

.vision-features li {
    display: flex;
    align-items: center;
    margin-bottom: 16px;
    color: var(--dark);
    font-size: 16px;
}

.vision-features li::before {
    content: "✓";
    color: var(--primary-red);
    font-weight: bold;
    margin-right: 12px;
    font-size: 18px;
    flex-shrink: 0;
}

.vision-image img {
    width: 100%;
    border-radius: 12px;
    box-shadow: 0 8px 24px rgba(0,0,0,0.1);
}

.vision-mission{background:#fff;padding:80px 0}
.feature-item{display:flex;align-items:flex-start;gap:16px;margin-bottom:24px}
.feature-icon{font-size:32px;flex-shrink:0}
.feature-content h4{margin:0 0 8px;font-size:18px;color:var(--scuk-red)}
.feature-content p{margin:0;color:var(--scuk-muted);line-height:1.6}

.company-story{padding:80px 0}
.story-content{max-width:900px;margin:0 auto}
.story-text{font-size:18px;line-height:1.8;margin:32px 0;color:#d1d5db}
.story-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;margin-top:48px}

/* What We Offer Section */
.services-overview {
    background: #f8fafc;
    padding: 80px 0;
}

.services-overview .section-title {
    text-align: center;
    color: var(--dark);
    font-size: 36px;
    margin-bottom: 16px;
}

.services-overview .section-subtitle {
    text-align: center;
    color: var(--muted);
    font-size: 18px;
    margin-bottom: 48px;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
}

.services-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 32px;
    margin-top: 48px;
}

.service-item {
    background: #fff;
    padding: 32px 24px;
    border-radius: 12px;
    text-align: center;
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
    transition: all 0.3s ease;
    border: 1px solid #e5e7eb;
    position: relative;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.service-item:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 25px rgba(0,0,0,0.15);
    border-color: var(--primary-red);
}

.service-item::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 4px;
    background: var(--primary-red);
    transform: scaleX(0);
    transition: transform 0.3s ease;
}

.service-item:hover::before {
    transform: scaleX(1);
}

.service-header {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    margin-bottom: 20px;
    text-align: center;
}

.service-icon {
    width: 60px;
    height: 60px;
    background: linear-gradient(135deg, var(--primary-blue), #1d4ed8);
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    flex-shrink: 0;
    text-align: center;
    line-height: 1;
}

.service-title {
    margin: 0;
    font-size: 20px;
    color: var(--dark);
    font-weight: 600;
    line-height: 1.3;
    text-align: center;
}

.service-description {
    color: var(--muted);
    line-height: 1.6;
    font-size: 15px;
    margin: 0;
    text-align: center;
}

.contact-cta{background:#fff;padding:80px 0}
.cta-buttons{display:flex;gap:16px;justify-content:center;margin-top:32px;flex-wrap:wrap}

@media (max-width: 768px) {
    .about-hero .container {
        grid-template-columns: 1fr;
        gap: 32px;
        text-align: center;
    }

    .about-hero .section-title{font-size:36px}

    .vision-content {
        grid-template-columns: 1fr;
        gap: 32px;
        text-align: center;
    }

    .services-grid{grid-template-columns:repeat(2,1fr);gap:24px}
    .services-overview .section-title{font-size:32px}
    .service-item{padding:24px 20px}
    .story-stats{grid-template-columns:1fr;gap:24px}
    .cta-buttons{flex-direction:column;align-items:center}
}

@media (max-width: 480px) {
    .about-hero .section-title{font-size:28px}
    .about-hero .section-sub{font-size:18px}

    .vision-text h2 {
        font-size: 28px;
    }

    .services-grid{grid-template-columns:1fr;gap:20px}
    .services-overview .section-title{font-size:28px}
    .service-header{flex-direction:column;text-align:center;gap:12px;align-items:center}
    .service-item{text-align:center;align-items:center}
    .service-icon{margin:0 auto}
    .feature-item{flex-direction:column;text-align:center}
}

/* Service Pages Styles */
.service-hero{background:#fff;padding:80px 0}
.service-hero .container{display:grid;grid-template-columns:1fr 480px;gap:48px;align-items:center}
.service-hero .hero-content{max-width:none}
.service-hero .hero-image img{width:100%;border-radius:12px;box-shadow:0 12px 32px rgba(0,0,0,0.15)}

.service-features{background:#f8fafc;padding:80px 0}
.features-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;margin-top:48px}
.feature-card{background:#fff;padding:32px 24px;border-radius:12px;text-align:center;box-shadow:0 4px 12px rgba(0,0,0,0.1);transition:transform 0.3s ease}
.feature-card:hover{transform:translateY(-5px)}
.feature-card .feature-icon{font-size:48px;margin-bottom:20px}
.feature-card h3{margin:0 0 16px;font-size:20px;color:var(--scuk-red)}
.feature-card p{color:var(--scuk-muted);line-height:1.6}

.counseling-process{padding:80px 0}
.process-steps{display:grid;grid-template-columns:repeat(5,1fr);gap:32px;margin-top:48px}
.process-step{text-align:center;position:relative;min-height:200px;padding-bottom:20px}
.process-step:not(:last-child)::after{content:'';position:absolute;top:70px;right:-12px;width:24px;height:2px;background:#4b5563}
.step-number{width:80px;height:80px;border-radius:50%;background:var(--scuk-red);color:#fff;display:flex;align-items:center;justify-content:center;font-size:24px;font-weight:700;margin:30px auto 20px}
.process-step h3{margin:0 0 12px;font-size:18px;color:#e5e7eb}
.process-step p{color:#9ca3af;font-size:14px;line-height:1.5}

.counseling-benefits{background:#fff;padding:80px 0}
.benefits-grid{display:grid;grid-template-columns:1fr 480px;gap:48px;align-items:center}
.benefits-list{margin-top:32px}
.benefit-item{display:flex;align-items:flex-start;gap:16px;margin-bottom:24px}
.benefit-icon{width:24px;height:24px;border-radius:50%;background:var(--scuk-red);color:#fff;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;flex-shrink:0}
.benefit-text h4{margin:0 0 8px;font-size:18px;color:var(--scuk-red)}
.benefit-text p{margin:0;color:var(--scuk-muted);line-height:1.6}
.benefits-image img{width:100%;border-radius:12px;box-shadow:0 12px 32px rgba(0,0,0,0.15)}

.service-cta{background:linear-gradient(135deg,var(--scuk-red),#dc2626);color:#fff;padding:80px 0}
.service-cta .section-title{color:#fff}
.service-cta .section-sub{color:#e5e7eb}

/* Visa Page Specific */
.visa-types{background:#fff;padding:80px 0}
.visa-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;margin-top:48px}
.visa-card{background:#f8fafc;border:1px solid #e5e7eb;border-radius:12px;padding:32px 24px;text-align:center;transition:all 0.3s ease}
.visa-card:hover{transform:translateY(-5px);border-color:var(--scuk-red);box-shadow:0 8px 24px rgba(0,0,0,0.1)}
.visa-flag{font-size:48px;margin-bottom:16px}
.visa-card h3{margin:0 0 16px;font-size:20px;color:var(--scuk-red)}
.visa-card p{color:var(--scuk-muted);line-height:1.6}

.visa-process{padding:80px 0}
.process-timeline{display:grid;grid-template-columns:repeat(5,1fr);gap:24px;margin-top:48px}
.timeline-step{text-align:center;position:relative}
.timeline-step:not(:last-child)::after{content:'';position:absolute;top:40px;right:-12px;width:24px;height:2px;background:#4b5563}

.visa-services{background:#fff;padding:80px 0}
.services-content{display:block}
.services-list{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;margin-top:48px}
.service-item{background:#f8fafc;border:1px solid #e5e7eb;border-radius:12px;padding:32px 24px;text-align:center;transition:all 0.3s ease;display:flex;flex-direction:column;align-items:center}
.service-item:hover{transform:translateY(-5px);border-color:var(--scuk-red);box-shadow:0 8px 24px rgba(0,0,0,0.1)}
.service-icon{font-size:48px;margin-bottom:20px}
.service-details h4{margin:0 0 16px;font-size:20px;color:var(--scuk-red);text-align:center}
.service-details p{margin:0;color:var(--scuk-muted);line-height:1.6;text-align:center}
.services-image{display:none}

.visa-stats{background:#f8fafc;padding:80px 0}
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:32px;margin-top:48px}
.stat-card{background:#fff;padding:32px 20px;border-radius:12px;text-align:center;box-shadow:0 4px 12px rgba(0,0,0,0.1)}
.stat-card .stat-number{font-size:36px;font-weight:700;color:var(--scuk-red);margin-bottom:8px}
.stat-card .stat-label{font-size:14px;color:var(--scuk-muted);font-weight:500}

@media (max-width: 1200px) {
    .process-steps{grid-template-columns:repeat(3,1fr);gap:24px}
    .process-step:nth-child(4), .process-step:nth-child(5) {
        margin-top: 40px;
    }
    .process-step:nth-child(4)::after, .process-step:nth-child(5)::after {
        display: none;
    }
}

@media (max-width: 1024px) {
    .service-hero .container{grid-template-columns:1fr;gap:32px}
    .benefits-grid{grid-template-columns:1fr;gap:32px}
    .services-content{grid-template-columns:1fr;gap:32px}
    .process-steps{grid-template-columns:repeat(3,1fr)}
    .process-timeline{grid-template-columns:repeat(3,1fr)}
    .visa-grid{grid-template-columns:repeat(2,1fr)}
    .stats-grid{grid-template-columns:repeat(2,1fr)}
}

@media (max-width: 768px) {
    .features-grid{grid-template-columns:repeat(2,1fr)}
    .process-steps{grid-template-columns:1fr}
    .process-timeline{grid-template-columns:1fr}
    .visa-grid{grid-template-columns:1fr}
    .stats-grid{grid-template-columns:1fr}
    .process-step::after,.timeline-step::after{display:none}
}

@media (max-width: 480px) {
    .features-grid{grid-template-columns:1fr}
    .service-hero{padding:60px 0}
    .service-features{padding:60px 0}
    .counseling-process{padding:60px 0}
    .counseling-benefits{padding:60px 0}
    .service-cta{padding:60px 0}
}

/* Country Pages Styles */
.country-hero{background:#fff;padding:80px 0}
.country-hero .container{display:grid;grid-template-columns:1fr 480px;gap:48px;align-items:center}
.country-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:32px}
.country-stats .stat-item{text-align:center;padding:20px;background:#f8fafc;border-radius:8px}
.country-stats .stat-number{font-size:24px;font-weight:700;color:var(--scuk-red);margin-bottom:4px}
.country-stats .stat-label{font-size:14px;color:var(--scuk-muted)}

.why-study{background:#f8fafc;padding:80px 0}
.benefits-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;margin-top:48px}
.benefit-card{background:#fff;padding:32px 24px;border-radius:12px;text-align:center;box-shadow:0 4px 12px rgba(0,0,0,0.1);transition:transform 0.3s ease}
.benefit-card:hover{transform:translateY(-5px)}
.benefit-icon{font-size:48px;margin-bottom:20px}
.benefit-card h3{margin:0 0 16px;font-size:20px;color:var(--scuk-red)}
.benefit-card p{color:var(--scuk-muted);line-height:1.6}

.universities-section{padding:80px 0}
.universities-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;margin-top:48px}
.university-card{background:#111827;border:1px solid #374151;border-radius:12px;padding:32px 24px;transition:transform 0.3s ease}
.university-card:hover{transform:translateY(-5px);border-color:#4b5563}
.university-card h3{color:#fff;margin:0 0 16px;font-size:20px}
.university-card p{color:#d1d5db;margin:0 0 20px;line-height:1.6}
.university-info{display:flex;justify-content:space-between;align-items:center}
.ranking{background:var(--scuk-red);color:#fff;padding:4px 12px;border-radius:20px;font-size:12px;font-weight:600}
.location{color:#9ca3af;font-size:14px}

.programs-section{background:#fff;padding:80px 0}
.programs-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;margin-top:48px}
.program-card{background:#f8fafc;border:1px solid #e5e7eb;border-radius:12px;padding:32px 24px;text-align:center;transition:all 0.3s ease}
.program-card:hover{transform:translateY(-5px);border-color:var(--scuk-red);box-shadow:0 8px 24px rgba(0,0,0,0.1)}
.program-icon{font-size:48px;margin-bottom:20px}
.program-card h3{margin:0 0 16px;font-size:20px;color:var(--scuk-red)}
.program-card p{color:var(--scuk-muted);line-height:1.6}

.admission-requirements{background:#f8fafc;padding:80px 0}
.requirements-grid{display:grid;grid-template-columns:1fr 480px;gap:48px;align-items:center}
.requirements-list{margin-top:32px}
.requirement-item{margin-bottom:24px;padding:20px;background:#fff;border-radius:8px;box-shadow:0 2px 8px rgba(0,0,0,0.05)}
.requirement-item h4{margin:0 0 8px;font-size:18px;color:var(--scuk-red)}
.requirement-item p{margin:0;color:var(--scuk-muted);line-height:1.6}
.requirements-image img{width:100%;border-radius:12px;box-shadow:0 12px 32px rgba(0,0,0,0.15)}

.cost-living{padding:80px 0}
.cost-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:32px;margin-top:48px}
.cost-card{background:#111827;border:1px solid #374151;border-radius:12px;padding:32px 24px;text-align:center}
.cost-card h3{color:#fff;margin:0 0 16px;font-size:18px}
.cost-amount{font-size:28px;font-weight:700;color:var(--scuk-red);margin-bottom:8px}
.cost-card p{color:#9ca3af;font-size:14px}

.application-process{background:#fff;padding:80px 0}
.process-steps{display:grid;grid-template-columns:repeat(5,1fr);gap:24px;margin-top:48px}
.process-step{text-align:center;position:relative}
.process-step:not(:last-child)::after{content:'';position:absolute;top:40px;right:-12px;width:24px;height:2px;background:#e5e7eb}

.country-cta{background:linear-gradient(135deg,var(--scuk-red),#dc2626);color:#fff;padding:80px 0}
.country-cta .section-title{color:#fff}
.country-cta .section-sub{color:#e5e7eb}

@media (max-width: 1024px) {
    .country-hero .container{grid-template-columns:1fr;gap:32px}
    .requirements-grid{grid-template-columns:1fr;gap:32px}
    .benefits-grid{grid-template-columns:repeat(2,1fr)}
    .universities-grid{grid-template-columns:repeat(2,1fr)}
    .programs-grid{grid-template-columns:repeat(2,1fr)}
    .cost-grid{grid-template-columns:repeat(2,1fr)}
    .process-steps{grid-template-columns:repeat(3,1fr)}

    /* Medium-sized images on tablet */
    .country-hero .hero-image img {
        max-width: 350px;
        max-height: 250px;
    }

    .content-image img,
    .requirements-image img {
        max-width: 300px;
        max-height: 220px;
    }
}

@media (max-width: 768px) {
    .country-stats{grid-template-columns:1fr;gap:16px}
    .benefits-grid{grid-template-columns:1fr}
    .universities-grid{grid-template-columns:1fr}
    .programs-grid{grid-template-columns:1fr}
    .cost-grid{grid-template-columns:1fr}
    .process-steps{grid-template-columns:1fr}
    .process-step::after{display:none}

    /* Smaller images on mobile */
    .country-hero .hero-image img {
        max-width: 280px;
        max-height: 200px;
    }

    .content-image img,
    .requirements-image img {
        max-width: 250px;
        max-height: 180px;
    }
}

@media (max-width: 480px) {
    .country-hero{padding:60px 0}
    .why-study{padding:60px 0}
    .universities-section{padding:60px 0}
    .programs-section{padding:60px 0}
    .admission-requirements{padding:60px 0}
    .cost-living{padding:60px 0}
    .application-process{padding:60px 0}
    .country-cta{padding:60px 0}
}

/* Contact Page Styles */
.contact-hero{background:linear-gradient(135deg,var(--scuk-red),#dc2626);color:#fff;padding:80px 0}
.contact-hero .section-title{color:#fff;font-size:48px}
.contact-hero .section-sub{color:#e5e7eb;font-size:20px}

.contact-info-section{background:#f8fafc;padding:80px 0}
.contact-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px}
.contact-card{background:#fff;padding:32px 24px;border-radius:12px;text-align:center;box-shadow:0 4px 12px rgba(0,0,0,0.1);transition:transform 0.3s ease}
.contact-card:hover{transform:translateY(-5px)}
.contact-icon{font-size:48px;margin-bottom:20px}
.contact-card h3{margin:0 0 16px;font-size:20px;color:var(--scuk-red)}
.contact-card p{margin:0 0 8px;color:var(--scuk-muted)}

.office-locations{padding:80px 0}
.offices-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:32px;margin-top:48px}
.office-card{background:#111827;border:1px solid #374151;border-radius:12px;padding:32px 24px;text-align:center;transition:transform 0.3s ease}
.office-card:hover{transform:translateY(-5px);border-color:#4b5563}
.office-flag{font-size:48px;margin-bottom:16px}
.office-card h3{color:#fff;margin:0 0 16px;font-size:20px}
.office-card p{color:#d1d5db;margin:0 0 16px;line-height:1.6}
.office-hours{color:#9ca3af;font-size:14px}
.office-hours strong{color:#e5e7eb}

.contact-form-section{background:#fff;padding:80px 0}
.form-grid{display:grid;grid-template-columns:480px 1fr;gap:48px;align-items:start}
.contact-features{margin-top:32px}
.feature-item{display:flex;align-items:center;gap:12px;margin-bottom:16px}
.feature-item .feature-icon{width:24px;height:24px;border-radius:50%;background:var(--scuk-blue);color:#fff;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700}
.feature-item span{color:var(--scuk-dark);font-weight:500}

.contact-form{background:#f8fafc;padding:32px;border-radius:12px;box-shadow:0 4px 12px rgba(0,0,0,0.1)}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:20px}
.form-group{margin-bottom:20px}
.form-group label{display:block;margin-bottom:8px;font-weight:600;color:var(--scuk-dark)}
.form-group input,.form-group select,.form-group textarea{width:100%;padding:12px 16px;border:1px solid #e5e7eb;border-radius:8px;font-size:16px;transition:border-color 0.3s ease}
.form-group input:focus,.form-group select:focus,.form-group textarea:focus{outline:none;border-color:var(--scuk-red);box-shadow:0 0 0 3px rgba(214,40,40,0.1)}
.form-group textarea{resize:vertical;min-height:120px}

.quick-contact-cta{background:linear-gradient(135deg,var(--scuk-red),#dc2626);color:#fff;padding:80px 0}
.quick-contact-cta .section-title{color:#fff}
.quick-contact-cta .section-sub{color:#e5e7eb}
.quick-contact-buttons{display:flex;gap:16px;justify-content:center;margin-top:32px;flex-wrap:wrap}
.quick-contact-buttons .btn{min-width:160px}

@media (max-width: 1024px) {
    .form-grid{grid-template-columns:1fr;gap:32px}
    .offices-grid{grid-template-columns:repeat(2,1fr)}
    .contact-grid{grid-template-columns:repeat(2,1fr)}
}

@media (max-width: 768px) {
    .contact-hero .section-title{font-size:36px}
    .form-row{grid-template-columns:1fr}
    .offices-grid{grid-template-columns:1fr}
    .contact-grid{grid-template-columns:1fr}
    .quick-contact-buttons{flex-direction:column;align-items:center}
}

@media (max-width: 480px) {
    .contact-hero{padding:60px 0}
    .contact-info-section{padding:60px 0}
    .office-locations{padding:60px 0}
    .contact-form-section{padding:60px 0}
    .quick-contact-cta{padding:60px 0}
    .contact-form{padding:24px}
}

/* Accommodation Page */
.accommodation-hero {
    background: var(--white);
    padding: 80px 0;
}

.accommodation-hero .container {
    display: grid;
    grid-template-columns: 1fr 480px;
    gap: 48px;
    align-items: center;
}

.accommodation-types {
    background: var(--light-bg);
    padding: 80px 0;
}

.accommodation-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 32px;
    margin-top: 48px;
}

.accommodation-card {
    background: var(--white);
    padding: 32px;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    transition: transform 0.3s ease;
}

.accommodation-card:hover {
    transform: translateY(-5px);
}

.accommodation-icon {
    font-size: 48px;
    margin-bottom: 20px;
}

.accommodation-card h3 {
    margin: 0 0 16px;
    font-size: 24px;
    color: var(--primary-red);
}

.accommodation-card p {
    margin: 0 0 20px;
    color: var(--muted);
    line-height: 1.6;
}

.features-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.features-list li {
    padding: 4px 0;
    color: var(--dark);
    font-size: 14px;
}

.accommodation-help {
    padding: 80px 0;
}

.help-steps {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 32px;
    margin-top: 48px;
}

.help-step {
    text-align: center;
    position: relative;
}

.help-step:not(:last-child)::after {
    content: '';
    position: absolute;
    top: 40px;
    right: -16px;
    width: 32px;
    height: 2px;
    background: #4b5563;
}

.step-number {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: var(--primary-blue);
    color: var(--white);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    font-weight: 700;
    margin: 0 auto 20px;
}

.help-step h3 {
    margin: 0 0 12px;
    font-size: 20px;
    color: var(--white);
}

.help-step p {
    color: #d1d5db;
    font-size: 14px;
    line-height: 1.5;
}

.accommodation-costs {
    background: var(--white);
    padding: 80px 0;
}

.costs-grid {
    display: grid;
    grid-template-columns: 1fr 480px;
    gap: 48px;
    align-items: center;
}

.cost-factors {
    margin-top: 32px;
}

.cost-factor {
    margin-bottom: 24px;
    padding: 20px;
    background: var(--light-bg);
    border-radius: 8px;
}

.cost-factor h4 {
    margin: 0 0 8px;
    font-size: 18px;
    color: var(--primary-red);
}

.cost-factor p {
    margin: 0;
    color: var(--muted);
    line-height: 1.6;
}

.costs-image img {
    width: 100%;
    border-radius: 12px;
    box-shadow: 0 12px 32px rgba(0,0,0,0.15);
}

.accommodation-tips {
    background: var(--light-bg);
    padding: 80px 0;
}

.tips-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 32px;
    margin-top: 48px;
}

.tip-card {
    background: var(--white);
    padding: 32px 24px;
    border-radius: 12px;
    text-align: center;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    transition: transform 0.3s ease;
}

.tip-card:hover {
    transform: translateY(-5px);
}

.tip-icon {
    font-size: 48px;
    margin-bottom: 20px;
}

.tip-card h3 {
    margin: 0 0 16px;
    font-size: 20px;
    color: var(--primary-red);
}

.tip-card p {
    color: var(--muted);
    line-height: 1.6;
}

.accommodation-cta {
    background: linear-gradient(135deg, var(--primary-red), #dc2626);
    color: var(--white);
    padding: 80px 0;
}

.accommodation-cta .section-title {
    color: var(--white);
}

.accommodation-cta .section-sub {
    color: #e5e7eb;
}

/* Responsive Design for Accommodation */
@media (max-width: 1024px) {
    .accommodation-hero .container {
        grid-template-columns: 1fr;
        gap: 32px;
    }

    .costs-grid {
        grid-template-columns: 1fr;
        gap: 32px;
    }

    .accommodation-grid {
        grid-template-columns: 1fr;
    }

    .help-steps {
        grid-template-columns: repeat(2, 1fr);
    }

    .tips-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .help-steps {
        grid-template-columns: 1fr;
    }

    .tips-grid {
        grid-template-columns: 1fr;
    }

    .help-step::after {
        display: none;
    }
}

@media (max-width: 480px) {
    .accommodation-hero {
        padding: 60px 0;
    }

    .accommodation-types {
        padding: 60px 0;
    }

    .accommodation-help {
        padding: 60px 0;
    }

    .accommodation-costs {
        padding: 60px 0;
    }

    .accommodation-tips {
        padding: 60px 0;
    }

    .accommodation-cta {
        padding: 60px 0;
    }
}

/* Branches Page */
.branches-hero {
    background: var(--white);
    padding: 80px 0;
}

.branches-hero .container {
    display: grid;
    grid-template-columns: 1fr 400px;
    gap: 48px;
    align-items: center;
}

.branches-hero .section-title {
    color: var(--dark);
    font-size: 48px;
}

.branches-hero .section-sub {
    color: var(--muted);
    font-size: 20px;
}

.main-branches {
    background: var(--white);
    padding: 80px 0;
}

.branches-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 48px;
    margin-top: 48px;
    max-width: 900px;
    margin-left: auto;
    margin-right: auto;
}

.branch-card {
    background: var(--light-bg);
    padding: 40px 32px;
    border-radius: 16px;
    text-align: center;
    box-shadow: 0 8px 25px rgba(0,0,0,0.1);
    transition: transform 0.3s ease;
}

.branch-card:hover {
    transform: translateY(-8px);
}

.main-branch {
    background: linear-gradient(135deg, var(--primary-red), #dc2626);
    color: var(--white);
}

.branch-flag {
    font-size: 64px;
    margin-bottom: 20px;
}

.branch-card h3 {
    margin: 0 0 24px;
    font-size: 28px;
    color: var(--primary-red);
}

.main-branch h3 {
    color: var(--white);
}

.branch-address,
.branch-contact,
.branch-hours {
    margin-bottom: 24px;
    text-align: left;
}

.branch-address p,
.branch-contact p,
.branch-hours p {
    margin: 0 0 8px;
    color: var(--muted);
    line-height: 1.5;
}

.main-branch .branch-address p,
.main-branch .branch-contact p,
.main-branch .branch-hours p {
    color: #e5e7eb;
}

.branch-address strong,
.branch-hours strong {
    color: var(--dark);
    font-weight: 600;
}

.main-branch .branch-address strong,
.main-branch .branch-hours strong {
    color: var(--white);
}

.coming-soon-branches {
    padding: 80px 0;
}

.coming-soon-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 32px;
    margin-top: 48px;
}

.coming-soon-card {
    background: #111827;
    border: 1px solid #374151;
    border-radius: 12px;
    padding: 32px 24px;
    text-align: center;
    transition: transform 0.3s ease;
}

.coming-soon-card:hover {
    transform: translateY(-5px);
    border-color: #4b5563;
}

.coming-soon-card h3 {
    color: var(--white);
    margin: 0 0 12px;
    font-size: 20px;
}

.coming-soon-card p {
    color: #d1d5db;
    margin: 0 0 20px;
    font-size: 14px;
}

.status-badge {
    background: var(--primary-red);
    color: var(--white);
    padding: 6px 12px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
    display: inline-block;
}

.branch-services {
    background: var(--light-bg);
    padding: 80px 0;
}

.branch-services .services-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 32px;
    margin-top: 48px;
}

.branch-services .service-item {
    background: var(--white);
    padding: 32px 24px;
    border-radius: 12px;
    text-align: center;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    transition: transform 0.3s ease;
}

.branch-services .service-item:hover {
    transform: translateY(-5px);
}

.branch-services .service-icon {
    font-size: 48px;
    margin-bottom: 20px;
}

.branch-services .service-item h3 {
    margin: 0 0 16px;
    font-size: 20px;
    color: var(--primary-red);
}

.branch-services .service-item p {
    color: var(--muted);
    line-height: 1.6;
}

.branch-contact-cta {
    background: var(--white);
    padding: 80px 0;
}

/* Branches Responsive */
@media (max-width: 1024px) {
    .branches-grid {
        grid-template-columns: 1fr;
        gap: 32px;
    }

    .coming-soon-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .branch-services .services-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .branches-hero .section-title {
        font-size: 36px;
    }

    .coming-soon-grid {
        grid-template-columns: 1fr;
    }

    .branch-services .services-grid {
        grid-template-columns: 1fr;
    }

    .branch-card {
        padding: 32px 24px;
    }

    .branch-flag {
        font-size: 48px;
    }

    .branch-card h3 {
        font-size: 24px;
    }
}

@media (max-width: 768px) {
    .contact-hero .container,
    .branches-hero .container,
    .blog-hero .container {
        grid-template-columns: 1fr;
        gap: 32px;
        text-align: center;
    }

    .hero-icon-large {
        min-height: 200px;
    }

    .contact-icon-bg,
    .branches-icon-bg,
    .blog-icon-bg {
        width: 150px;
        height: 150px;
    }

    .contact-icon,
    .branches-icon,
    .blog-icon {
        font-size: 60px;
    }
}

@media (max-width: 480px) {
    .branches-hero {
        padding: 60px 0;
    }

    .contact-hero {
        padding: 60px 0;
    }

    .blog-hero {
        padding: 60px 0;
    }

    .main-branches {
        padding: 60px 0;
    }

    .coming-soon-branches {
        padding: 60px 0;
    }

    .branch-services {
        padding: 60px 0;
    }

    .branch-contact-cta {
        padding: 60px 0;
    }

    .branches-hero .section-title,
    .contact-hero .section-title,
    .blog-hero .section-title {
        font-size: 28px;
    }

    .branch-card {
        padding: 24px 20px;
    }

    .hero-icon-large {
        min-height: 150px;
    }

    .contact-icon-bg,
    .branches-icon-bg,
    .blog-icon-bg {
        width: 120px;
        height: 120px;
    }

    .contact-icon,
    .branches-icon,
    .blog-icon {
        font-size: 50px;
    }
}

/* Career Counseling Page Styles */
.career-process {
    background: var(--scuk-dark);
    color: var(--white);
    padding: 80px 0;
}

.process-steps {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    gap: 32px;
    margin-top: 48px;
}

.step-item {
    text-align: center;
    padding: 32px 24px;
    background: rgba(255,255,255,0.05);
    border-radius: 12px;
    border: 1px solid rgba(255,255,255,0.1);
}

.step-number {
    width: 60px;
    height: 60px;
    background: var(--primary-red);
    color: var(--white);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    font-weight: 700;
    margin: 0 auto 20px;
}

.step-item h3 {
    color: var(--white);
    margin-bottom: 16px;
    font-size: 20px;
}

.step-item p {
    color: #e5e7eb;
    line-height: 1.6;
}

.career-fields {
    background: var(--white);
    padding: 80px 0;
}

.fields-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 32px;
    margin-top: 48px;
}

.field-card {
    background: var(--white);
    padding: 32px 24px;
    border-radius: 12px;
    border: 1px solid var(--border);
    text-align: center;
    transition: all 0.3s ease;
    box-shadow: 0 4px 12px rgba(0,0,0,0.05);
}

.field-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 32px rgba(0,0,0,0.15);
}

.field-icon {
    font-size: 48px;
    margin-bottom: 20px;
}

.field-card h3 {
    color: var(--dark);
    margin-bottom: 16px;
    font-size: 20px;
}

.field-card p {
    color: var(--muted);
    line-height: 1.6;
}

.success-stories {
    background: var(--light-bg);
    padding: 80px 0;
}

.stories-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 32px;
    margin-top: 48px;
}

.story-card {
    background: var(--white);
    padding: 32px 24px;
    border-radius: 12px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.05);
    text-align: center;
}

.story-content p {
    color: var(--muted);
    font-style: italic;
    line-height: 1.6;
    margin-bottom: 24px;
    font-size: 16px;
}

.story-author strong {
    color: var(--dark);
    display: block;
    margin-bottom: 4px;
}

.story-author span {
    color: var(--primary-red);
    font-size: 14px;
}

@media (max-width: 768px) {
    .process-steps {
        grid-template-columns: 1fr;
        gap: 24px;
    }

    .fields-grid {
        grid-template-columns: 1fr;
        gap: 24px;
    }

    .stories-grid {
        grid-template-columns: 1fr;
        gap: 24px;
    }

    .career-process {
        padding: 60px 0;
    }

    .career-fields {
        padding: 60px 0;
    }

    .success-stories {
        padding: 60px 0;
    }
}

/* Blog Page */
.blog-hero {
    background: var(--white);
    padding: 80px 0;
}

.blog-hero .container {
    display: grid;
    grid-template-columns: 1fr 400px;
    gap: 48px;
    align-items: center;
}

.blog-hero .section-title {
    color: var(--dark);
    font-size: 48px;
}

.blog-hero .section-sub {
    color: var(--muted);
    font-size: 20px;
}

.featured-articles {
    background: var(--white);
    padding: 80px 0;
}

.articles-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 32px;
    margin-top: 48px;
}

.article-card {
    background: var(--white);
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.article-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 25px rgba(0,0,0,0.15);
}

.article-image {
    height: 200px;
    overflow: hidden;
}

.article-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.article-card:hover .article-image img {
    transform: scale(1.05);
}

.article-content {
    padding: 24px;
}

.article-category {
    background: var(--primary-red);
    color: var(--white);
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
    display: inline-block;
    margin-bottom: 12px;
}

.article-content h3 {
    margin: 0 0 12px;
    font-size: 20px;
    color: var(--dark);
    line-height: 1.3;
}

.article-content p {
    margin: 0 0 16px;
    color: var(--muted);
    line-height: 1.6;
    font-size: 14px;
}

.article-meta {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 12px;
    color: var(--muted);
}

.blog-categories {
    padding: 80px 0;
}

.categories-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 32px;
    margin-top: 48px;
}

.category-card {
    background: #111827;
    border: 1px solid #374151;
    border-radius: 12px;
    padding: 32px 24px;
    text-align: center;
    transition: transform 0.3s ease;
}

.category-card:hover {
    transform: translateY(-5px);
    border-color: #4b5563;
}

.category-icon {
    font-size: 48px;
    margin-bottom: 20px;
}

.category-card h3 {
    color: var(--white);
    margin: 0 0 12px;
    font-size: 20px;
}

.category-card p {
    color: #d1d5db;
    margin: 0 0 16px;
    font-size: 14px;
    line-height: 1.5;
}

.post-count {
    background: var(--primary-red);
    color: var(--white);
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 12px;
    font-weight: 600;
}

.newsletter-signup {
    background: var(--light-bg);
    padding: 80px 0;
}

.newsletter-form {
    max-width: 500px;
    margin: 32px auto 0;
}

.newsletter-form .form-group {
    display: flex;
    gap: 12px;
}

.newsletter-form input {
    flex: 1;
    padding: 12px 16px;
    border: 1px solid var(--border);
    border-radius: 6px;
    font-size: 16px;
}

.newsletter-form input:focus {
    outline: none;
    border-color: var(--primary-red);
    box-shadow: 0 0 0 3px rgba(214,40,40,0.1);
}

.blog-coming-soon {
    background: var(--white);
    padding: 80px 0;
}

.coming-soon-content {
    max-width: 600px;
    margin: 0 auto;
}

/* Blog Responsive */
@media (max-width: 1024px) {
    .articles-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .categories-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 768px) {
    .blog-hero .section-title {
        font-size: 36px;
    }

    .articles-grid {
        grid-template-columns: 1fr;
    }

    .categories-grid {
        grid-template-columns: 1fr;
    }

    .newsletter-form .form-group {
        flex-direction: column;
    }

    .newsletter-form input {
        margin-bottom: 12px;
    }
}

@media (max-width: 480px) {
    .blog-hero {
        padding: 60px 0;
    }

    .featured-articles {
        padding: 60px 0;
    }

    .blog-categories {
        padding: 60px 0;
    }

    .newsletter-signup {
        padding: 60px 0;
    }

    .blog-coming-soon {
        padding: 60px 0;
    }

    .blog-hero .section-title {
        font-size: 28px;
    }

    .article-content {
        padding: 20px;
    }

    .category-card {
        padding: 24px 20px;
    }
}
.socials{display:flex;gap:10px;margin-top:8px}

/* Utilities */
.pill{display:inline-block;padding:6px 10px;border-radius:999px;background:var(--scuk-red);color:#fff;font-weight:600}
.muted{color:var(--scuk-muted)}
.center{text-align:center}

/* Responsive */
@media (max-width:900px){
 .cols-3,.cols-4{grid-template-columns:1fr 1fr}
 .feature-grid{grid-template-columns:1fr}
 .cta-grid{grid-template-columns:1fr}
 .degree-tiles .tiles{grid-template-columns:1fr}
 .steps-grid{grid-template-columns:1fr}
 .country-tiles{grid-template-columns:1fr 1fr}
}
@media (max-width:640px){
 .footer-grid{grid-template-columns:1fr}
 .hero h1{font-size:32px}

 /* Additional mobile optimizations */
 .container {
     padding: 0 15px;
 }

 .section-title {
     font-size: 28px;
 }

 .btn {
     padding: 10px 20px;
     font-size: 14px;
 }

 /* Improve grid layouts for very small screens */
 .services-grid,
 .features-grid,
 .process-steps,
 .countries-grid,
 .universities-grid,
 .programs-grid,
 .cost-grid,
 .offices-grid,
 .contact-grid,
 .articles-grid,
 .categories-grid,
 .branches-grid {
     grid-template-columns: 1fr !important;
     gap: 20px;
 }

 /* Better spacing for cards */
 .service-card,
 .feature-card,
 .process-step,
 .country-card,
 .university-card,
 .program-card,
 .office-card,
 .article-card,
 .branch-card {
     margin-bottom: 20px;
 }

 /* Improve form layouts */
 .form-row,
 .form-grid {
     grid-template-columns: 1fr !important;
     gap: 15px;
 }

 /* Better text sizing */
 h1 { font-size: 28px !important; }
 h2 { font-size: 24px !important; }
 h3 { font-size: 20px !important; }
 h4 { font-size: 18px !important; }

 /* Improve button spacing */
 .cta-buttons,
 .quick-contact-buttons {
     flex-direction: column;
     align-items: center;
     gap: 15px;
 }
}

