/* ==========================================================
   PR INFOTECH SOLUTIONS — HOME PAGE CSS
   Used only by index.html.
========================================================== */

/*==================================================
 HERO SECTION V2.0
==================================================*/

.hero{
    background: linear-gradient(135deg,#f8fbff,#eef6ff);
    padding:80px 0;
}

.hero-wrapper{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:60px;
}

.hero-content{
    flex:1;
}

.hero-tag{
    display:inline-block;
    background:#e8f1ff;
    color:#0057D9;
    padding:8px 18px;
    border-radius:30px;
    font-size:14px;
    font-weight:600;
    margin-bottom:20px;
}

.hero-content h1{
    font-size:52px;
    line-height:1.2;
    color:#1F2937;
    margin-bottom:25px;
}

.hero-content p{
    font-size:18px;
    color:#6b7280;
    margin-bottom:30px;
    line-height:1.8;
}

.hero-buttons{
    display:flex;
    gap:20px;
    margin-bottom:35px;
}

.btn-primary{
    background:#FF6B00;
    color:#fff;
    padding:16px 35px;
    border-radius:8px;
    font-weight:600;
    transition:.3s;
}

.btn-primary:hover{
    background:#0057D9;
}

.btn-secondary{
    border:2px solid #0057D9;
    color:#0057D9;
    padding:16px 35px;
    border-radius:8px;
    font-weight:600;
    transition:.3s;
}

.btn-secondary:hover{
    background:#0057D9;
    color:#fff;
}

.hero-features{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:15px;
}

.hero-features div{
    background:#fff;
    padding:15px 20px;
    border-radius:10px;
    box-shadow:0 5px 20px rgba(0,0,0,.08);
    font-weight:600;
}

.hero-features i{
    color:#22c55e;
    margin-right:10px;
}

.hero-image{
    flex:1;
    display:flex;
    justify-content:center;
    align-items:flex-start;
    margin-top:0;
    padding-top:0;
}

.hero-image img{
    width:100%;
    max-width:700px;
    height:auto;
    display:block;
    object-fit:cover;
    border-radius:20px;
    box-shadow:0 20px 50px rgba(0,0,0,.18);
}
/*==================================================
 TRUSTED BRANDS
==================================================*/

.brands{
    padding:80px 0;
    background:#ffffff;
}

.section-title{
    text-align:center;
    margin-bottom:50px;
}

.section-title span{
    color:#0057D9;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:1px;
    font-size:14px;
}

.section-title h2{
    margin:15px 0;
    font-size:38px;
    color:#1F2937;
}

.section-title p{
    max-width:700px;
    margin:auto;
    color:#6b7280;
    line-height:1.8;
}

.brands-slider{
    display:flex;
    justify-content:space-between;
    align-items:center;
    flex-wrap:wrap;
    gap:40px;
}

.brands-slider img{

    width:140px;

    filter: grayscale(100%);

    opacity:.65;

    transition:.4s;
}

.brands-slider img:hover{

    filter:none;

    opacity:1;

    transform:scale(1.08);
}
/*==================================================
WHY CHOOSE US
==================================================*/

.why-choose{
    padding:90px 0;
    background:#f8fbff;
}

.why-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:30px;
    margin-top:50px;
}

.why-card{
    background:#fff;
    padding:35px 25px;
    border-radius:15px;
    text-align:center;
    transition:.35s;
    box-shadow:0 8px 25px rgba(0,0,0,.06);
}

.why-card:hover{
    transform:translateY(-8px);
    box-shadow:0 18px 40px rgba(0,0,0,.12);
}

.why-card i{
    font-size:42px;
    color:#0057D9;
    margin-bottom:20px;
}

.why-card h3{
    font-size:22px;
    margin-bottom:15px;
    color:#1F2937;
}

.why-card p{
    color:#6b7280;
    line-height:1.7;
    font-size:16px;
}

/*==================================================
 OUR SERVICES - PREMIUM IMAGE CARDS
==================================================*/

.services{
    padding:90px 0;
    background:#ffffff;
}

.services-grid{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:30px;
    margin-top:50px;
    align-items:stretch;
}

.service-card{
    background:#ffffff;
    border:1px solid #e5edf7;
    border-radius:18px;
    overflow:hidden;
    display:flex;
    flex-direction:column;
    text-align:left;
    box-shadow:0 12px 35px rgba(15,35,65,.08);
    transition:transform .35s ease,box-shadow .35s ease;
}

.service-card:hover{
    transform:translateY(-10px);
    box-shadow:0 24px 55px rgba(15,35,65,.16);
}

.service-image{
    position:relative;
    height:190px;
    overflow:hidden;
    background:#eaf2ff;
}

.service-image::after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(to top,rgba(0,36,89,.38),transparent 58%);
    pointer-events:none;
}

