:root {
     --primary-purple: #8C0D6D;
     --accent-orange: #FF9800;
     --dark-bg: #1a1a1a;
     --light-bg: #f8f9fa;
     --gradient-top: linear-gradient(90deg, #6A1B9A 0%, #8C0D6D 100%);

 }

 body {
     font-family: 'Segoe UI', Roboto, sans-serif;
     overflow-x: hidden;
     scroll-behavior: smooth;
 }

 html,
 body {
     overflow-x: hidden;
     overflow-y: visible !important;
     width: 100%;
 }

 /* --- Topbar Styling --- */
 .topbar {
     background: var(--gradient-top);
     color: white;
     padding: 8px 0;
     font-size: 14px;
     transition: all 0.3s ease;
 }

 .topbar a {
     color: white;
     text-decoration: none;
     margin-left: 20px;
     transition: 0.3s;
 }

 .topbar a:hover {
     color: var(--accent-orange);
 }

 /* Hide Topbar on Scroll */
 .topbar.hide {
     margin-top: -40px;
 }

 /* --- Navbar Styling --- */
 .navbar {
     background-color: white;
     box-shadow: 0 2px 15px rgba(0, 0, 0, 0.1);
     transition: all 0.3s ease;
     z-index: 1030;
 }

 .navbar-brand span.v {
     color: var(--primary-purple);
     font-weight: 800;
 }

 .navbar-brand span.s {
     color: var(--accent-orange);
     font-weight: 800;
 }

 .nav-link {
     font-weight: 600;
     color: var(--primary-purple) !important;
     margin: 0 10px;
     position: relative;
 }

 .nav-link:hover {
     color: var(--accent-orange) !important;
 }

 /* --- Mobile Sidebar (Offcanvas) --- */
 .offcanvas {
     width: 280px !important;
     background: var(--light-bg);
 }

 .offcanvas-header {
     background: var(--gradient-top);
     color: white;
 }

 .sidebar-logo {
     font-size: 1.2rem;
     font-weight: 800;
 }

 .sidebar-contact {
     margin-top: auto;
     padding: 20px;
     background: #eee;
     border-radius: 10px;
 }

 /* --- Hero Slider --- */
 .carousel-item {
     height: 85vh;
     min-height: 500px;
     background-size: cover;
     background-position: center;
 }

 .carousel-caption {
     bottom: 25%;
     text-align: left;
     z-index: 10;
 }

 .carousel-caption h1 {
     font-size: 4.5rem;
     font-weight: 800;
     text-shadow: 2px 2px 10px rgba(0, 0, 0, 0.5);
 }

 .carousel-caption h1 span {
     color: var(--accent-orange);
 }

 .carousel-overlay {
     position: absolute;
     width: 100%;
     height: 100%;
     background: rgba(0, 0, 0, 0.5);
 }

 /* --- Common UI Components --- */
 .btn-custom {
     background: var(--accent-orange);
     color: white;
     padding: 12px 35px;
     border-radius: 50px;
     font-weight: bold;
     border: none;
     transition: 0.4s;
 }

 .btn-custom:hover {
     background: #e68900;
     transform: translateY(-3px);
     box-shadow: 0 8px 20px rgba(255, 152, 0, 0.4);
     color: white;
 }

 /* Section Title Styling */
 .section-title {
     text-align: center;
     margin-bottom: 60px;
 }

 .section-title h2 {
     color: var(--primary-purple);
     font-weight: 800;
     position: relative;
     padding-bottom: 15px;
 }

 .section-title h2::after {
     content: '';
     position: absolute;
     width: 80px;
     height: 5px;
     background: var(--accent-orange);
     bottom: 0;
     left: 50%;
     transform: translateX(-50%);
     border-radius: 5px;
 }

 .text-purple {
     color: var(--primary-purple) !important;
 }

 .text-orange {
     color: var(--accent-orange) !important;
 }

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

     .carousel-caption h1 {
         font-size: 2.8rem;
     }

     .carousel-item {
         height: 70vh;
     }
 }

 /* --- NEW: Panel Highlight Section --- */
 /* ===== POWER HIGHLIGHTS (HERO CONNECTOR) ===== */
 /* ===== COMPACT PREMIUM HIGHLIGHTS ===== */

 .compact-highlights {
     background: linear-gradient(135deg, #f6f1fa, #ffffff);
     padding: 50px 0 45px;
 }

 /* Card */
 .compact-card {
     background: #ffffff;
     padding: 28px 22px;
     border-radius: 14px;
     text-align: center;
     height: 100%;
     border: 1px solid rgba(140, 13, 109, 0.08);
     transition: 0.35s ease;
     box-shadow: 0 8px 22px rgba(0, 0, 0, 0.08);
 }

 /* Middle card subtle highlight */
 .compact-card.active {
     border-color: rgba(255, 152, 0, 0.4);
     box-shadow: 0 12px 28px rgba(255, 152, 0, 0.25);
 }

 /* Hover */
 .compact-card:hover {
     transform: translateY(-6px);
 }

 /* Icon (small & premium) */
 .compact-icon {
     width: 56px;
     height: 56px;
     margin: 0 auto 14px;
     border-radius: 50%;
     border: 2px solid var(--accent-orange);
     display: flex;
     align-items: center;
     justify-content: center;
     background: #fff;
 }

 .compact-icon i {
     font-size: 24px;
     color: var(--primary-purple);
 }

 /* Text */
 .compact-card h6 {
     font-weight: 800;
     color: var(--primary-purple);
     margin-bottom: 8px;
     font-size: 16px;
 }

 .compact-card p {
     font-size: 14px;
     color: #666;
     line-height: 1.55;
     margin-bottom: 0;
 }

 /* Mobile */
 @media (max-width: 768px) {
     .compact-highlights {
         padding: 40px 0;
     }
 }

 /* --- NEW: Premium About Us --- */
 .about-section {
     padding: 100px 0;
     background: linear-gradient(to right, #ffffff, #f3e5f5);
 }

 .about-img-wrapper {
     position: relative;
     padding: 20px;
 }

 .about-img-main {
     border-radius: 20px;
     box-shadow: 20px 20px 0px var(--primary-purple);
     width: 100%;
     transition: 0.5s;
 }

 .about-img-wrapper:hover .about-img-main {
     box-shadow: 25px 25px 0px var(--accent-orange);
     transform: scale(1.02);
 }

 .about-badge {
     position: absolute;
     bottom: -10px;
     right: -10px;
     background: var(--accent-orange);
     color: white;
     padding: 20px;
     border-radius: 15px;
     font-weight: 800;
     box-shadow: 0 10px 20px rgba(255, 152, 0, 0.3);
 }

 .about-content h2 {
     font-size: 2.8rem;
     font-weight: 800;
     color: var(--primary-purple);
     margin-bottom: 20px;
 }

 .about-content h6 {
     color: var(--accent-orange);
     text-transform: uppercase;
     letter-spacing: 2px;
     font-weight: 700;
 }

 .about-feature-list {
     display: grid;
     grid-template-columns: 1fr 1fr;
     gap: 15px;
     margin-top: 30px;
 }

 .about-feature-item {
     display: flex;
     align-items: center;
     font-weight: 600;
     color: var(--dark-bg);
 }

 .about-feature-item i {
     color: var(--accent-orange);
     margin-right: 10px;
 }

 .floating-badge {


     animation: floatBadge 3.5s ease-in-out infinite;
 }

 /* Smooth up-down movement */
 @keyframes floatBadge {
     0% {
         transform: translateY(0);
     }

     50% {
         transform: translateY(-200px);
     }

     100% {
         transform: translateY(0);
     }
 }

 /* Pause animation on hover (premium feel) */
 .about-img-wrapper:hover .floating-badge {
     animation-play-state: paused;
 }

 /* ===== PREMIUM FOOTER ===== */

 .premium-footer {
     background: linear-gradient(135deg, #2a0033, #3b0a4f);
     color: #e0e0e0;
     padding: 70px 0 0;
     font-size: 14.5px;
 }

 /* Brand */
 .footer-brand {
     margin-bottom: 20px;
 }

 .footer-text {
     color: #ccc;
     line-height: 1.7;
 }

 /* Titles */
 .footer-title {
     color: #ffffff;
     font-weight: 700;
     margin-bottom: 18px;
     position: relative;
 }

 .footer-title::after {
     content: '';
     width: 40px;
     height: 3px;
     background: var(--accent-orange);
     position: absolute;
     bottom: -6px;
     left: 0;
     border-radius: 2px;
 }

 /* Links */
 .footer-links {
     list-style: none;
     padding: 0;
     margin: 0;
 }

 .footer-links li {
     margin-bottom: 10px;
 }

 .footer-links a {
     color: #ccc;
     text-decoration: none;
     transition: 0.3s;
 }

 .footer-links a:hover {
     color: var(--accent-orange);
     padding-left: 5px;
 }

 /* Contact */
 .footer-contact {
     list-style: none;
     padding: 0;
     margin: 0;
 }

 .footer-contact li {
     margin-bottom: 12px;
     display: flex;
     gap: 10px;
     align-items: center;
 }

 .footer-contact i {
     color: var(--accent-orange);
 }

 /* Social Icons */
 .footer-social {
     margin-top: 20px;
 }

 .footer-social a {
     display: inline-flex;
     align-items: center;
     justify-content: center;
     width: 40px;
     height: 40px;
     margin-right: 10px;
     border-radius: 50%;
     background: rgba(255, 255, 255, 0.08);
     color: #fff;
     transition: 0.35s;
 }

 .footer-social a:hover {
     background: var(--accent-orange);
     box-shadow: 0 0 15px rgba(255, 152, 0, 0.6);
     transform: translateY(-3px);
 }

 /* Bottom Bar */
 .footer-bottom {
     border-top: 1px solid rgba(255, 255, 255, 0.1);
     margin-top: 50px;
     padding: 20px 0;
     text-align: center;
     font-size: 13.5px;
     color: #aaa;
 }

 /* Mobile */
 @media (max-width: 768px) {
     .premium-footer {
         text-align: center;
     }

     .footer-title::after {
         left: 50%;
         transform: translateX(-50%);
     }

     .footer-social a {
         margin: 6px;
     }
 }

 /* ===== PRODUCT SHOWCASE SECTION ===== */

 .product-showcase {
     padding: 90px 0;
     background: var(--accent-orange);
 }

 /* Product Box */
 .product-box {
     background: #fff;
     border-radius: 16px;
     overflow: hidden;
     height: 100%;
     border: 1px solid rgba(0, 0, 0, 0.08);
     transition: 0.35s ease;
     box-shadow: 0 10px 25px rgba(0, 0, 0, 0.08);
 }

 /* Hover */
 .product-box:hover {
     transform: translateY(-8px);
     box-shadow: 0 18px 40px rgba(255, 152, 0, 0.35);
 }

 /* Image */
 .product-img {
     position: relative;
     height: 180px;
     overflow: hidden;
 }

 .product-img img {
     width: 100%;
     height: 100%;
     object-fit: cover;
     transition: 0.4s ease;
 }

 /* Dark Orange Overlay Strip */
 .product-img::after {
     content: '';
     position: absolute;
     inset: 0;
     background: linear-gradient(to bottom,
             rgba(0, 0, 0, 0) 55%,
             rgba(255, 152, 0, 0.85));
 }

 .product-box:hover .product-img img {
     transform: scale(1.08);
 }

 /* Content */
 .product-content {
     padding: 18px 18px 22px;
     background: #fff;
 }

 .product-content h6 {
     font-weight: 800;
     color: var(--primary-purple);
     margin-bottom: 8px;
     font-size: 16px;
 }

 .product-content p {
     font-size: 14px;
     color: #555;
     line-height: 1.6;
     margin-bottom: 0;
 }

 /* Mobile */
 @media (max-width: 768px) {
     .product-showcase {
         padding: 60px 0;
     }

     .product-img {
         height: 160px;
     }
 }

 /* ===== TESTIMONIAL MARQUEE ===== */
 .client-marquee {
     background: #f8f9fa;
     padding: 60px 0;
     overflow: hidden;
 }

 .marquee-wrapper {
     overflow: hidden;
     position: relative;
 }

 .marquee-track {
     display: flex;
     width: max-content;
     animation: scrollClients 30s linear infinite;
 }

 .client-logo {
     flex: 0 0 auto;
     width: 180px;
     height: 100px;
     margin: 0 25px;
     background: #fff;
     border-radius: 8px;
     display: flex;
     align-items: center;
     justify-content: center;
     box-shadow: 0 6px 18px rgba(0, 0, 0, 0.08);
 }

 .client-logo img {
     max-width: 140px;
     max-height: 70px;

     transition: all 0.3s ease;
 }

 .client-logo img:hover {
     filter: grayscale(0%);
 }

 @keyframes scrollClients {
     0% {
         transform: translateX(0);
     }

     100% {
         transform: translateX(-50%);
     }
 }



 /* ===== INDUSTRIES WE SERVE – AS IT IS ===== */

 .industries-ai {
     padding: 100px 20px;
     background:
         radial-gradient(circle at top left, rgba(255, 140, 0, .25), transparent 40%),
         radial-gradient(circle at bottom right, rgba(120, 0, 160, .25), transparent 40%),
         linear-gradient(135deg, #f6f7fc, #ffffff);
     font-family: "Segoe UI", sans-serif;
 }

 .industries-wrap {
     max-width: 1200px;
     margin: auto;
 }

 /* Heading */
 .industries-head {
     text-align: center;
     margin-bottom: 60px;
 }

 .industries-head h2 {
     font-size: 36px;
     font-weight: 900;
     color: #2b2d5b;
     letter-spacing: .5px;
 }

 .industries-head h2 span {
     color: #ff8c00;
 }

 .industries-head p {
     margin-top: 8px;
     color: #5f5f7a;
     font-size: 16px;
 }

 /* Grid */
 .industries-grid {
     display: grid;
     grid-template-columns: repeat(4, 1fr);
     gap: 26px;
 }

 /* Card */
 .ind-card {
     background: rgba(255, 255, 255, .8);
     backdrop-filter: blur(12px);
     border-radius: 18px;
     padding: 26px 24px 30px;
     box-shadow: 0 18px 40px rgba(0, 0, 0, .08);
     transition: .35s ease;
 }

 .ind-card:hover {
     transform: translateY(-10px);
     box-shadow: 0 28px 60px rgba(0, 0, 0, .15);
 }

 /* Glow borders */
 .glow-purple {
     border: 1.5px solid rgba(140, 13, 109, .45);
 }

 .glow-orange {
     border: 1.5px solid rgba(255, 140, 0, .55);
 }

 /* Icon */
 .ind-icon {
     width: 56px;
     height: 56px;
     border-radius: 50%;
     background: linear-gradient(135deg, #ff9a2f, #ff6a00);
     display: flex;
     align-items: center;
     justify-content: center;
     box-shadow: 0 10px 24px rgba(255, 140, 0, .55);
     margin-bottom: 14px;
 }

 .ind-icon i {
     color: #fff;
     font-size: 24px;
 }

 /* Text */
 .ind-card h4 {
     font-size: 17px;
     font-weight: 800;
     color: #2b2d5b;
     margin-bottom: 6px;
 }

 .ind-card p {
     font-size: 14px;
     line-height: 1.6;
     color: #5a5a75;
 }

 /* Bottom CTA */
 .industries-bottom {
     text-align: center;
     margin-top: 55px;
 }

 .industries-bottom p {
     color: #444;
     margin-bottom: 14px;
 }

 .industries-btn {
     display: inline-flex;
     align-items: center;
     gap: 8px;
     padding: 12px 28px;
     border-radius: 30px;
     background: linear-gradient(135deg, #5b1fa6, #8e24aa);
     color: #fff;
     text-decoration: none;
     font-weight: 600;
     transition: .3s;
 }

 .industries-btn:hover {
     background: linear-gradient(135deg, #ff8c00, #ff6a00);
     color: #fff;
 }

 /* Responsive */
 @media(max-width:1100px) {
     .industries-grid {
         grid-template-columns: repeat(2, 1fr);
     }
 }

 @media(max-width:600px) {
     .industries-grid {
         grid-template-columns: 1fr;
     }

     .industries-head h2 {
         font-size: 30px;
     }
 }

 /* ===== KEY SERVICES FULL SECTION ===== */

 /* ===== KEY SERVICES SPLIT (LEFT TEXT / RIGHT CARDS) ===== */

 .key-services-split {
     position: relative;
     padding: 100px 0;
     background: url("../image/bg.png") center / cover no-repeat;
     overflow: hidden;
     font-family: "Segoe UI", sans-serif;
 }

 /* Energy overlay */
 .ks-overlay {
     position: absolute;
     inset: 0;
     background:
         linear-gradient(90deg,
             rgba(238, 238, 241, 0.5) 0%,
             rgba(106, 106, 108, 0.3) 50%,
             rgba(255, 140, 0, 0.75) 100%),
         radial-gradient(circle at right, rgba(255, 140, 0, 0.4), transparent 55%);
 }

 /* Wrapper */
 .ks-wrap {
     position: relative;
     max-width: 1300px;
     margin: auto;
     display: grid;
     grid-template-columns: 1fr 1fr;
     gap: 40px;
     z-index: 2;
 }

 /* LEFT SIDE */
 .ks-left {
     display: flex;
     flex-direction: column;
     justify-content: center;
     padding: 0 40px;
 }

 .ks-heading h2 {
     font-size: 42px;
     font-weight: 900;
     color: var(--primary-purple);
 }

 .ks-heading p {
     font-size: 18px;
     color: var(--primary-purple);
     ;
     margin-top: 8px;
 }

 .ks-left-text p {
     margin-top: 20px;
     font-size: 15px;
     line-height: 1.7;
     color: var(--primary-purple);
     ;
     max-width: 420px;
 }

 /* CTA */
 .ks-footer {
     margin-top: 30px;
 }

 .ks-btn {
     display: inline-flex;
     align-items: center;
     gap: 8px;
     padding: 14px 32px;
     border-radius: 30px;
     background: linear-gradient(135deg, #4a148c, #7b1fa2);
     color: #fff;
     text-decoration: none;
     font-weight: 600;
     transition: 0.3s;
 }

 .ks-btn:hover {
     background: linear-gradient(135deg, #ff8c00, #ff6a00);
 }

 /* RIGHT SIDE */
 .ks-right {
     padding-right: 40px;
 }

 /* Cards Grid */
 .ks-cards {
     display: grid;
     grid-template-columns: repeat(2, 1fr);
     gap: 24px;
 }

 /* Card */
 .ks-card {
     background: rgba(255, 255, 255, 0.18);
     backdrop-filter: blur(14px);
     border-radius: 18px;
     padding: 28px 24px;
     border: 1.5px solid rgba(255, 170, 90, 0.6);
     box-shadow: 0 18px 45px rgba(0, 0, 0, 0.3);
     transition: 0.35s ease;
 }

 .ks-card:hover {
     transform: translateY(-10px);
     box-shadow: 0 30px 65px rgba(0, 0, 0, 0.45);
 }

 /* Icon */
 .ks-icon {
     width: 56px;
     height: 56px;
     border-radius: 50%;
     background: linear-gradient(135deg, #ff9f2f, #ff6a00);
     display: flex;
     align-items: center;
     justify-content: center;
     margin-bottom: 14px;
     box-shadow: 0 12px 28px rgba(255, 140, 0, 0.6);
 }

 .ks-icon i {
     font-size: 24px;
     color: #fff;
 }

 /* Text */
 .ks-card h4 {
     font-size: 16px;
     font-weight: 800;
     color: #ffffff;
     margin-bottom: 6px;
 }

 .ks-card p {
     font-size: 14px;
     line-height: 1.6;
     color: #f1f1f1;
 }

 /* Responsive */
 @media(max-width: 992px) {
     .ks-wrap {
         grid-template-columns: 1fr;
     }

     .ks-left,
     .ks-right {
         padding: 0 20px;
     }

     .ks-cards {
         grid-template-columns: 1fr;
     }
 }


 /* ===== ENQUIRY SECTION ===== */

 .enquiry-section {
     position: relative;
     padding: 100px 0;
     background:
         radial-gradient(circle at top left, rgba(255, 140, 0, 0.18), transparent 40%),
         radial-gradient(circle at bottom right, rgba(120, 60, 200, 0.18), transparent 45%),
         linear-gradient(135deg, #f7f8fd, #ffffff);
     font-family: "Segoe UI", sans-serif;
     overflow: hidden;
 }

 /* Overlay */
 .enquiry-overlay {
     position: absolute;
     inset: 0;

 }

 /* Wrapper */
 .enquiry-wrapper {
     position: relative;
     max-width: 1200px;
     margin: auto;
     display: grid;
     grid-template-columns: 1fr 1fr;
     gap: 40px;
     z-index: 2;
 }

 /* LEFT SIDE */
 .enquiry-left {
     padding: 0 30px;
     color: var(--primary-purple);
 }

 .enquiry-left h2 {
     font-size: 42px;
     font-weight: 900;
 }

 .enquiry-left .subtitle {
     margin-top: 10px;
     font-size: 16px;
     color: var(--primary-purple);
     max-width: 420px;
 }

 /* Info items */
 .enquiry-info {
     margin-top: 35px;
 }

 .info-item {
     display: flex;
     align-items: flex-start;
     gap: 15px;
     margin-bottom: 18px;
 }

 .info-item i {
     font-size: 20px;
     color: #ff8c00;
     margin-top: 3px;
 }

 .info-item span {
     font-size: 15px;
     line-height: 1.6;
 }

 /* RIGHT SIDE */
 .enquiry-right {
     background: rgba(255, 255, 255, 0.18);
     backdrop-filter: blur(14px);
     border-radius: 20px;
     padding: 35px 30px;
     border: 1.5px solid rgba(255, 170, 90, 0.6);
     box-shadow: 0 20px 45px rgba(0, 0, 0, 0.35);
 }

 .enquiry-right h3 {
     font-size: 24px;
     font-weight: 800;
     color: var(--accent-orange);
     margin-bottom: 25px;
 }

 /* Form */
 .enquiry-form .form-group {
     margin-bottom: 16px;
 }

 .enquiry-form input,
 .enquiry-form select,
 .enquiry-form textarea {
     width: 100%;
     padding: 12px 14px;
     border-radius: 8px;
     border: none;
     outline: none;
     font-size: 14px;
 }

 .enquiry-form textarea {
     resize: none;
 }

 /* Button */
 .enquiry-btn {
     width: 100%;
     padding: 14px;
     border-radius: 30px;
     border: none;
     background: linear-gradient(135deg, #ff8c00, #ff6a00);
     color: #fff;
     font-weight: 700;
     cursor: pointer;
     transition: 0.3s;
 }

 .enquiry-btn i {
     margin-left: 6px;
 }

 .enquiry-btn:hover {
     background: linear-gradient(135deg, #4a148c, #7b1fa2);
 }

 /* Responsive */
 @media(max-width: 992px) {
     .enquiry-wrapper {
         grid-template-columns: 1fr;
     }

     .enquiry-left,
     .enquiry-right {
         padding: 0 20px;
     }

     .enquiry-right {
         margin-top: 30px;
     }
 }

 /* ===== PREMIUM CTA SECTION ===== */

 .premium-cta {
     padding: 90px 20px;
     background:
         radial-gradient(circle at top left, rgba(255, 140, 0, 0.18), transparent 45%),
         radial-gradient(circle at bottom right, rgba(120, 60, 200, 0.18), transparent 45%),
         linear-gradient(135deg, #f7f8fd, #ffffff);
     font-family: "Segoe UI", sans-serif;
 }

 .cta-wrapper {
     max-width: 1100px;
     margin: auto;
     background: rgba(255, 255, 255, 0.85);
     backdrop-filter: blur(12px);
     border-radius: 22px;
     padding: 60px 50px;
     box-shadow: 0 25px 60px rgba(0, 0, 0, 0.12);
     border: 1px solid rgba(0, 0, 0, 0.06);
 }

 .cta-content {
     text-align: center;
 }

 .cta-content h2 {
     font-size: 40px;
     font-weight: 900;
     color: #2b2d5b;
     margin-bottom: 15px;
 }

 .cta-content p {
     font-size: 17px;
     color: #555;
     max-width: 700px;
     margin: 0 auto 35px;
     line-height: 1.6;
 }

 /* Buttons */
 .cta-actions {
     display: flex;
     justify-content: center;
     gap: 20px;
 }

 .cta-btn {
     padding: 14px 34px;
     border-radius: 30px;
     font-weight: 700;
     text-decoration: none;
     transition: 0.3s ease;
 }

 /* Primary Button */
 .cta-btn.primary {
     background: linear-gradient(135deg, #ff8c00, #ff6a00);
     color: #fff;
     box-shadow: 0 12px 30px rgba(255, 140, 0, 0.4);
 }

 .cta-btn.primary:hover {
     background: linear-gradient(135deg, #4a148c, #7b1fa2);
 }

 /* Outline Button */
 .cta-btn.outline {
     border: 2px solid #ff8c00;
     color: #ff8c00;
 }

 .cta-btn.outline:hover {
     background: #ff8c00;
     color: #fff;
 }

 /* Responsive */
 @media(max-width: 768px) {
     .cta-wrapper {
         padding: 45px 25px;
     }

     .cta-content h2 {
         font-size: 30px;
     }

     .cta-actions {
         flex-direction: column;
     }
 }


 /* ===== FLOATING WHATSAPP BUTTON ===== */

 .whatsapp-float {
     position: fixed;
     bottom: 25px;
     right: 25px;
     width: 60px;
     height: 60px;
     background: linear-gradient(135deg, #25d366, #1ebe5d);
     color: #fff;
     border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
     font-size: 30px;
     text-decoration: none;
     z-index: 9999;
     box-shadow: 0 12px 30px rgba(37, 211, 102, 0.5);
     transition: 0.3s ease;
 }

 .whatsapp-float:hover {
     transform: scale(1.08);
     box-shadow: 0 18px 40px rgba(37, 211, 102, 0.7);
 }

 /* Mobile */
 @media(max-width: 768px) {
     .whatsapp-float {
         width: 54px;
         height: 54px;
         font-size: 26px;
         bottom: 20px;
         right: 20px;
     }
 }


 .recent-projects-brochure {
     padding: 70px 0;
     background: var(--gradient-top);
 }

 .recent-projects-brochure .section-title h2 {
     color: #fff;
 }

 .recent-projects-brochure .section-title p {
     color: rgba(255, 255, 255, 0.85);
 }

 .project-box {
     position: relative;
     overflow: hidden;
     border-radius: 16px;
     box-shadow: 0 16px 36px rgba(0, 0, 0, 0.25);
 }

 .project-box img {
     width: 100%;
     height: 100%;
     object-fit: cover;
     transition: transform 0.6s ease;
 }

 .project-box:hover img {
     transform: scale(1.08);
 }

 /* Sizes */
 .project-box.large {
     height: 100%;
     min-height: 440px;
 }

 .project-box.small {
     height: 190px;
 }

 /* Overlay */
 .project-overlay {
     position: absolute;
     inset: 0;

     display: flex;
     flex-direction: column;
     justify-content: flex-end;
     padding: 18px;
 }

 .project-overlay h5,
 .project-overlay h6 {
     color: #fff;
     font-weight: 700;
     margin-bottom: 4px;
 }

 .project-overlay span {
     font-size: 13px;
     color: var(--accent-orange);
     font-weight: 600;
 }

 @media (max-width: 768px) {
     .project-box:hover img {
         transform: none;
     }
 }