@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap');

* {
    font-family: "Open Sans", sans-serif;
    font-style: normal;
}

a {
    text-decoration: none;
}

body {
    background: linear-gradient(45deg, #f8e9e9, transparent);
}

.main-section {
    padding: 20px 0 0;
}

.main-section .row > * {
    padding-right: 8px;
    padding-left: 8px;
}

.main-section .row > *:nth-child(odd) {
    padding-right: 3px;
}

.main-section .row > *:nth-child(even) {
    padding-left: 3px;
}

.front-section {
    background: linear-gradient(135deg, #070d52, #1f2fff);
    border-radius: 12px;
    margin-bottom: 15px;
    height: 93px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    overflow: hidden;
    transition: all 0.4s ease;
    box-shadow: 0 5px 15px rgba(0,0,0,0.15);
}

/* Glow effect layer */
.front-section::before {
    content: "";
    position: absolute;
    width: 150%;
    height: 150%;
    background: rgba(255,255,255,0.08);
    top: -50%;
    left: -50%;
    transform: rotate(25deg);
    transition: all 0.5s ease;
}

/* Title styling */
.front-section h3 {
    color: #fff;
    font-size: 20px;
    font-weight: 600;
    margin: 0;
    z-index: 1;
    letter-spacing: 1px;
    transition: 0.3s;
}

/* Section background */
.Company-Overview-section {
    padding: 20px 10px;
    background: #f4f6ff;
}

/* Remove link underline */
.Company-Overview-section a {
    text-decoration: none;
    color: inherit;
}

/* Logo styling */
.Company-Overview-section .logo-upper {
    height: 100px;
    margin-bottom: 15px;
    transition: transform 0.3s ease;
}
.Company-Overview-section .logo-upper:hover {
    transform: scale(1.05);
}

/* Paragraph styling */
.Company-Overview-section p {
    font-size: 16px;
    text-align: justify;
    color: #333;
    font-weight: 700;
    line-height: 1.6;
    margin-bottom: 10px;
    position: relative;
}

/* Stylish underline effect */
.Company-Overview-section p::after {
    content: "";
    display: block;
    width: 100%;
    height: 3px;
    background: #f44336;
    margin: 6px auto 0;
    border-radius: 5px;
}

/* Image card */
.leader_b {
    background: #fff;
    padding: 8px;
    border-radius: 12px;
    box-shadow: 0 5px 15px rgba(0,0,0,0.1);
    overflow: hidden;
    margin-bottom: 15px;
    transition: all 0.4s ease;
}

/* Image styling */
.leader_b img {
    width: 100%;
    height: 250px;
    object-fit: cover;
    border-radius: 10px;
    transition: transform 0.4s ease;
}

/* Hover effects */
.leader_b:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 25px rgba(0,0,0,0.2);
}

.leader_b:hover img {
    transform: scale(1.08);
}

/* Grid spacing fix */
.Company-Overview-section .row > div {
    padding: 6px;
}


/* Logo styling */
.main-section .logo-upper {
    height: 110px;
    margin-bottom: 15px;
    transition: transform 0.3s ease;
}
.main-section .logo-upper:hover {
    transform: scale(1.05);
}

/* Sidebar container */
.side-container {
    height: 84vh;
    overflow-y: auto;
    background: #0f1c4d;
    border-radius: 10px;
    padding: 5px 5px 0;
}


.side-container::-webkit-scrollbar {
    width: 0px;
}
.side-container::-webkit-scrollbar-thumb {
    background: #4a6bff;
    border-radius: 10px;
}

/* Filter buttons */
.filter-button {
    width: 100%;
    font-size: 15px;
    padding: 8px 12px;
    margin-bottom: 6px;
    text-align: left;
    color: #fff;
    background: linear-gradient(45deg, #1d2d67, #2f4fff);
    border-radius: 6px;
    transition: all 0.3s ease;
    cursor: pointer;
}

/* Hover + active effects */
.filter-button:hover {
    background: linear-gradient(45deg, #2f4fff, #050fc4);
    transform: translateX(5px);
}

.filter-button.active {
    background: #050fc4;
    box-shadow: 0 0 10px rgba(0, 0, 255, 0.5);
}

/* Right image section */
.producr-image {
    border-radius: 10px;
    background: #fff;
    padding: 5px 0px;
    text-align:center;
}

/* Image styling */
.producr-image img {
    object-fit: contain;
    border-radius: 10px;
    transition: transform 0.4s ease;
    height: 490px;
}

/* Padding fix */
.custom-padding-left {
    padding-left: 10px !important;
}

.custom-details h1{
    font-weight: 900;
    font-size: 55px;
    text-align: center;
    margin: 0;
    padding-top: 7px;
    color: #e82626;
    background: linear-gradient(45deg, #ff6a00, #ee0979);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
    .main-section .logo-upper {
         height:70px;
    }
    .custom-details h1 {
        font-size:23px;
    }
    .leader_b img {
        height: 120px;
    }
    .Company-Overview-section .logo-upper {
         height:70px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 1024px) {
    .main-section .logo-upper {
        height: 100px;
    }
    .custom-details h1 {
        font-size: 38px;
        padding-top: 25px;
    }
    .leader_b img {
        height: 250px;
    }
    .Company-Overview-section .logo-upper {
         height:100px;
    }
    .front-section h3 {
        font-size:25px;
    }
    .producr-image img{
        height: 510px;
        width: 100%;
    }
}