.service-image img{
    width:100%;
    height:100%;
    object-fit:cover;
    transition:transform .55s ease;
}

.service-card:hover .service-image img{
    transform:scale(1.07);
}

.service-icon{
    position:absolute;
    left:22px;
    bottom:18px;
    z-index:2;
    width:50px;
    height:50px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:14px;
    background:#ffffff;
    color:#0057D9;
    box-shadow:0 10px 25px rgba(0,0,0,.18);
}

.service-card .service-icon i{
    margin:0;
    font-size:23px;
    color:#0057D9;
}

.service-card-content{
    padding:26px 24px 28px;
    display:flex;
    flex-direction:column;
    flex:1;
}

.service-card-content h3{
    font-size:21px;
    margin-bottom:12px;
    color:#1F2937;
}

.service-card-content p{
    color:#6b7280;
    line-height:1.7;
    margin-bottom:20px;
    min-height:0;
    flex:1;
}

.service-card-content a{
    margin-top:auto;
    display:inline-flex;
    align-items:center;
    gap:7px;
    color:#0057D9;
    font-weight:600;
    text-decoration:none;
}

.service-card-content a:hover{
    color:#FF6B00;
}

.service-card-content a span{
    transition:transform .25s ease;
}

.service-card-content a:hover span{
    transform:translateX(5px);
}

@media(max-width:1100px){
    .services-grid{
        grid-template-columns:repeat(2,minmax(0,1fr));
    }
}

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

    .service-image{
        height:210px;
    }
}


/*==================================================
RENTAL CATEGORIES
==================================================*/

.rental-categories{
    padding:90px 0;
    background:#f8fbff;
}

.rental-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:30px;
    margin-top:50px;
}

.rental-card{
    background:#fff;
    border-radius:15px;
    overflow:hidden;
    box-shadow:0 8px 25px rgba(0,0,0,.08);
    transition:.35s;
}

.rental-card:hover{
    transform:translateY(-8px);
    box-shadow:0 20px 45px rgba(0,0,0,.15);
}

.rental-card img{
    width:100%;
    height:220px;
    object-fit:cover;
}

.rental-content{
    padding:25px;
    text-align:center;
}

.rental-content h3{
    font-size:24px;
    color:#1F2937;
    margin-bottom:15px;
}

.rental-content a{
    display:inline-block;
    padding:12px 25px;
    background:#0057D9;
    color:#fff;
    text-decoration:none;
    border-radius:6px;
    font-weight:600;
    transition:.3s;
}

.rental-content a:hover{
    background:#FF6B00;
}

/*==================================================
INDUSTRIES
==================================================*/

.industries{
    padding:90px 0;
    background:#ffffff;
}

.industry-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:30px;
    margin-top:50px;
}

.industry-card{
    background:#fff;
    border-radius:15px;
    padding:35px;
    text-align:center;
    border:1px solid #eef2f7;
    box-shadow:0 8px 25px rgba(0,0,0,.06);
    transition:.35s;
}

.industry-card:hover{
    transform:translateY(-8px);
    box-shadow:0 20px 45px rgba(0,0,0,.12);
}

.industry-card i{
    font-size:48px;
    color:#0057D9;
    margin-bottom:20px;
}

.industry-card h3{
    font-size:22px;
    color:#1F2937;
    margin-bottom:15px;
}

.industry-card p{
    color:#6b7280;
    line-height:1.7;
}
/*==================================================
OUR ACHIEVEMENTS
==================================================*/

.counter-section{

    padding:90px 0;

    background:linear-gradient(135deg,#0057D9,#007BFF);

    color:#fff;

}

.counter-section .section-title span,
.counter-section .section-title h2,
.counter-section .section-title p{

    color:#fff;

}

.counter-grid{

    display:grid;

    grid-template-columns:repeat(4,1fr);

    gap:30px;

    margin-top:50px;

}

.counter-box{

    text-align:center;

    background:rgba(255,255,255,.08);

    padding:35px;

    border-radius:15px;

    backdrop-filter:blur(8px);

}

.counter-box i{

    font-size:45px;

    margin-bottom:20px;

}

.counter-box h3{

    font-size:48px;

    margin-bottom:10px;

    font-weight:700;

}

.counter-box p{

    font-size:18px;

}
/*==================================================
CUSTOMER TESTIMONIALS
==================================================*/

.testimonials{
    padding:90px 0;
    background:#ffffff;
}

.testimonial-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:30px;
    margin-top:50px;
}

.testimonial-card{
    background:#fff;
    padding:35px;
    border-radius:15px;
    border:1px solid #eef2f7;
    box-shadow:0 8px 25px rgba(0,0,0,.06);
    transition:.35s;
}

.testimonial-card:hover{
    transform:translateY(-8px);
    box-shadow:0 18px 40px rgba(0,0,0,.12);
}

