/* =====================================================
   Components Stylesheet (Premium v2)
   ===================================================== */

/* --- Hero Section v3 (Image Below Text) --- */
.hero-v3{position:relative;overflow:hidden;background:linear-gradient(135deg,var(--blue-900) 0%,var(--blue-800) 40%,var(--blue-700) 100%);padding:120px 0 0}
.hero-v3-bg{position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.03'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E")}
.hero-v3-content{position:relative;z-index:2;max-width:750px;margin:0 auto;text-align:center;padding-bottom:40px}
.hero-v3 h1{color:#fff;margin-bottom:20px;text-shadow:0 2px 20px rgba(0,0,0,.2);font-size:clamp(1.8rem,4.5vw,2.8rem)}
.hero-v3 .hero-badge{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.1);backdrop-filter:blur(6px);border:1px solid rgba(255,255,255,.15);padding:8px 18px;border-radius:50px;color:var(--orange-500);font-size:.82rem;font-weight:600;margin-bottom:20px}
.hero-v3 .hero-subtitle{color:rgba(255,255,255,.85);font-size:clamp(1rem,2.5vw,1.15rem);margin-bottom:30px;line-height:1.9;max-width:650px;margin-left:auto;margin-right:auto}
.hero-v3 .hero-buttons{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:28px;justify-content:center}
.hero-v3 .hero-trust{display:flex;gap:20px;flex-wrap:wrap;justify-content:center}
.hero-v3 .trust-item{display:flex;align-items:center;gap:6px;color:rgba(255,255,255,.7);font-size:.82rem}
.hero-v3 .trust-item i{color:var(--orange-500);font-size:.7rem}

/* Hero Showcase Image */
.hero-showcase{position:relative;z-index:2;max-width:900px;margin:0 auto;padding-bottom:0}
.hero-showcase-img{position:relative;border-radius:20px 20px 0 0;overflow:hidden;box-shadow:0 -5px 40px rgba(0,0,0,.3)}
.hero-showcase-img img{width:100%;height:400px;object-fit:cover;display:block}
.hero-showcase-overlay{position:absolute;bottom:0;left:0;right:0;display:flex;justify-content:center;gap:0;background:linear-gradient(to top,rgba(13,71,161,.95),transparent)}
.hso-stat{flex:1;text-align:center;padding:24px 16px;color:#fff;border-left:1px solid rgba(255,255,255,.15)}
.hso-stat:last-child{border-left:none}
.hso-stat i{font-size:1.4rem;color:var(--orange-500);display:block;margin-bottom:6px}
.hso-stat strong{display:block;font-size:1.3rem;font-weight:800}
.hso-stat span{font-size:.75rem;color:rgba(255,255,255,.7);font-weight:500}
@media(max-width:768px){.hero-v3{padding:100px 0 0}.hero-showcase-img img{height:250px}.hso-stat{padding:14px 8px}.hso-stat strong{font-size:1rem}}

/* --- Counter Strip v3 --- */
.counter-strip{background:var(--white);padding:35px 0;box-shadow:var(--shadow-sm);position:relative;z-index:3;width:100%;overflow:hidden}
.counter-grid{display:flex;justify-content:center;gap:30px;flex-wrap:wrap}
.counter-item{text-align:center;display:flex;flex-direction:column;align-items:center;gap:4px;flex:1;min-width:140px}
.counter-icon{width:50px;height:50px;border-radius:50%;background:linear-gradient(135deg,var(--blue-50),var(--blue-100));display:flex;align-items:center;justify-content:center;font-size:1.2rem;color:var(--primary);margin-bottom:6px;transition:var(--transition)}
.counter-item:hover .counter-icon{background:linear-gradient(135deg,var(--primary),var(--primary-light));color:#fff;transform:scale(1.1)}
.counter-num{font-size:2.2rem;font-weight:800;color:var(--primary);display:block;line-height:1}
.counter-label{font-size:.82rem;color:var(--text-light);margin-top:4px;font-weight:500}
@media(max-width:600px){.counter-grid{gap:24px}.counter-num{font-size:1.6rem}.counter-icon{width:40px;height:40px;font-size:1rem}}

/* --- Service Cards v2 (with images) --- */
.services-grid-v2{display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:24px}
.service-card-v2{background:var(--white);border-radius:var(--radius-lg);overflow:visible;box-shadow:var(--shadow-sm);border:1px solid rgba(0,0,0,.05);transition:.4s ease; display: flex; flex-direction: column; position: relative;}
.service-card-v2:hover{transform:translateY(-8px);box-shadow:var(--shadow-xl)}
.scv2-img{position:relative;height:220px;overflow:hidden; flex-shrink: 0; border-radius: var(--radius-lg) var(--radius-lg) 0 0;}
.scv2-img img{width:100%;height:100%;object-fit:cover;transition:.5s ease}
.service-card-v2:hover .scv2-img img{transform:scale(1.08)}
.scv2-icon {
    position: absolute;
    top: 188px;
    right: 30px;
    width: 65px;
    height: 65px;
    border-radius: 18px;
    background: var(--primary);
    color: var(--white);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.8rem;
    box-shadow: 0 10px 25px rgba(21, 101, 192, 0.3);
    z-index: 20;
    border: 4px solid var(--white);
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.service-card-v2:hover .scv2-icon {
    transform: translateY(-5px) rotate(5deg) scale(1.05);
    box-shadow: 0 15px 30px rgba(21, 101, 192, 0.4);
    background: var(--accent);
}

.scv2-content {
    padding: 45px 25px 25px; /* مسافة كافية لمنع التداخل */
    flex: 1;
    display: flex;
    flex-direction: column;
}

@media (max-width: 768px) {
    .scv2-icon {
        top: 148px;
        width: 55px;
        height: 55px;
        font-size: 1.5rem;
        right: 20px;
    }
}
.scv2-content h3{color:var(--text);font-size:1.15rem;margin-bottom:10px; font-weight: 700;}
.scv2-content p{color:var(--text-light);font-size:.9rem;line-height:1.7;margin-bottom:15px; flex: 1;}
.scv2-link{color:var(--primary);font-weight:700;font-size:.9rem;display:inline-flex;align-items:center;gap:6px;transition:var(--transition); margin-top: auto;}

@media (max-width: 768px) {
    .services-grid-v2 { grid-template-columns: 1fr; gap: 20px; }
    .scv2-img { height: 180px; }
    .scv2-content { padding: 30px 20px 20px; }
}

/* About experience badge */
.about-exp-badge{position:absolute;bottom:20px;left:20px;background:linear-gradient(135deg,var(--accent),var(--accent-light));color:var(--white);padding:14px 20px;border-radius:var(--radius-md);text-align:center;box-shadow:0 4px 20px rgba(230,81,0,.3)}
.about-exp-badge strong{display:block;font-size:2rem;line-height:1}
.about-exp-badge span{font-size:.75rem;font-weight:500}
.about-img-wrap{position:relative}
.about-features-mini{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:20px}
.afm{display:flex;align-items:center;gap:8px;padding:10px 14px;background:var(--gray-50);border-radius:var(--radius-sm);font-size:.85rem;font-weight:500;color:var(--text-light)}
.afm i{color:var(--accent);font-size:.9rem}



/* --- About Preview --- */
.about-preview{background:var(--white)}
.about-preview-inner{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
.about-img-wrap{position:relative;border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-lg)}
.about-img-wrap::after{content:'';position:absolute;inset:0;border:3px solid var(--accent);border-radius:var(--radius-lg);pointer-events:none;opacity:.3}
.about-img-wrap img{width:100%;height:350px;object-fit:cover}
.about-text h2{color:var(--primary);margin-bottom:16px}
.about-text p{color:var(--text-light);margin-bottom:20px;line-height:1.9}
.about-stats{display:flex;gap:30px;margin-top:30px}
.stat-item{text-align:center}
.stat-number{font-size:2.2rem;font-weight:800;color:var(--accent);display:block}
.stat-label{font-size:.85rem;color:var(--text-light);font-weight:500}
@media(max-width:768px){.about-preview-inner{grid-template-columns:1fr;gap:30px}}

/* --- Services Cards --- */
.services-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:24px}
.service-card{background:var(--white);border-radius:var(--radius-md);padding:36px 28px;text-align:center;box-shadow:var(--shadow-sm);border:1px solid var(--gray-300);transition:var(--transition);position:relative;overflow:hidden}
.service-card::before{content:'';position:absolute;top:0;right:0;left:0;height:4px;background:linear-gradient(90deg,var(--primary),var(--accent));transform:scaleX(0);transition:var(--transition);transform-origin:right}
.service-card:hover{transform:translateY(-8px);box-shadow:var(--shadow-lg);border-color:var(--blue-100)}
.service-card:hover::before{transform:scaleX(1)}
.service-icon{width:70px;height:70px;border-radius:50%;background:linear-gradient(135deg,var(--blue-50),var(--blue-100));display:flex;align-items:center;justify-content:center;margin:0 auto 20px;font-size:1.8rem;color:var(--primary);transition:var(--transition)}
.service-card:hover .service-icon{background:linear-gradient(135deg,var(--primary),var(--primary-light));color:var(--white);transform:scale(1.1)}
.service-card h3{color:var(--primary);margin-bottom:12px}
.service-card p{color:var(--text-light);font-size:.95rem;line-height:1.7;margin-bottom:16px}
.service-card .btn{font-size:.85rem;padding:10px 20px}

/* --- Projects Swiper Slider --- */
.projects-slider-container { 
    width: 100% !important; 
    max-width: 100% !important; 
    position: relative; 
    padding: 20px 0 80px; 
    overflow: hidden; 
    margin: 0 auto !important; 
    display: block !important;
}
.projects-swiper { 
    width: 100% !important; 
    margin: 0 auto !important;
    padding-bottom: 60px !important; 
    position: relative; 
}
.projects-swiper .swiper-wrapper { 
    display: flex !important; 
    flex-direction: row !important; 
    width: 100% !important;
}
.projects-swiper .swiper-slide { 
    height: auto !important; 
    display: flex !important; 
    justify-content: center !important; 
    flex-shrink: 0 !important;
}

.project-showcase-card {
    background: var(--white);
    border-radius: var(--radius-lg);
    overflow: hidden;
    box-shadow: var(--shadow-md);
    transition: var(--admin-transition);
    height: 100%;
    width: 100%;
    max-width: 380px;
    display: flex;
    flex-direction: column;
    border: 1px solid var(--gray-200);
    margin: 0 auto;
}
.project-showcase-card:hover { transform: translateY(-10px); box-shadow: var(--shadow-xl); }

.psc-img { position: relative; height: 240px; overflow: hidden; }
.psc-img img { width: 100%; height: 100%; object-fit: cover; transition: 0.6s ease; }
.project-showcase-card:hover .psc-img img { transform: scale(1.1); }

.psc-overlay {
    position: absolute; inset: 0; background: rgba(13, 71, 161, 0.7);
    display: flex; align-items: center; justify-content: center;
    opacity: 0; transition: 0.4s; z-index: 2;
}
.project-showcase-card:hover .psc-overlay { opacity: 1; }
.psc-view-btn { 
    background: var(--white); color: var(--primary); padding: 12px 24px; 
    border-radius: 50px; font-weight: 700; font-size: 0.9rem;
    transform: translateY(20px); transition: 0.4s;
}
.project-showcase-card:hover .psc-view-btn { transform: translateY(0); }

.psc-featured-badge {
    position: absolute; top: 15px; right: 15px; background: var(--orange-500);
    color: #fff; padding: 6px 14px; border-radius: 50px; font-size: 0.75rem;
    font-weight: 700; z-index: 3; box-shadow: 0 4px 10px rgba(0,0,0,0.2);
}
.psc-content { padding: 25px; flex: 1; display: flex; flex-direction: column; }
.psc-content h3 { font-size: 1.25rem; margin-bottom: 12px; }
.psc-content h3 a { color: var(--text); }
.psc-content h3 a:hover { color: var(--primary); }
.psc-content p { font-size: 0.9rem; color: var(--text-light); line-height: 1.6; margin-bottom: 20px; flex: 1; }

.psc-meta { display: flex; gap: 15px; padding-top: 15px; border-top: 1px solid var(--gray-100); }
.psc-meta span { font-size: 0.8rem; color: var(--text-muted); display: flex; align-items: center; gap: 6px; }
.psc-meta i { color: var(--primary); }

/* Custom Swiper Nav */
.swiper-button-next, .swiper-button-prev {
    width: 50px; height: 50px; background: var(--white);
    border-radius: 50%; color: var(--primary) !important;
    box-shadow: var(--shadow-md); transition: 0.3s;
}
.swiper-button-next:after, .swiper-button-prev:after { font-size: 1.2rem !important; font-weight: 900; }
.swiper-button-next:hover, .swiper-button-prev:hover { background: var(--primary); color: var(--white) !important; }

.swiper-pagination-bullet { width: 12px; height: 12px; background: var(--primary); opacity: 0.3; }
.swiper-pagination-bullet-active { opacity: 1; width: 30px; border-radius: 10px; }

@media (max-width: 768px) {
    .psc-img { height: 200px; }
    .swiper-button-next, .swiper-button-prev { display: none !important; }
}

/* --- Industries --- */
.industries{background:linear-gradient(135deg,var(--blue-900),var(--blue-800))}
.industries .section-header h2{color:var(--white)}
.industries .section-header h2::after{background:linear-gradient(90deg,var(--orange-500),var(--orange-600))}
.industries .section-header p{color:rgba(255,255,255,.7)}
.industries-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:20px}
.industry-card{background:rgba(255,255,255,.08);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.1);border-radius:var(--radius-md);padding:28px 20px;text-align:center;color:var(--white);transition:var(--transition)}
.industry-card:hover{background:rgba(255,255,255,.15);transform:translateY(-4px)}
.industry-card i{font-size:2.2rem;color:var(--orange-500);margin-bottom:14px;display:block}
.industry-card h4{font-size:1rem;font-weight:600}

/* --- Why Choose Us --- */
.why-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:24px}
.why-card{display:flex;gap:16px;padding:24px;background:var(--white);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);border:1px solid var(--gray-300);transition:var(--transition)}
.why-card:hover{box-shadow:var(--shadow-md);transform:translateY(-3px);border-color:var(--blue-100)}
.why-icon{min-width:50px;height:50px;border-radius:var(--radius-sm);background:linear-gradient(135deg,var(--accent),var(--accent-light));display:flex;align-items:center;justify-content:center;color:var(--white);font-size:1.2rem}
.why-card h4{color:var(--primary);margin-bottom:6px}
.why-card p{color:var(--text-light);font-size:.9rem}

