/*
Theme Name: Pioneer Furnaces
Theme URI: https://www.pioneerfurnaces.com
Author: Pioneer Furnaces Pvt Ltd
Author URI: https://www.pioneerfurnaces.com
Description: Official custom WordPress theme for Pioneer Furnaces Pvt Ltd - Media & Blogs page included
Version: 1.2
License: GNU General Public License v2 or later
Text Domain: pioneer-furnaces
*/

/* ============================================
   TABLE OF CONTENTS
   ============================================
   1. Global Styles & Variables
   2. Header & Navigation
   3. Hero Section
   4. Buttons
   5. Cards & Components
   6. Timeline / History Slider
   7. Tabs
   8. Forms
   9. Footer
   10. Product Gallery
   11. Tables
   12. Career Page
   13. Media Page
   14. Member / Team Section
   15. Testimonials
   16. Responsive Styles
   ============================================ */

/* --------------------------------------------
   1. GLOBAL STYLES & VARIABLES
   -------------------------------------------- */
body {
    font-family: "Open Sans", sans-serif;
    color: #333;
    overflow-x: hidden;
}

:root {
    --theme-blue: #0061CA;
    --font-color: #232323;
    --theme-orange: #ff7a18;
}

a {
    text-decoration: none;
    color: var(--font-color);
}

a:hover {
    color: var(--theme-blue);
}

ul li {
    color: var(--font-color);
}

h1, h2, h3, h4, h5 {
    font-family: "Cairo", sans-serif;
}

p {
    color: #272525;
    font-size: 18px;
    text-transform: none !important;
}

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

.theme-border {
    border: 1px solid var(--theme-blue) !important;
}

.theme-border-style-2 {
    border: 1px dotted var(--theme-blue) !important;
}

.theme-border2 {
    border: 1px solid var(--theme-orange) !important;
}

@media (min-width: 1400px) {
    .container,
    .container-lg,
    .container-md,
    .container-sm,
    .container-xl,
    .container-xxl {
        max-width: 1250px;
    }
}

.mt-50 {
    margin-top: 50px;
}

.mb-80 {
    margin-bottom: 80px;
}

.fs-40 {
    font-size: 40px;
}

.fw-7 {
    font-weight: 700;
}