.stars{
    color:#f59e0b;
    font-size:22px;
    margin-bottom:20px;
}

.testimonial-card p{
    color:#6b7280;
    line-height:1.8;
    margin-bottom:25px;
    font-style:italic;
}

.testimonial-card h4{
    color:#1F2937;
    margin-bottom:5px;
}

.testimonial-card span{
    color:#0057D9;
    font-size:14px;
    font-weight:600;
}
/*==================================================
FAQ SECTION
==================================================*/

.faq{
    padding:90px 0;
    background:#f8fbff;
}

.faq-container{
    max-width:900px;
    margin:50px auto 0;
}

.faq-item{
    background:#fff;
    border-radius:10px;
    margin-bottom:20px;
    overflow:hidden;
    box-shadow:0 6px 18px rgba(0,0,0,.08);
}

.faq-question{
    width:100%;
    background:#fff;
    border:none;
    padding:22px 25px;
    text-align:left;
    font-size:18px;
    font-weight:600;
    cursor:pointer;
    display:flex;
    justify-content:space-between;
    align-items:center;
}

.faq-question span{
    font-size:28px;
    color:#0057D9;
}

.faq-answer{
    display:none;
    padding:0 25px 22px;
}

.faq-answer p{
    color:#6b7280;
    line-height:1.8;
}
/*==================================================
CALL TO ACTION
==================================================*/