/* --- CTA Section --- */
.cta-section{background:linear-gradient(135deg,var(--accent),var(--orange-800));padding:60px 0;text-align:center;position:relative;overflow:hidden}
.cta-section::before{content:'';position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg width='40' height='40' viewBox='0 0 40 40' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23fff' fill-opacity='0.05'%3E%3Cpath d='M20 20h20v20H20zM0 0h20v20H0z'/%3E%3C/g%3E%3C/svg%3E")}
.cta-section h2{color:var(--white);margin-bottom:12px;position:relative;z-index:1}
.cta-section p{color:rgba(255,255,255,.9);margin-bottom:28px;font-size:1.1rem;position:relative;z-index:1}
.cta-buttons{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;position:relative;z-index:1}
.cta-buttons .btn{padding:14px 36px;font-size:1.05rem}

/* --- Page Banner --- */
.page-banner{background:linear-gradient(135deg,var(--blue-900),var(--blue-700));padding:120px 0 60px;text-align:center;position:relative}
.page-banner::after{content:'';position:absolute;bottom:0;left:0;right:0;height:60px;background:linear-gradient(to top,var(--bg),transparent)}
.page-banner h1{color:var(--white);margin-bottom:12px}
.page-banner p{color:rgba(255,255,255,.8)}
.breadcrumb{display:flex;gap:8px;justify-content:center;color:rgba(255,255,255,.6);font-size:.9rem;margin-top:16px}
.breadcrumb a{color:rgba(255,255,255,.8)}
.breadcrumb a:hover{color:var(--orange-500)}

/* --- Contact Form --- */
.contact-form{background:var(--white);border-radius:var(--radius-lg);padding:40px;box-shadow:var(--shadow-md)}
.form-group{margin-bottom:20px}
.form-group label{display:block;margin-bottom:8px;font-weight:600;color:var(--text)}
.form-control{width:100%;padding:14px 16px;border:2px solid var(--gray-300);border-radius:var(--radius-sm);font-size:1rem;transition:var(--transition);background:var(--gray-50)}
.form-control:focus{outline:none;border-color:var(--primary);background:var(--white);box-shadow:0 0 0 4px rgba(21,101,192,.1)}
textarea.form-control{min-height:140px;resize:vertical}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:20px}
@media(max-width:600px){.form-row{grid-template-columns:1fr}}
.form-success{background:var(--blue-50);border:2px solid var(--primary);border-radius:var(--radius-md);padding:20px;text-align:center;color:var(--primary);display:none}
.form-success.show{display:block}
.form-error{background:#FFF3F3;border:2px solid #E53935;border-radius:var(--radius-md);padding:12px;color:#C62828;font-size:.9rem;margin-bottom:16px;display:none}
.form-error.show{display:block}

/* --- Contact Info Cards --- */
.contact-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px;margin-bottom:40px}
.contact-card{background:var(--white);border-radius:var(--radius-md);padding:28px;text-align:center;box-shadow:var(--shadow-sm);border:1px solid var(--gray-300);transition:var(--transition)}
.contact-card:hover{box-shadow:var(--shadow-md);transform:translateY(-3px)}
.contact-card i{font-size:2rem;color:var(--accent);margin-bottom:12px}
.contact-card h4{color:var(--primary);margin-bottom:8px}
.contact-card a,.contact-card span{color:var(--text-light);display:block;margin-top:4px}
.contact-card a:hover{color:var(--accent)}