.section-title {
    background: linear-gradient(90deg, #3B8BC5 0%, #253C62 50%, #F4914B 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 700;
    text-transform: uppercase;
}

.border-line {
    background: linear-gradient(90deg, #3B8BC5 0%, #253C62 50%, #F4914B 100%);
    height: 3px;
    width: 80px;
    margin-bottom: 20px;
}

/* --------------------------------------------
   2. HEADER & NAVIGATION
   -------------------------------------------- */
.top-header {
    transition: all 0.4s ease;
}

.top-header.hide {
    transform: translateY(-100%);
    opacity: 0;
    pointer-events: none;
}

.navbar {
    position: sticky;
    top: 0;
    z-index: 1000;
    transition: all 0.3s ease;
}

header {
    background: #fff;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    position: sticky;
    top: -110px;
    z-index: 1000;
}

.header-left img {
    height: 80px;
}

.header-right img {
    height: 60px;
}

.main-header {
    background: #fff;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
}

.navbar .nav-link {
    color: #000;
    font-weight: 500;
    padding: 10px 16px;
}

.navbar .nav-link:hover,
.navbar .nav-link.active {
    color: #0056b3;
}

.navbar .dropdown-menu {
    border-radius: 0;
    border-top: 2px solid #0056b3;
}

.navbar .dropdown-item:hover {
    background-color: #f5f5f5;
}

.active_menu {
    color: #0056b3 !important;
}

.active_product_menu {
    background: #f5f5f5 !important;
}

/* --------------------------------------------
   3. HERO SECTION
   -------------------------------------------- */
.hero {
    min-height: 80vh;
    background-size: cover;
    background-position: center;
    transition: background-image 1s ease-in-out;
    position: relative;
}

#hero-title {
    transition: opacity 0.5s ease-in-out;
}

.hero::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.hero .container {
    z-index: 2;
}

.hero h1 {
    font-size: 60px;
    font-weight: 700;
    text-transform: uppercase;
    color: #fff;
}

.hero h1 span {
    font-size: 55px;
    font-weight: 400;
    font-family: "Open Sans", sans-serif;
    text-transform: capitalize;
}

.pioneer-hero-section {
    position: relative;
    width: 100%;
    height: 80vh;
    display: flex;
    align-items: center;
    padding-left: 8%;
}

.pioneer-hero-content {
    max-width: 700px;
}

.pioneer-hero-title {
    color: #ffffff;
    font-size: 40px;
    font-weight: 700;
    line-height: 1.3;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.events-hero-title {
    font-size: 120px !important;
    line-height: 0.9;
    text-transform: uppercase !important;
}

.banner-btn-group {
    margin-top: 30px;
}

/* --------------------------------------------
   4. BUTTONS
   -------------------------------------------- */
.theme-btn {
    color: #fff;
    text-decoration: none;
    padding: 10px 20px;
    border-radius: 8px;
    font-weight: 600;
    font-size: 14px;
    text-transform: uppercase;
    display: inline-block;
    transition: all 0.3s ease;
}

.btn-orange {
    background: linear-gradient(172.16deg, #FF9E36 5.08%, #E26307 93.02%);
    box-shadow: 0px 6px 0px 0px #B34B00;
}

.btn-blue {
    background: linear-gradient(172.89deg, #0061CA 18.85%, #64A5EB 93.37%);
    box-shadow: 0px 6px 0px 0px #003166;
}

.btn-orange:hover {
    box-shadow: 0px 4px 0px 0px #B34B00;
    color: #fff;
    text-decoration: none;
}

.btn-blue:hover {
    box-shadow: 0px 4px 0px 0px #003166;
    color: #fff;
    text-decoration: none;
}

.btn-orange-2 {
    background: #fff;
    color: #FF9E36;
    padding: 15px 40px;
    border-radius: 9px;
    text-transform: uppercase;
    font-weight: 600;
    border: 1px solid #FF9E36;
}

.btn-orange-2:hover {
    background: linear-gradient(172.16deg, #FF9E36 5.08%, #E26307 93.02%);
    color: #fff;
}

.btn-orange-2-active {
    background: linear-gradient(172.16deg, #FF9E36 5.08%, #E26307 93.02%) !important;
    color: #fff;
}

.btn-primary {
    background-color: #0056b3;
    border: none;
    padding: 8px 20px;
    font-weight: 500;
}

.btn-primary:hover {
    background-color: #00408a;
}

.theme-orange-btn {
    background: linear-gradient(172.16deg, #FF9E36 5.08%, #E26307 93.02%);
    padding: 20px 40px;
    color: #fff;
    border-radius: 8px;
    font-size: 26px;
    z-index: 1;
}

.theme-orange-btn i {
    font-size: 35px;
    margin-right: 10px;
}

.orange-btn-section {
    margin-top: -40px;
}

.apply-btn {
    display: block;
    text-align: center;
    padding: 10px;
    border-radius: 8px;
    color: #fff;
    text-decoration: none;
    background: linear-gradient(90deg, #2f6fe4, #ff8a3d);
    font-weight: 500;
}

.read-more-btn-2 {
    font-weight: 700;
    text-decoration: underline;
}

/* --------------------------------------------
   5. CARDS & COMPONENTS
   -------------------------------------------- */
.why-card {
    padding: 25px;
    border-radius: 15px;
    height: 100%;
    transition: all 0.3s ease;
    box-shadow: 0px 0px 6.46px 0px #0000001A;
    margin-top: 30px;
    text-align: justify;
    border: 1px solid #fff;
    background: #fff;
}

.why-card:hover {
    border: 1px solid var(--theme-blue);
}

.why-card h5 {
    color: #295586;
    font-weight: 700;
    text-transform: uppercase;
    text-align: left;
}

.why-card ul li {
    color: var(--font-color);
}

.why-card p {
    text-align: left;
}

.blog-card {
    transition: transform 0.3s ease;
    background: #fff;
}

.blog-card:hover {
    transform: translateY(-5px);
}

.blog-card img {
    width: 100%;
    height: 200px;
    object-fit: cover;
    border-radius: 8px;
}

.blog-card span {
    font-size: 12px;
}

.industry-card {
    border: 2px solid;
    border-image: linear-gradient(90deg, #2E6D9A, #F3904B);
    border-image-slice: 1;
    box-shadow: 0.5px 0.5px 6px 0px #00000026;
    padding: 20px 20px;
    color: #6C6C6C;
    height: 100%;
    vertical-align: middle;
    transition: all 0.3s ease;
}

.industry-card:hover {
    background: linear-gradient(90deg, #3B8BC5 0%, #253C62 50%, #F4914B 100%);
    color: #fff;
}

.industry-card:hover p,
.industry-card:hover b {
    color: #fff !important;
}

.product-why-choose-card {
    border: 2px solid;
    border-image: linear-gradient(90deg, #2E6D9A, #F3904B);
    border-image-slice: 1;
    box-shadow: 0.5px 0.5px 6px 0px #00000026;
    padding: 20px 20px;
    color: #6C6C6C;
    height: 100%;
    vertical-align: middle;
}

.product-why-choose-card h5 {
    color: #0061CA;
    font-weight: 700;
    font-size: 20px;
    text-transform: uppercase;
}

.industry-served-card {
    padding-top: 50px;
    padding-bottom: 0px;
}

.client-card-shadow {
    box-shadow: 0px 1px 4px 0px #00000033;
    transition: all 0.3s ease;
}

.client-card-shadow img {
    width: 100%;
    height: auto;
    transition: all 0.3s ease;
}

.client-card-shadow:hover {
    transform: scale(1.05);
    transition: 0.3s;
}

.feature-card {
    box-shadow: 3px 3px #0061CA;
    border: 1px solid #0061CA;
}

.feature-card:hover {
    box-shadow: 0px 0px #0061CA;
}

.product-card {
    width: 100%;
    background: #fff;
    padding: 15px;
    border-radius: 15px;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: 0.3s;
}

.product-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 12px 25px rgba(0, 0, 0, 0.12);
}

.product-card img {
    width: 100%;
    object-fit: contain;
    background: #D6D5D533;
    border-radius: 15px;
}

.h-prodct .product-img {
    height: 400px;
}

.h-prodct-silver-bg {
    background: linear-gradient(89.78deg, rgba(255, 255, 255, 0.5) 15.64%, rgba(213, 213, 213, 0.5) 109.4%);
}

.job-card {
    background: #fff;
    border-radius: 14px;
    padding: 20px;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08);
}

.job-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.job-header h3 {
    margin: 0;
}

.job-detailcard {
    margin: 0 100px;
    padding: 30px;
    box-shadow: 1px 3px 9px 1px #dcdcdc;
}

/* Card Pointers */
.card-pointer-parent {
    position: relative;
}

.card-pointer-lt,
.card-pointer-rt,
.card-pointer-lb,
.card-pointer-rb {
    position: absolute;
    background: linear-gradient(172.89deg, #0061CA 18.85%, #64A5EB 93.37%);
    width: 10px;
    height: 10px;
    border-radius: 30px;
}

.card-pointer-lt { top: 10px; left: 10px; }
.card-pointer-rt { top: 10px; right: 10px; }
.card-pointer-lb { bottom: 10px; left: 10px; }
.card-pointer-rb { bottom: 10px; right: 10px; }

/* --------------------------------------------
   6. TIMELINE / HISTORY SLIDER
   -------------------------------------------- */
.timeline-wrapper {
    position: relative;
    width: 100%;
    height: 380px;
    overflow: hidden;
    border-radius: 1rem;
    display: flex;
    gap: 60px;
}

.timeline-rail {
    position: absolute;
    top: 0;
    left: 0;
    width: 120px;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    align-items: center;
    z-index: 10;
    padding-top: 5rem;
    padding-bottom: 5rem;
}

.timeline-item {
    display: flex;
    align-items: center;
    width: 100%;
    cursor: pointer;
    transition: color 0.3s;
}

.timeline-item:hover .timeline-dot {
    transform: scale(1.2);
    border-color: #0056b3;
}

.timeline-year {
    font-size: 2.25rem;
    font-weight: 700;
    color: #d1d5db;
    transition: color 0.3s;
    width: 70px;
    text-align: right;
    line-height: 1;
}

.timeline-dot {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background-color: white;
    border: 3px solid #d1d5db;
    z-index: 20;
    transition: all 0.3s;
    margin-right: 10px;
}

.timeline-item.active .timeline-year {
    color: #374151;
}

.timeline-item.active .timeline-dot {
    background-color: #0056b3;
    border-color: #0056b3;
    width: 16px;
    height: 16px;
}

.mySwiper {
    width: 100%;
    height: 100%;
    padding-left: 140px;
}

.swiper-slide {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    padding: 5rem 2rem 5rem 0;
    box-sizing: border-box;
}

.slide-content-grid {
    display: grid;
    grid-template-columns: 1fr 1.5fr;
    gap: 2rem;
    align-items: center;
}

.slide-image {
    width: 100%;
    height: 350px;
    object-fit: cover;
    border-radius: 0.75rem;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
}

.timeline-section {
    background: #fbfbfbd1;
    background: linear-gradient(89.78deg, rgba(255, 255, 255, 0.5) 15.64%, rgba(213, 213, 213, 0.5) 109.4%);
}

.timeline-seciton {
    background-color: #f7fbff;
}

.timeline-years {
    list-style: none;
    padding: 0 30px;
    margin: 0;
    overflow-y: scroll;
    scroll-behavior: smooth;
}

.timeline-years li {
    font-size: 22px;
    font-weight: 600;
    color: #cfcfcf;
    margin-bottom: 30px;
    cursor: pointer;
    position: relative;
    padding-left: 30px;
}

.timeline-years li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    width: 12px;
    height: 12px;
    background: #dcdcdc;
    border-radius: 50%;
    transform: translateY(-50%);
}

.timeline-years li.active {
    color: #000;
}

.timeline-years li.active::before {
    background: linear-gradient(90deg, #3B8BC5 0%, #253C62 50%, #F4914B 100%);
}

.timeline-content {
    flex: 1;
    padding-top: 100px;
    padding-left: 50px;
    color: #002f6c;
}

.timeline-item {
    display: none;
    align-items: center;
    gap: 40px;
}

.timeline-item.active {
    display: flex;
}

.timeline-item img {
    width: 200px;
    max-width: 100%;
}

.timeline-item h2 {
    font-size: 32px;
    font-weight: 660;
    line-height: 1.2;
    text-transform: capitalize;
}

/* --------------------------------------------
   7. TABS
   -------------------------------------------- */
button {
    border: none;
}

.tab-btn:hover {
    opacity: 0.9;
}

.tab-btn.active {
    background: linear-gradient(172.16deg, #FF9E36 5.08%, #E26307 93.02%) !important;
    color: #fff;
}

#second_tab,
#third_tab,
#fourth_tab {
    display: none;
}

/* --------------------------------------------
   8. FORMS
   -------------------------------------------- */
.contact-form {
    background: linear-gradient(90deg, #3B8BC5 0%, #253C62 50%, #F4914B 100%);
    padding: 20px;
    border-radius: 4px;
    margin-right: 50px;
}

.contact-form input {
    padding: 10px 20px;
    border-radius: 10px;
    border: none;
}

.contact-us-form-section {
    margin: 100px 0;
}

.contact-form .form-btn {
    background: linear-gradient(172.16deg, #FF9E36 5.08%, #E26307 93.02%);
    color: #fff;
}

.subscribe-section {
    background-image: url('../images/contact/subscribe.png');
}

.subscribe-section input {
    padding: 10px;
}

.subscribe-form-submit-btn {
    margin-left: -5px;
    background: linear-gradient(90deg, #3B8BC5 0%, #253C62 50%, #F4914B 100%);
    color: #fff;
    border: none;
}

.resume-section {
    background: linear-gradient(89.47deg, rgba(248, 244, 242, 0.1) 7.03%, rgba(146, 144, 142, 0.1) 98.71%);
    padding: 60px 15px;
    text-align: center;
}

.resume-section h2 span {
    color: #1e73be;
}

.resume-card {
    max-width: 700px;
    margin: 40px auto 0;
    padding: 30px;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08);
    text-align: left;
}

.form-control,
.form-select {
    background: #f5f6f8;
    border-radius: 6px;
}

.resume-section form label {
    color: #0061CA;
    font-weight: 600;
}

.form-text {
    font-size: 12px;
    color: #777;
}

/* --------------------------------------------
   9. FOOTER
   -------------------------------------------- */
footer {
    background-image: url('../images/home/strap.png');
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    color: #fff;
    padding-top: 40px;
    padding-bottom: 80px;
    font-size: 14px;
}

footer a {
    color: #fff;
    text-decoration: none;
}

footer .logo {
    height: 100px;
}

footer h4 {
    text-transform: uppercase;
    font-weight: 700;
}

footer ul li {
    list-style: none;
    color: #fff;
}

footer .social-icons i {
    font-size: 20px;
}

.copyright-footer {
    padding-top: 100px;
    padding-bottom: 30px;
}

.floating-footer-main {
    position: relative;
}

.floating-footer {
    width: 100%;
    padding: 20px 20px;
    background-color: #fff;
    position: absolute;
    top: -160px;
    left: 0px;
    font-weight: 600;
}

/* --------------------------------------------
   10. PRODUCT GALLERY
   -------------------------------------------- */
.product-gallery {
    padding: 60px 0;
}

.product-benefits-card {
    margin-top: 50px;
}

.billet-heater-img {
    height: 450px;
}

.channel-induction-furnace-img {
    height: 600px;
}

.cp-icon {
    width: 30px;
    height: 40px;
}

/* --------------------------------------------
   11. TABLES
   -------------------------------------------- */
.theme-list {
    list-style: none;
}

.theme-table {
    border-radius: 18px;
}

.theme-table tr th {
    text-align: left;
    padding: 10px 20px;
    border: 1px solid #E0E0E0;
    width: 50%;
    font-weight: 700;
    font-size: 18px;
}

.theme-table tr td {
    text-align: left;
    padding: 10px 20px;
    border: 1px solid #E0E0E0;
}

.theme-table thead {
    background: linear-gradient(90deg, #3B8BC5 0%, #253C62 50%, #F4914B 100%);
    color: #fff;
}

/* --------------------------------------------
   12. CAREER PAGE
   -------------------------------------------- */
.jobs-section {
    max-width: 1200px;
    margin: auto;
    padding: 40px 20px;
}

.job-tabs {
    display: flex;
    gap: 12px;
    justify-content: center;
    margin-bottom: 30px;
}

.job-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
    gap: 25px;
}

.badge {
    font-size: 12px;
    padding: 4px 10px;
    border-radius: 12px;
    background: #ffe9d6;
    color: #ff7a18;
}

.badge.blue {
    background: #e7f1ff;
    color: #2f6fe4;
}

.badge.green {
    background: #e8f7ee;
    color: #1f8f4a;
}

.badge.gray {
    background: #f0f0f0;
    color: #555;
}

.job-meta {
    list-style: none;
    padding: 0;
    margin: 12px 0;
    font-size: 14px;
    color: #666;
}

.job-meta li {
    margin-bottom: 6px;
}

.job-card p {
    font-size: 14px;
    color: #555;
    margin-bottom: 18px;
}

.life-at-pioneer img {
    height: 250px;
    border-radius: 8px;
}

.video-border {
    border: 1px dashed #2f6fe4;
    border-radius: 8px;
}

/* --------------------------------------------
   13. MEDIA PAGE
   -------------------------------------------- */
.media-tabs-section {
    padding-top: 60px;
}

.media-title {
    color: #0056b3;
    font-weight: 700;
    letter-spacing: 2px;
    margin-bottom: 40px;
}

.media-tabs {
    gap: 15px;
}

.media-tabs .nav-link {
    background-color: #fff;
    border: 2px solid #0056b3;
    color: #0056b3;
    padding: 12px 30px;
    border-radius: 12px 12px 0 0;
    font-weight: 600;
    transition: all 0.3s ease;
}

.media-tabs .nav-link:hover {
    background-color: #0056b3;
    color: #fff;
}

.media-tabs .nav-link.active {
    background-color: #0056b3;
    border-color: #0056b3;
    color: #ffffff;
}

.tab-content {
    background-color: #ffffff;
    padding: 20px 40px;
    border-radius: 0 0 12px 12px;
}

/* --------------------------------------------
   14. MEMBER / TEAM SECTION
   -------------------------------------------- */
.member-section img {
    height: 310px;
    border-radius: 15px;
    background-color: #f3f9ff;
}

.member-section h4 {
    font-size: 22px;
    font-weight: 700;
    margin-bottom: 0;
    color: #0056b3;
}

.member-section p {
    margin: 0;
    font-size: 14px;
    color: #4a4a4a;
    font-weight: 600;
}

.member-section .content {
    padding: 20px 0;
    background-color: #eff7ff;
    border-radius: 15px;
    box-shadow: 0px 4px #0056b3;
}

.memeber-linkedin-icon {
    color: #0056b3;
    position: absolute;
    top: 14px;
    right: 14px;
    font-size: 30px;
}

.member-card {
    border: 1px solid #0061CA;
}

.member-card:hover {
    box-shadow: 0px 0px 46px -24px #0056b3;
    border: none;
}

.team-box {
    margin-right: 30px;
    margin-bottom: 30px;
}

.team-box p {
    text-align: center;
}

/* --------------------------------------------
   15. TESTIMONIALS
   -------------------------------------------- */
.testimonial-slider .row {
    padding: 0 100px;
}

.clientVideoSlider .card {
    width: 100%;
    margin: 20px auto;
    box-shadow: 0px 2px 21px 0px #00000040;
    border: 0;
}

/* --------------------------------------------
   16. OTHER COMPONENTS
   -------------------------------------------- */
.home-second-section {
    padding-top: 50px;
}

.home-second-section p {
    font-size: 17px;
}

.year-floating-main {
    position: relative;
}

.year-floating-logo {
    background-image: url('../images/home/50-years.png');
    width: 130px;
    height: 180px;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    z-index: 9;
    position: absolute;
    top: 0;
    right: 0;
}

.fourth-section {
    padding: 50px 0;
}

.highlight-strap {
    background-image: url('../images/home/strap.png');
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    color: #fff;
    font-family: "Cairo", sans-serif;
}

.highlight-strap .text {
    font-size: 30px;
    font-weight: 400;
}

.highlight-strap .text span {
    font-size: 40px;
    font-weight: 700;
}

.highlight-strap .big-title {
    font-size: 55px;
}

.highlight-strap .big-title span {
    font-weight: 700;
}

.highlight-strap .linkdin-icon {
    height: 40px;
}

.highlight-strap .owner-img {
    position: absolute;
    height: 500px;
    bottom: 0;
    right: 240px;
}

.highlight-strap-2 {
    position: relative;
}

.industries-grid span {
    display: inline-block;
    background: #f0f2f5;
    padding: 10px 20px;
    border-radius: 30px;
    margin: 5px;
    font-size: 14px;
}

.stats {
    background: #002f6c;
    color: #fff;
    padding: 60px 0;
    text-align: center;
}

.clients img {
    max-height: 60px;
    filter: grayscale(100%);
    transition: 0.3s;
}

.clients img:hover {
    filter: none;
}

.border-dashed {
    border-bottom: 1px dashed var(--theme-blue);
}

.infra-title {
    color: #6C6C6C;
    font-weight: 700;
}

.year-img {
    height: 30px;
}

.vm-card-section {
    background-image: url('../images/about/vm-section-bg.png');
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 100px 0;
}

.v-divider {
    border-right: 1px solid #000;
}

.vm-card-section img {
    height: 50px;
}

.ve-cultrure-section {
    padding: 100px 0;
}

.qe-section {
    background-image: url('../images/about/vm-section-bg.png');
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    padding: 100px 0;
}

.qe-icon img {
    background-color: #fff;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
    padding: 15px;
    margin-top: -96px;
    margin-left: -25px;
    border-radius: 10px 10px 10px 0;
}

.blog {
    padding: 150px 0;
}

.blog .h1 {
    font-size: 30px;
    font-weight: 400;
}

.blog .h2 {
    font-size: 50px;
    font-weight: 700;
}

.single-blog-main {
    margin: 50px 0;
}

.theme-h5 {
    color: #434343;
    font-weight: 700;
}

.cta-section {
    padding: 100px 0;
    background-image: url(../images/home/strap.png);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    color: #fff;
}

.cta-section h2 {
    font-weight: 800;
    font-size: 42px;
}

.list-unstyled li i {
    color: #4b6e94;
}

.capacity-info p {
    font-size: 14px;
    margin-bottom: 0;
}

.state-counter h2 {
    font-weight: 700;
    font-size: 50px;
}

.flag-img {
    height: 20px;
}

.hide-content {
    display: none;
}

.box-1 {
    border: 2px solid var(--theme-blue);
    text-align: center;
}

.box-1 img {
    width: 100%;
    padding: 10px;
}

.p-title {
    background-color: var(--theme-blue);
    color: #fff;
}

.pioneer-glance p {
    font-size: 17px !important;
}

/* Blog System */
.blog-system ul li {
    font-size: 1.5rem;
    list-style: disc !important;
    font-weight: 500 !important;
}

.blog-system ol li {
    font-size: 1.5rem;
    list-style: decimal !important;
    font-weight: 500 !important;
}

@media only screen and (min-width: 1200px) {
    .container-width {
        width: 900px !important;
    }
}

/* --------------------------------------------
   17. RESPONSIVE STYLES
   -------------------------------------------- */
@media (min-width: 768px) {
    .floating-footer {
        width: 600px;
        font-size: 28px;
    }
}

@media (max-width: 992px) {
    .pioneer-hero-section {
        height: 80vh;
        padding-left: 5%;
    }
    .pioneer-hero-title {
        font-size: 38px;
    }
}

@media (max-width: 768px) {
    .timeline-wrapper {
        height: 80vh;
    }
    .timeline-rail {
        width: 70px;
    }
    .timeline-rail::before {
        left: 60px;
    }
    .timeline-year {
        font-size: 1.5rem;
        width: 50px;
    }
    .mySwiper {
        padding-left: 80px;
    }
    .swiper-slide {
        padding: 2rem 1rem 2rem 0;
    }
    .slide-content-grid {
        grid-template-columns: 1fr;
        gap: 1.5rem;
    }
    .slide-image {
        height: 200px;
    }
}

@media (max-width: 767px) {
    .year-floating-logo {
        width: 75px;
        height: 100px;
    }
    .h-prodct .product-img {
        width: 100%;
        height: auto;
    }
    .hero h1 {
        font-size: 35px;
    }
    .hero h1 span {
        font-size: 40px;
    }
    .v-divider {
        border: none;
    }
    .mobile-mt-20 {
        margin-top: 20px;
    }
    .mobile-mt-40 {
        margin-top: 40px;
    }
    .events-hero-title {
        font-size: 50px !important;
    }
}

@media (max-width: 576px) {
    .pioneer-hero-section {
        height: 70vh;
        padding: 0 20px;
    }
    .pioneer-hero-title {
        font-size: 26px;
        line-height: 1.4;
    }
}
/* Clean Media Page - Remove extra space */
.main-header {
    padding: 15px 0 !important;
    margin-bottom: 0 !important;
}

.media-tabs .nav-link {
    margin: 0 6px;
    padding: 12px 28px;
    border-radius: 50px;
    font-weight: 600;
}

.blog-card {
    transition: all 0.3s ease;
}

.blog-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 15px 30px rgba(0,0,0,0.1) !important;
}

/* Remove sidebar completely on media page */
.page-template-media-php .sidebar,
.page-template-media-php aside {
    display: none !important;
}

.page-template-media-php .content-area,
.page-template-media-php main {
    width: 100% !important;
    max-width: 100% !important;
}