.cta-section{

    padding:90px 0;

    background:linear-gradient(135deg,#0057D9,#003E99);

    color:#fff;

}

.cta-content{

    text-align:center;

    max-width:850px;

    margin:auto;

}

.cta-content h2{

    font-size:44px;

    margin-bottom:20px;

}

.cta-content p{

    font-size:18px;

    line-height:1.8;

    margin-bottom:40px;

    opacity:.95;

}

.cta-buttons{

    display:flex;

    justify-content:center;

    gap:20px;

    flex-wrap:wrap;

}

.btn-whatsapp{

    background:#25D366;

    color:#fff;

    padding:16px 34px;

    border-radius:8px;

    font-weight:600;

    transition:.3s;

}

.btn-whatsapp:hover{

    background:#1BA94C;

}


/* ==========================================================
   HERO ALIGNMENT FIX
   Removes empty space above the hero image
========================================================== */

@media(max-width:1050px){
    .hero-wrapper{
        flex-direction:column;
        align-items:stretch;
        gap:40px;
    }

    .hero-image{
        width:100%;
    }

    .hero-image img{
        max-width:100%;
    }
}

@media(max-width:640px){
    .hero{
        padding:50px 0;
    }

    .hero-content h1{
        font-size:40px;
    }

    .hero-buttons{
        flex-wrap:wrap;
    }

    .hero-image img{
        border-radius:14px;
    }
}

/* ==========================================================
   FINAL EXTRA-COMPACT SECTION GAP FIX
   Removes the large blank bands between homepage sections
   without shrinking normal heading or paragraph text.
========================================================== */

/* Outer section space */
.hero{
    padding-top:28px !important;
    padding-bottom:28px !important;
}

.trusted-brands,
.brands,
.why-choose,
.services,
.rental-categories,
.industries,
.counter-section,
.testimonials,
.faq{
    padding-top:24px !important;
    padding-bottom:24px !important;
}

.cta-section{
    padding-top:32px !important;
    padding-bottom:32px !important;
}

/* Remove section margins and container padding that may add blank space */
.hero,
.trusted-brands,
.brands,
.why-choose,
.services,
.rental-categories,
.industries,
.counter-section,
.testimonials,
.faq,
.cta-section{
    margin-top:0 !important;
    margin-bottom:0 !important;
    min-height:0 !important;
}

.hero > .container,
.trusted-brands > .container,
.brands > .container,
.why-choose > .container,
.services > .container,
.rental-categories > .container,
.industries > .container,
.counter-section > .container,
.testimonials > .container,
.faq > .container,
.cta-section > .container{
    padding-top:0 !important;
    padding-bottom:0 !important;
    margin-top:0 !important;
    margin-bottom:0 !important;
}

/* Heading-to-content spacing */
.section-title{
    margin-top:0 !important;
    margin-bottom:20px !important;
    padding-top:0 !important;
    padding-bottom:0 !important;
}

.section-title span{
    margin-top:0 !important;
}

.section-title h2{
    margin-top:8px !important;
    margin-bottom:7px !important;
}

.section-title p{
    margin-top:0 !important;
    margin-bottom:0 !important;
}

/* Remove the duplicate grid margin that previously created another large gap */
.trusted-brands .brands-grid,
.brands-grid,
.brands-slider,
.why-grid,
.services-grid,
.rental-grid,
.industry-grid,
.counter-grid,
.testimonial-grid{
    margin-top:0 !important;
    margin-bottom:0 !important;
}

/* Keep cards comfortably separated */
.trusted-brands .brands-grid,
.brands-grid,
.why-grid,
.services-grid,
.rental-grid,
.industry-grid,
.counter-grid,
.testimonial-grid{
    gap:22px !important;
}

/* FAQ also had a separate top margin */
.faq-container{
    margin-top:0 !important;
    margin-bottom:0 !important;
}

/* Ensure no empty pseudo-elements create extra height */
.hero::before,
.hero::after,
.trusted-brands::before,
.trusted-brands::after,
.why-choose::before,
.why-choose::after,
.services::before,
.services::after,
.industries::before,
.industries::after{
    margin:0 !important;
}

/* Tablet */
@media(max-width:1050px){
    .hero{
        padding-top:24px !important;
        padding-bottom:24px !important;
    }

    .trusted-brands,
    .brands,
    .why-choose,
    .services,
    .rental-categories,
    .industries,
    .counter-section,
    .testimonials,
    .faq{
        padding-top:22px !important;
        padding-bottom:22px !important;
    }

    .section-title{
        margin-bottom:18px !important;
    }
}

/* Mobile */
@media(max-width:640px){
    .hero,
    .trusted-brands,
    .brands,
    .why-choose,
    .services,
    .rental-categories,
    .industries,
    .counter-section,
    .testimonials,
    .faq{
        padding-top:20px !important;
        padding-bottom:20px !important;
    }

    .cta-section{
        padding-top:26px !important;
        padding-bottom:26px !important;
    }

    .section-title{
        margin-bottom:16px !important;
    }

    .trusted-brands .brands-grid,
    .brands-grid,
    .why-grid,
    .services-grid,
    .rental-grid,
    .industry-grid,
    .counter-grid,
    .testimonial-grid{
        gap:16px !important;
    }
}

/* ==========================================================
   PR INFOTECH — TRUST STRIP & HERO CALL BUTTON REFINEMENT
========================================================== */

/* Hero Call Now button */
.hero .btn-secondary{
    min-height:56px;
    padding:15px 34px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    border:2px solid #0057D9;
    border-radius:12px;
    background:#ffffff;
    color:#0057D9;
    font-size:17px;
    font-weight:700;
    line-height:1;
    box-shadow:0 10px 26px rgba(0,87,217,.10);
    transition:background .25s ease,color .25s ease,transform .25s ease,box-shadow .25s ease;
}

.hero .btn-secondary:hover,
.hero .btn-secondary:focus{
    background:#0057D9;
    color:#ffffff;
    transform:translateY(-3px);
    box-shadow:0 16px 34px rgba(0,87,217,.25);
}

/* Clearly separate the trust strip from the hero */
.hero-trust-strip{
    position:relative;
    z-index:20;
    margin:0 !important;
    padding:24px 0 34px !important;
    background:linear-gradient(180deg,#F4F8FF 0%,#FFFFFF 100%) !important;
    border-top:1px solid #dbe7ff;
    border-bottom:1px solid #e8eef8;
    box-shadow:0 12px 30px rgba(15,35,65,.04);
}

/* Stop the cards from overlapping the hero */
.hero-trust-grid{
    margin:0 !important;
    transform:none !important;
}

/* Premium card treatment */
.hero-trust-item{
    background:#ffffff !important;
    border:1px solid #e5ebf3 !important;
    box-shadow:0 10px 28px rgba(15,35,65,.08) !important;
}

.hero-trust-item:hover{
    transform:translateY(-5px);
    box-shadow:0 16px 34px rgba(15,35,65,.13) !important;
}

/* Remove the old negative pull applied to Trusted Brands */
.hero-trust-strip + .trusted-brands{
    margin-top:0 !important;
}

/* Mobile */
@media(max-width:700px){
    .hero .btn-secondary{
        width:100%;
        min-height:52px;
        padding:14px 24px;
    }

    .hero-trust-strip{
        padding:20px 0 26px !important;
    }

    .hero-trust-grid{
        transform:none !important;
    }
}

/* ==========================================================
   FINAL VISIBLE TRUST STRIP BACKGROUND
   Stronger light-blue background for clear separation
========================================================== */

.hero-trust-strip{
    background:#D4E7FF !important;
    border-top:1px solid #CFE0F7 !important;
    border-bottom:1px solid #CFE0F7 !important;
    box-shadow:none !important;
}

.hero-trust-strip .hero-trust-item{
    background:#FFFFFF !important;
    border:1px solid #D6E3F5 !important;
    box-shadow:0 10px 26px rgba(0,87,217,.09) !important;
}

.hero-trust-strip + .trusted-brands{
    background:#FFFFFF !important;
    margin-top:0 !important;
}