/* --- Map --- */
.map-wrap{border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-md);margin-top:40px}
.map-wrap iframe{width:100%;height:400px;border:0}

/* --- Project Tab Contents --- */
.project-tab-content { display: none; width: 100%; }
.project-tab-content.active { display: block; animation: fadeInSlide 0.5s ease forwards; }

@keyframes fadeInSlide {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
}

.filter-tabs { display: flex; justify-content: center; gap: 12px; margin-bottom: 40px; flex-wrap: wrap; }
.filter-tab { 
    padding: 12px 25px; border-radius: 50px; background: var(--white); 
    border: 1px solid var(--gray-200); color: var(--text-light); font-weight: 700; 
    transition: 0.3s; cursor: pointer; display: flex; align-items: center; gap: 10px;
}
.filter-tab i { font-size: 0.9rem; color: var(--primary); }
.filter-tab:hover { border-color: var(--primary); color: var(--primary); }
.filter-tab.active { background: var(--primary); color: var(--white); border-color: var(--primary); }
.filter-tab.active i { color: var(--white); }

/* --- FAQ Accordion --- */
.faq-item { background: var(--white); border-radius: 12px; border: 1px solid var(--gray-200); margin-bottom: 15px; overflow: hidden; transition: 0.3s; }
.faq-item.open { border-color: var(--primary); box-shadow: var(--shadow-md); }
.faq-question { padding: 20px 25px; display: flex; justify-content: space-between; align-items: center; cursor: pointer; font-weight: 700; color: var(--primary); transition: 0.3s; }
.faq-item.open .faq-question { background: var(--blue-50); }
.faq-question i { font-size: 0.8rem; transition: 0.3s; }
.faq-item.open .faq-question i { transform: rotate(180deg); }
.faq-answer { padding: 0 25px; max-height: 0; overflow: hidden; transition: 0.3s ease-out; color: var(--text-light); line-height: 1.8; }
.faq-item.open .faq-answer { padding: 15px 25px 20px; max-height: 500px; border-top: 1px solid var(--gray-100); }

/* --- Why Choose Us & Industries --- */
.why-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 24px; }
.why-card { background: var(--white); padding: 30px; border-radius: var(--radius-lg); border: 1px solid var(--gray-200); display: flex; gap: 20px; transition: 0.3s; width: 100%; }
.why-card:hover { transform: translateY(-5px); border-color: var(--primary); box-shadow: var(--shadow-md); }
.why-icon { width: 60px; height: 60px; border-radius: 15px; background: var(--blue-50); color: var(--primary); display: flex; align-items: center; justify-content: center; font-size: 1.5rem; flex-shrink: 0; }

.industries-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 20px; }
.industry-card { background: var(--white); padding: 30px 20px; border-radius: var(--radius-md); border: 1px solid var(--gray-200); text-align: center; transition: 0.3s; }
.industry-card:hover { border-color: var(--primary); transform: scale(1.05); box-shadow: var(--shadow-sm); }
.industry-card i { font-size: 2.5rem; color: var(--primary); margin-bottom: 15px; display: block; }
.industry-card h4 { font-size: 1rem; color: var(--text); font-weight: 700; }

@media (max-width: 768px) {
    .why-card { flex-direction: column; text-align: center; align-items: center; padding: 25px 20px; }
    .industries-grid { grid-template-columns: repeat(2, 1fr); gap: 15px; }
    .industry-card { padding: 20px 15px; }
    .industry-card i { font-size: 2rem; }
    .industry-card h4 { font-size: 0.9rem; }
    
    .project-showcase-card { max-width: 100%; }
    .psc-content { padding: 20px; }
    .psc-content h3 { font-size: 1.15rem; }
}

@media (max-width: 480px) {
    .industries-grid { grid-template-columns: 1fr; }
    .counter-grid { grid-template-columns: 1fr 1fr; gap: 10px; width: 100%; margin: 0; }
    .counter-num { font-size: 1.4rem; }
    .counter-item { min-width: auto; padding: 5px; }
}

/* --- Project Details Premium Layout --- */
.project-details-layout { display: grid; grid-template-columns: 2fr 1fr; gap: 40px; }

.project-card-premium { 
    background: var(--white); border-radius: 20px; box-shadow: var(--shadow-md); 
    overflow: hidden; border: 1px solid var(--gray-200); 
}
.pcp-header { 
    background: #F8FBFF; padding: 20px 30px; border-bottom: 1px solid #E3F2FD; 
    display: flex; align-items: center; gap: 15px; 
}
.pcp-header i { font-size: 1.5rem; color: var(--primary); }
.pcp-header h3 { font-size: 1.25rem; color: var(--blue-900); font-weight: 800; margin: 0; }
.pcp-body { padding: 30px; }

.project-full-text { font-size: 1.05rem; line-height: 1.9; color: var(--text); white-space: pre-line; }

.specs-grid-v2 { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 15px; }
.spec-item-v2 { 
    display: flex; align-items: center; gap: 12px; padding: 12px 18px; 
    background: #F9FAFB; border-radius: 12px; border: 1px solid #F0F2F5; 
}
.spec-item-v2 i { color: var(--admin-success); font-size: 1.1rem; }
.spec-item-v2 span { font-weight: 600; color: var(--text); font-size: 0.95rem; }

.sidebar-info-card { 
    background: var(--white); border-radius: 20px; box-shadow: var(--shadow-md); 
    padding: 30px; border: 1px solid var(--gray-200); 
}
.sic-item { display: flex; align-items: center; gap: 20px; margin-bottom: 25px; }
.sic-item:last-child { margin-bottom: 0; }
.sic-icon { 
    width: 55px; height: 55px; border-radius: 15px; display: flex; 
    align-items: center; justify-content: center; font-size: 1.4rem; 
}
.sic-icon.blue { background: #E3F2FD; color: #1565C0; }
.sic-icon.orange { background: #FFF3E0; color: #E65100; }
.sic-icon.green { background: #E8F5E9; color: #2E7D32; }
.sic-icon.purple { background: #F3E5F5; color: #7B1FA2; }

.sic-text { display: flex; flex-direction: column; }
.sic-label { font-size: 0.8rem; color: var(--text-muted); font-weight: 600; margin-bottom: 4px; }
.sic-value { font-size: 1rem; color: var(--blue-900); font-weight: 800; }

.sidebar-cta-card { 
    margin-top: 30px; background: linear-gradient(135deg, var(--blue-900), var(--blue-800)); 
    border-radius: 20px; padding: 40px 30px; text-align: center; color: #fff; 
}
.scc-icon { 
    width: 70px; height: 70px; background: rgba(255,255,255,0.1); 
    border-radius: 50%; display: flex; align-items: center; justify-content: center; 
    font-size: 2rem; margin: 0 auto 20px; color: var(--orange-500); 
}
.sidebar-cta-card h3 { font-size: 1.4rem; margin-bottom: 15px; color: #fff; }
.sidebar-cta-card p { font-size: 0.95rem; color: rgba(255,255,255,0.8); margin-bottom: 25px; line-height: 1.6; }
.scc-buttons { display: flex; flex-direction: column; gap: 12px; }
.scc-btn { 
    display: flex; align-items: center; justify-content: center; gap: 10px; 
    padding: 14px; border-radius: 50px; font-weight: 700; transition: 0.3s; 
}
.scc-btn.wa { background: #25D366; color: #fff; }
.scc-btn.ph { background: var(--orange-500); color: #fff; }
.scc-btn:hover { transform: translateY(-3px); box-shadow: 0 5px 15px rgba(0,0,0,0.2); }

.project-gallery-v4 { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 20px; }
.pg-item { 
    position: relative; height: 250px; border-radius: 15px; overflow: hidden; 
    cursor: pointer; box-shadow: var(--shadow-sm); 
}
.pg-item img { width: 100%; height: 100%; object-fit: cover; transition: 0.5s; }
.pg-overlay { 
    position: absolute; inset: 0; background: rgba(21, 101, 192, 0.6); 
    display: flex; align-items: center; justify-content: center; 
    font-size: 2rem; color: #fff; opacity: 0; transition: 0.3s; 
}
.pg-item:hover img { transform: scale(1.1); }
.pg-item:hover .pg-overlay { opacity: 1; }

@media (max-width: 991px) {
    .project-details-layout { grid-template-columns: 1fr; }
    .project-sidebar-column { order: -1; }
}

/* --- Projects Gallery --- */
.projects-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:24px}
.project-card{border-radius:var(--radius-md);overflow:hidden;background:var(--white);box-shadow:var(--shadow-sm);border:1px solid var(--gray-300);transition:var(--transition)}
.project-card:hover{box-shadow:var(--shadow-lg);transform:translateY(-5px)}
.project-img{position:relative;height:220px;overflow:hidden}
.project-img img{width:100%;height:100%;object-fit:cover;transition:var(--transition)}
.project-card:hover .project-img img{transform:scale(1.05)}
.project-info{padding:20px}
.project-info h3{color:var(--primary);margin-bottom:8px;font-size:1.1rem}
.project-info p{color:var(--text-light);font-size:.9rem}
.project-meta{display:flex;gap:16px;margin-top:12px;font-size:.8rem;color:var(--gray-500)}
.project-badge{position:absolute;top:12px;right:12px;background:var(--accent);color:var(--white);padding:4px 12px;border-radius:var(--radius-sm);font-size:.8rem;font-weight:600}
.projects-empty{text-align:center;padding:80px 20px;color:var(--text-light)}
.projects-empty i{font-size:4rem;color:var(--gray-300);margin-bottom:16px}
.filter-bar{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-bottom:30px}
.filter-btn{padding:8px 20px;border:2px solid var(--gray-300);border-radius:50px;font-weight:600;color:var(--text-light);background:var(--white);cursor:pointer;transition:var(--transition)}
.filter-btn.active,.filter-btn:hover{border-color:var(--primary);background:var(--primary);color:var(--white)}

/* --- Features List --- */
.features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;margin:30px 0}
.feature-item{display:flex;gap:14px;align-items:flex-start;padding:20px;background:var(--white);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);border:1px solid var(--gray-300);transition:var(--transition)}
.feature-item:hover{box-shadow:var(--shadow-md);border-color:var(--blue-100)}
.feature-item i{color:var(--accent);font-size:1.3rem;margin-top:4px;min-width:24px}
.feature-item h4{color:var(--primary);margin-bottom:4px;font-size:1rem}
.feature-item p{color:var(--text-light);font-size:.9rem}

/* --- Service Detail --- */
.service-detail{background:var(--white)}
.service-detail-inner{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:start}
.service-detail-text h2{color:var(--primary);margin-bottom:16px}
.service-detail-text p{color:var(--text-light);line-height:1.9;margin-bottom:16px}
.service-detail-img{border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-lg)}
.service-detail-img img{width:100%;height:auto;object-fit:cover}
@media(max-width:768px){.service-detail-inner{grid-template-columns:1fr}}

/* Types list */
.types-list{list-style:none;margin:20px 0}
.types-list li{padding:12px 16px;border-right:4px solid var(--accent);margin-bottom:10px;background:var(--gray-50);border-radius:0 var(--radius-sm) var(--radius-sm) 0;font-weight:500;transition:var(--transition)}
.types-list li:hover{background:var(--blue-50);border-right-color:var(--primary)}

/* Components list */
.components-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin:20px 0}
.component-item{background:var(--blue-50);padding:20px;border-radius:var(--radius-md);text-align:center;transition:var(--transition)}
.component-item:hover{background:var(--blue-100);transform:translateY(-2px)}
.component-item i{font-size:2rem;color:var(--primary);margin-bottom:10px;display:block}
.component-item span{font-weight:600;color:var(--text)}

/* Gallery */
.gallery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px;margin:30px 0}
.gallery-item{border-radius:var(--radius-md);overflow:hidden;height:200px;cursor:pointer;position:relative}
.gallery-item img{width:100%;height:100%;object-fit:cover;transition:var(--transition)}
.gallery-item:hover img{transform:scale(1.1)}
.gallery-item::after{content:'\f065';font-family:'Font Awesome 6 Free';font-weight:900;position:absolute;inset:0;background:rgba(21,101,192,.4);color:var(--white);display:flex;align-items:center;justify-content:center;font-size:1.5rem;opacity:0;transition:var(--transition)}
.gallery-item:hover::after{opacity:1}

/* Vision / Mission */
.vm-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px;margin:40px 0}
.vm-card{padding:36px;border-radius:var(--radius-lg);position:relative;overflow:hidden}
.vm-card.vision{background:linear-gradient(135deg,var(--blue-50),var(--white));border:2px solid var(--blue-100)}
.vm-card.mission{background:linear-gradient(135deg,var(--orange-100),var(--white));border:2px solid var(--orange-100)}
.vm-card i{font-size:2.5rem;margin-bottom:16px}
.vm-card.vision i{color:var(--primary)}
.vm-card.mission i{color:var(--accent)}
.vm-card h3{margin-bottom:12px}
.vm-card.vision h3{color:var(--primary)}
.vm-card.mission h3{color:var(--accent)}
.vm-card p{color:var(--text-light);line-height:1.9}
@media(max-width:768px){.vm-grid{grid-template-columns:1fr}}

/* --- Footer --- */
.footer{background:var(--gray-900);color:rgba(255,255,255,.85)}
.footer-top{padding:60px 0 40px}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1.5fr;gap:40px}
.footer-logo{height:60px;width:auto;border-radius:8px;margin-bottom:16px}
.footer-desc{font-size:.9rem;line-height:1.8;color:rgba(255,255,255,.6);margin-bottom:20px;display:-webkit-box;-webkit-line-clamp:3;line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.footer-social{display:flex;gap:10px}
.footer-social a{width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.1);display:flex;align-items:center;justify-content:center;color:var(--white);transition:var(--transition)}
.footer-social a:hover{background:var(--accent);transform:translateY(-2px)}
.footer-title{color:var(--white);font-size:1.1rem;margin-bottom:20px;position:relative;padding-bottom:12px}
.footer-title::after{content:'';position:absolute;bottom:0;right:0;width:40px;height:3px;background:var(--accent);border-radius:2px}
.footer-links li{margin-bottom:10px}
.footer-links a{color:rgba(255,255,255,.6);transition:var(--transition);font-size:.9rem;display:flex;align-items:center;gap:6px}
.footer-links a:hover{color:var(--orange-500);padding-right:4px}
.footer-links i{font-size:.6rem;color:var(--orange-500)}
.footer-contact-list li{display:flex;gap:12px;margin-bottom:14px;align-items:flex-start}
.footer-contact-list i{color:var(--orange-500);margin-top:4px;min-width:16px}
.footer-contact-list a,.footer-contact-list span{color:rgba(255,255,255,.6);font-size:.9rem;display:block}
.footer-contact-list a:hover{color:var(--orange-500)}
.footer-bottom{border-top:1px solid rgba(255,255,255,.1);padding:20px 0}
.footer-bottom-inner{display:flex;justify-content:space-between;align-items:center;font-size:.85rem;color:rgba(255,255,255,.5)}
.footer-bottom a{color:var(--orange-500)}
@media(max-width:991px){.footer-grid{grid-template-columns:1fr 1fr;gap:30px}}
@media(max-width:600px){.footer-grid{grid-template-columns:1fr}.footer-bottom-inner{flex-direction:column;gap:8px;text-align:center}}

/* --- Floating Buttons --- */
.whatsapp-float{position:fixed;bottom:24px;left:24px;width:60px;height:60px;border-radius:50%;background:linear-gradient(135deg,#25D366,#128C7E);color:var(--white);display:flex;align-items:center;justify-content:center;font-size:1.8rem;box-shadow:0 4px 20px rgba(37,211,102,.4);z-index:999;transition:var(--transition);animation:pulse-green 2s infinite}
.whatsapp-float:hover{transform:scale(1.1);box-shadow:0 6px 30px rgba(37,211,102,.5)}
.whatsapp-tooltip{position:absolute;right:70px;background:var(--white);color:var(--text);padding:8px 16px;border-radius:var(--radius-sm);box-shadow:var(--shadow-md);font-size:.85rem;white-space:nowrap;opacity:0;visibility:hidden;transition:var(--transition)}
.whatsapp-float:hover .whatsapp-tooltip{opacity:1;visibility:visible}
.call-float{position:fixed;bottom:96px;left:24px;width:50px;height:50px;border-radius:50%;background:linear-gradient(135deg,var(--accent),var(--accent-light));color:var(--white);display:flex;align-items:center;justify-content:center;font-size:1.3rem;box-shadow:0 4px 15px rgba(230,81,0,.3);z-index:999;transition:var(--transition)}
.call-float:hover{transform:scale(1.1)}

/* --- Animations --- */
@keyframes pulse-green{0%,100%{box-shadow:0 4px 20px rgba(37,211,102,.4)}50%{box-shadow:0 4px 30px rgba(37,211,102,.6)}}
@keyframes fadeInUp{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}
@keyframes fadeInRight{from{opacity:0;transform:translateX(30px)}to{opacity:1;transform:translateX(0)}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes countUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
.animate-on-scroll{opacity:0;transform:translateY(30px);transition:.6s ease}
.animate-on-scroll.visible{opacity:1;transform:translateY(0)}
.animate-delay-1{transition-delay:.1s}
.animate-delay-2{transition-delay:.2s}
.animate-delay-3{transition-delay:.3s}
.animate-delay-4{transition-delay:.4s}

/* --- Related Projects V4 --- */
.related-projects-grid-v4 { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 30px; }
.rp-card-v4 { 
    background: var(--white); border-radius: 15px; overflow: hidden; 
    box-shadow: var(--shadow-sm); border: 1px solid var(--gray-200); 
    transition: 0.3s; 
}
.rp-card-v4:hover { transform: translateY(-5px); box-shadow: var(--shadow-md); }
.rp-card-img { position: relative; height: 200px; overflow: hidden; }
.rp-card-img img { width: 100%; height: 100%; object-fit: cover; transition: 0.5s; }
.rp-card-overlay { 
    position: absolute; inset: 0; background: rgba(13, 71, 161, 0.7); 
    display: flex; align-items: center; justify-content: center; 
    opacity: 0; transition: 0.3s; 
}
.rp-card-v4:hover .rp-card-overlay { opacity: 1; }
.rp-card-btn { 
    background: #fff; color: var(--primary); padding: 8px 20px; 
    border-radius: 50px; font-weight: 700; font-size: 0.85rem; 
}
.rp-card-body { padding: 20px; }
.rp-card-cat { font-size: 0.7rem; color: var(--primary); font-weight: 700; text-transform: uppercase; margin-bottom: 8px; display: block; }
.rp-card-body h3 { font-size: 1.1rem; margin-bottom: 12px; }
.rp-card-body h3 a { color: var(--blue-900); }
.rp-card-meta { display: flex; gap: 15px; }
.rp-card-meta span { font-size: 0.8rem; color: var(--text-muted); display: flex; align-items: center; gap: 5px; }
.rp-card-meta i { color: var(--primary); }

/* --- Lightbox --- */
.lightbox{position:fixed;inset:0;background:rgba(0,0,0,.9);z-index:9999;display:none;align-items:center;justify-content:center;padding:20px}
.lightbox.active{display:flex}
.lightbox img{max-width:90%;max-height:90vh;border-radius:var(--radius-md)}
.lightbox-close{position:absolute;top:20px;left:20px;width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,.2);color:var(--white);display:flex;align-items:center;justify-content:center;font-size:1.4rem;cursor:pointer;transition:var(--transition)}
.lightbox-close:hover{background:rgba(255,255,255,.3)}

/* --- Misc --- */
.text-center{text-align:center}
.mt-20{margin-top:20px}
.mt-40{margin-top:40px}
.mb-20{margin-bottom:20px}
.mb-40{margin-bottom:40px}

/* === PREMIUM PROJECT SHOWCASE === */
.projects-stats-strip{background:var(--white);padding:30px 0;border-bottom:1px solid var(--gray-300)}
.pstats-grid{display:flex;justify-content:center;gap:50px;flex-wrap:wrap}
.pstat-item{text-align:center;display:flex;flex-direction:column;align-items:center;gap:6px}
.pstat-item i{font-size:1.6rem;color:var(--accent)}
.pstat-num{font-size:2rem;font-weight:800;color:var(--primary)}
.pstat-label{font-size:.8rem;color:var(--text-light);font-weight:500}

.filter-tabs{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-bottom:36px}
.filter-tab{padding:10px 24px;border:2px solid var(--gray-300);border-radius:50px;font-weight:600;color:var(--text-light);background:var(--white);cursor:pointer;transition:var(--transition);font-family:inherit;font-size:.9rem;display:flex;align-items:center;gap:6px}
.filter-tab.active,.filter-tab:hover{border-color:var(--primary);background:var(--primary);color:var(--white);box-shadow:0 4px 15px rgba(21,101,192,.2)}

.projects-showcase{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:28px}
.project-showcase-card{background:var(--white);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-sm);border:1px solid rgba(0,0,0,.06);transition:.4s ease;position:relative}
.project-showcase-card:hover{transform:translateY(-8px);box-shadow:var(--shadow-xl)}
.project-showcase-card.featured{border-color:var(--orange-100)}
.psc-img{position:relative;height:240px;overflow:hidden}
.psc-img img{width:100%;height:100%;object-fit:cover;transition:.5s ease}
.project-showcase-card:hover .psc-img img{transform:scale(1.08)}
.psc-placeholder{height:100%;background:linear-gradient(135deg,var(--blue-50),var(--blue-100));display:flex;align-items:center;justify-content:center;font-size:3rem;color:var(--blue-500)}
.psc-overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(13,71,161,.8),transparent 60%);display:flex;align-items:flex-end;justify-content:center;padding:20px;opacity:0;transition:var(--transition)}
.project-showcase-card:hover .psc-overlay{opacity:1}
.psc-view-btn{background:var(--white);color:var(--primary);padding:10px 24px;border-radius:50px;font-weight:600;font-size:.85rem;display:flex;align-items:center;gap:6px;transform:translateY(10px);transition:var(--transition)}
.project-showcase-card:hover .psc-view-btn{transform:translateY(0)}
.psc-featured-badge{position:absolute;top:14px;right:14px;background:linear-gradient(135deg,var(--orange-600),var(--orange-500));color:var(--white);padding:5px 14px;border-radius:50px;font-size:.75rem;font-weight:700;display:flex;align-items:center;gap:4px;box-shadow:0 2px 10px rgba(230,81,0,.3)}
.psc-content{padding:22px 24px}
.psc-content h3{font-size:1.1rem;margin-bottom:8px}
.psc-content h3 a{color:var(--text);transition:var(--transition)}
.psc-content h3 a:hover{color:var(--primary)}
.psc-content p{color:var(--text-light);font-size:.88rem;line-height:1.7;margin-bottom:12px}
.psc-meta{display:flex;gap:14px;flex-wrap:wrap;font-size:.78rem;color:var(--gray-500)}
.psc-meta span{display:flex;align-items:center;gap:4px}
.psc-meta i{color:var(--accent);font-size:.7rem}
.psc-link{color:var(--primary);font-weight:600;font-size:.85rem;display:inline-flex;align-items:center;gap:6px;margin-top:10px;transition:var(--transition)}
.psc-link:hover{gap:10px;color:var(--accent)}
@media(max-width:768px){.projects-showcase{grid-template-columns:1fr}}

/* Empty state */
.projects-empty-state{text-align:center;padding:60px 20px;background:var(--white);border-radius:var(--radius-xl);box-shadow:var(--shadow-md)}
.pes-icon{width:100px;height:100px;border-radius:50%;background:linear-gradient(135deg,var(--blue-50),var(--blue-100));display:flex;align-items:center;justify-content:center;margin:0 auto 20px;font-size:2.5rem;color:var(--primary)}
.projects-empty-state h3{color:var(--primary);margin-bottom:12px;font-size:1.4rem}
.projects-empty-state p{color:var(--text-light);max-width:550px;margin:0 auto 24px;line-height:1.8}
.pes-features{display:flex;justify-content:center;gap:16px;flex-wrap:wrap;margin-bottom:8px}
.pes-feat{background:var(--gray-50);border:1px solid var(--gray-300);padding:10px 18px;border-radius:50px;display:flex;align-items:center;gap:8px;font-size:.85rem;font-weight:500;color:var(--text-light)}
.pes-feat i{color:var(--accent)}

/* === PROJECT DETAIL PAGE v3 (Premium Immersive) === */
.project-hero-v3{position:relative;min-height:500px;overflow:hidden}
.project-hero-bg{position:absolute;inset:0;background-size:cover;background-position:center;filter:blur(2px);transform:scale(1.05)}
.project-hero-bg::after{content:'';position:absolute;inset:0;background:linear-gradient(to bottom,rgba(13,71,161,.85) 0%,rgba(26,26,46,.95) 100%)}
.project-hero-v3 .container{position:relative;z-index:2;padding-top:110px;padding-bottom:60px}
.project-hero-v3 .breadcrumb{margin-bottom:24px}
.project-hero-v3 .breadcrumb a,.project-hero-v3 .breadcrumb span{color:rgba(255,255,255,.6)}
.project-hero-v3 .breadcrumb a:hover{color:var(--orange-500)}
.project-hero-title{color:#fff;font-size:clamp(1.6rem,4vw,2.6rem);margin-bottom:16px;line-height:1.4;max-width:700px}
.project-hero-cat{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.12);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.15);padding:8px 18px;border-radius:50px;color:var(--orange-500);font-size:.82rem;font-weight:600;margin-bottom:18px}
.project-hero-desc{color:rgba(255,255,255,.8);font-size:1.1rem;line-height:1.9;max-width:650px;margin-bottom:30px}

/* Floating Info Cards */
.project-info-strip{position:relative;z-index:5;margin-top:-50px;margin-bottom:50px}
.project-info-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.pi-card{background:var(--white);border-radius:var(--radius-md);padding:22px 20px;display:flex;align-items:center;gap:14px;box-shadow:var(--shadow-lg);border:1px solid rgba(0,0,0,.04);transition:var(--transition)}
.pi-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-xl)}
.pi-card-icon{width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:1.1rem;flex-shrink:0}
.pi-card-icon.blue{background:linear-gradient(135deg,var(--blue-50),var(--blue-100));color:var(--primary)}
.pi-card-icon.orange{background:linear-gradient(135deg,var(--orange-100),#FFE0B2);color:var(--accent)}
.pi-card-icon.green{background:linear-gradient(135deg,#E8F5E9,#C8E6C9);color:#2E7D32}
.pi-card-icon.purple{background:linear-gradient(135deg,#F3E5F5,#E1BEE7);color:#7B1FA2}
.pi-card-label{font-size:.75rem;color:var(--gray-500);display:block;margin-bottom:2px}
.pi-card-value{font-weight:700;color:var(--text);font-size:1rem}
@media(max-width:768px){.project-info-grid{grid-template-columns:1fr 1fr}.project-hero-v3{min-height:400px}}
@media(max-width:480px){.project-info-grid{grid-template-columns:1fr}}

/* Project Content Section */
.project-content-wrap{display:grid;grid-template-columns:1fr 340px;gap:40px;align-items:start}
.project-main-content{background:var(--white);border-radius:var(--radius-lg);padding:40px;box-shadow:var(--shadow-sm);border:1px solid var(--gray-300)}
.project-main-content p{color:var(--text-light);line-height:2;font-size:1.05rem;margin-bottom:16px}
.project-sidebar{position:sticky;top:100px}
.project-sidebar-card{background:var(--white);border-radius:var(--radius-lg);padding:28px;box-shadow:var(--shadow-sm);border:1px solid var(--gray-300);margin-bottom:20px}
.project-sidebar-card h4{color:var(--primary);font-size:1.1rem;margin-bottom:16px;display:flex;align-items:center;gap:8px}
.project-sidebar-card h4 i{color:var(--accent)}
@media(max-width:991px){.project-content-wrap{grid-template-columns:1fr}.project-sidebar{position:static}}

/* Features Timeline */
.features-timeline{display:flex;flex-direction:column;gap:0}
.ft-item{display:flex;gap:16px;padding:16px 0;position:relative}
.ft-item:not(:last-child){border-bottom:1px solid var(--gray-100)}
.ft-dot{width:32px;height:32px;border-radius:50%;background:linear-gradient(135deg,var(--primary),var(--primary-light));color:#fff;display:flex;align-items:center;justify-content:center;font-size:.7rem;flex-shrink:0;font-weight:700}
.ft-text{font-weight:600;color:var(--text);font-size:.95rem;line-height:1.6}

/* Gallery Masonry */
.gallery-grid-v3{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px}
.gallery-item-v3{position:relative;border-radius:var(--radius-md);overflow:hidden;cursor:pointer;height:260px;box-shadow:var(--shadow-sm)}
.gallery-item-v3 img{width:100%;height:100%;object-fit:cover;transition:.5s ease}
.gallery-item-v3:hover img{transform:scale(1.08)}
.gallery-item-v3::after{content:'\f00e';font-family:'Font Awesome 6 Free';font-weight:900;position:absolute;inset:0;background:rgba(13,71,161,.5);color:#fff;display:flex;align-items:center;justify-content:center;font-size:2rem;opacity:0;transition:var(--transition)}
.gallery-item-v3:hover::after{opacity:1}

/* Related Projects v3 */
.related-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:24px}
.related-card{background:var(--white);border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-sm);border:1px solid rgba(0,0,0,.05);transition:.4s ease}
.related-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-xl)}
.related-card-img{height:200px;overflow:hidden;position:relative}
.related-card-img img{width:100%;height:100%;object-fit:cover;transition:.5s ease}
.related-card:hover .related-card-img img{transform:scale(1.06)}
.related-card-body{padding:20px}
.related-card-body h3{font-size:1.05rem;margin-bottom:8px}
.related-card-body h3 a{color:var(--text);transition:var(--transition)}
.related-card-body h3 a:hover{color:var(--primary)}
.related-card-meta{display:flex;gap:14px;font-size:.8rem;color:var(--gray-500)}
.related-card-meta i{color:var(--accent);margin-left:4px}