/*==========================================================

BuildNOW Website
Developer : Tenet Solutions
All Rights Reserved. Copyright 2026

==========================================================*/

@import url("variables.css");
@import url("reset.css");
@import url("typography.css");
@import url("layout.css");
@import url("components.css");
@import url("header.css");
@import url("hero.css");
@import url("sections.css");
@import url("footer.css");
@import url("animations.css");
@import url("responsive.css");

.back-to-top{

position:fixed !important;

right:25px !important;

bottom:25px !important;

top:auto !important;

left:auto !important;

width:56px;

height:56px;

border:none;

border-radius:50%;

background:#ffd600;

color:#111827;

font-size:1rem;

cursor:pointer;

z-index:9999;

opacity:0;

visibility:hidden;

transform:translateY(10px);

transition:all .3s ease;

box-shadow:0 10px 25px rgba(0,0,0,.2);

}

.back-to-top.visible{

opacity:1;

visibility:visible;

transform:translateY(0);

}

.back-to-top:hover{

background:#ffd84d;

transform:translateY(-3px);

box-shadow:0 14px 30px rgba(0,0,0,.25);

}

@media screen and (max-width:576px){

.back-to-top{

width:50px;

height:50px;

right:15px !important;

bottom:15px !important;

}

}
/*==========================================================

SERVICES OVERVIEW

==========================================================*/

.services-overview{

padding:100px 0;

background:#E8E9EB;

color:#ffffff;

}

.services-overview .section-header{

text-align:center;

max-width:760px;

margin:0 auto 60px;

}

.services-overview .section-subtitle{

display:inline-block;

margin-bottom:1rem;

color:#ffd600;

font-size:.85rem;

font-weight:700;

letter-spacing:.15em;

text-transform:uppercase;

}

.services-overview h2{

margin-bottom:1rem;

font-size:clamp(2rem,4vw,3rem);

line-height:1.2;

}

.services-overview .section-header p{

color:#000000;

line-height:1.8;

}

.services-grid{

display:grid;

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

gap:1.5rem;

}

.service-card{

background:#111111;

border:1px solid rgba(255,255,255,.08);

border-radius:20px;

padding:2rem 1.5rem;

transition:all .3s ease;

}

.service-card:hover{

transform:translateY(-8px);

border-color:#ffd600;

box-shadow:0 20px 40px rgba(0,0,0,.35);

}

.service-icon{

width:70px;

height:70px;

display:flex;

align-items:center;

justify-content:center;

margin-bottom:1.5rem;

border-radius:18px;

background:#ffd600;

color:#111111;

font-size:1.8rem;

}

.service-card h3{

margin-bottom:1rem;

font-size:1.3rem;

color:#ffffff;

}

.service-card p{

color:rgba(255,255,255,.75);

line-height:1.7;

font-size:.95rem;

}

/*==========================================================

RESPONSIVE

==========================================================*/

@media screen and (max-width:1200px){

.services-grid{

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

}

}

@media screen and (max-width:768px){

.services-overview{

padding:80px 0;

}

.services-grid{

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

}

}

@media screen and (max-width:576px){

.services-grid{

grid-template-columns:1fr;

}

.service-card{

padding:1.75rem 1.5rem;

}

}
/*==========================================================

CALL TO ACTION

==========================================================*/

.cta-section{

position:relative;

padding:120px 0;

background:url('../images/cta/cta-bg.jpg') center/cover no-repeat;

overflow:hidden;

}

.cta-overlay{

position:absolute;

inset:0;

background:linear-gradient(

135deg,

rgba(0,0,0,.82) 0%,

rgba(0,0,0,.72) 50%,

rgba(0,0,0,.82) 100%

);

}

.cta-content{

position:relative;

z-index:2;

max-width:760px;

text-align:center;

margin:0 auto;

color:#ffffff;

}

.cta-subtitle{

display:inline-block;

margin-bottom:1rem;

color:#ffd600;

font-size:.85rem;

font-weight:700;

letter-spacing:.15em;

text-transform:uppercase;

}

.cta-content h2{

margin-bottom:1.5rem;

font-size:clamp(2.2rem,5vw,3.8rem);

line-height:1.15;

color:#ffffff;

}

.cta-content p{

margin-bottom:2rem;

font-size:1.1rem;

line-height:1.8;

color:rgba(255,255,255,.9);

}

.cta-buttons{

display:flex;

justify-content:center;

gap:1rem;

flex-wrap:wrap;

}

.cta-buttons .btn{

min-width:220px;

justify-content:center;

}

@media screen and (max-width:768px){

.cta-section{

padding:90px 0;

}

.cta-content p{

font-size:1rem;

}

}

@media screen and (max-width:576px){

.cta-buttons{

flex-direction:column;

}

.cta-buttons .btn{

width:100%;

min-width:100%;

}

}
/*==========================================================

TESTIMONIALS

==========================================================*/

.testimonials-section{

padding:100px 0;

background:#ffd600;

color:#ffffff;

}

.testimonials-section .section-header{

text-align:center;

max-width:760px;

margin:0 auto 60px;

}

.testimonials-section .section-subtitle{

display:inline-block;

margin-bottom:1rem;

color:#f4b400;

font-size:.85rem;

font-weight:700;

letter-spacing:.15em;

text-transform:uppercase;

}

.testimonials-section h2{

margin-bottom:1rem;

font-size:clamp(2rem,4vw,3rem);

line-height:1.2;

}

.testimonials-section .section-header p{

color:#000000;

line-height:1.8;

}

.testimonials-grid{

display:grid;

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

gap:1.5rem;

}

.testimonial-card{

background:#000000;

border:1px solid rgba(255,255,255,.08);

border-radius:20px;

padding:2rem;

transition:all .3s ease;

}

.testimonial-card:hover{

transform:translateY(-6px);

border-color:#f4b400;

box-shadow:0 20px 40px rgba(0,0,0,.35);

}

.quote-icon{

font-size:2rem;

color:#f4b400;

margin-bottom:1.5rem;

}

.testimonial-card p{

color:rgba(255,255,255,.85);

line-height:1.8;

margin-bottom:1.5rem;

font-size:.98rem;

}

.testimonial-card h4{

color:#f4b400;

font-size:1rem;

margin:0;

}

/*==========================================================

RESPONSIVE

==========================================================*/

@media screen and (max-width:992px){

.testimonials-grid{

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

}

}

@media screen and (max-width:576px){

.testimonials-section{

padding:80px 0;

}

.testimonials-grid{

grid-template-columns:1fr;

}

.testimonial-card{

padding:1.75rem;

}

}
/*==========================================================

INDUSTRY QUOTE SECTION

==========================================================*/

.industry-quote{

position:relative;

padding:40px 0;

background:url('../images/hero/industry-quote.jpg') center/cover no-repeat;

overflow:hidden;

}

.industry-overlay{

position:absolute;

inset:0;

background:rgba(0,0,0,.68);

}

.industry-content{

position:relative;

z-index:2;

max-width:900px;

margin:0 auto;

text-align:center;

color:#ffffff;

}

.quote-mark{

font-size:3rem;

color:#f4b400;

margin-bottom:1.5rem;

}

.industry-content blockquote{

margin:0 0 1.5rem;

font-size:clamp(2rem,4vw,3.4rem);

line-height:1.3;

font-weight:700;

background: none;

}

.industry-author{

color:#f4b400;

font-size:.9rem;

font-weight:700;

letter-spacing:.18em;

text-transform:uppercase;

}

@media screen and (max-width:768px){

.industry-quote{

padding:100px 0;

}

.quote-mark{

font-size:2.4rem;

}

}
.latest-news{

padding:100px 0;

background:#f8fafc;

}

.latest-news .section-header{

text-align:center;

max-width:760px;

margin:0 auto 60px;

}

.latest-news .section-subtitle{

display:inline-block;

margin-bottom:1rem;

color:#f4b400;

font-size:.85rem;

font-weight:700;

letter-spacing:.15em;

text-transform:uppercase;

}

.news-grid{

display:grid;

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

gap:2rem;

}

.news-card{

background:#ffffff;

border-radius:22px;

overflow:hidden;

box-shadow:0 10px 30px rgba(0,0,0,.08);

transition:all .3s ease;

}

.news-card:hover{

transform:translateY(-8px);

box-shadow:0 20px 40px rgba(0,0,0,.12);

}

.news-card img{

width:100%;

height:240px;

object-fit:cover;

}

.news-content{

padding:1.8rem;

}

.news-date{

display:inline-block;

margin-bottom:1rem;

color:#f4b400;

font-size:.85rem;

font-weight:700;

text-transform:uppercase;

}

.news-content h3{

margin-bottom:1rem;

font-size:1.3rem;

line-height:1.4;

color:#111827;

}

.news-content p{

color:#000;

line-height:1.8;

}

@media screen and (max-width:992px){

.news-grid{

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

}

}

@media screen and (max-width:576px){

.latest-news{

padding:80px 0;

}

.news-grid{

grid-template-columns:1fr;

}

}
/*==========================================================

SERVICES HERO BANNER

==========================================================*/

.services-hero{

position:relative;

padding:160px 0 120px;

background:url('../images/hero/services-hero.jpg') center/cover no-repeat;

overflow:hidden;

}

.services-hero-overlay{

position:absolute;

inset:0;

background:linear-gradient(135deg, rgba(0,0,0,.78), rgba(0,0,0,.60));

}

.services-hero-content{

position:relative;

z-index:2;

max-width:780px;

color:#ffffff;

}

.hero-subtitle{

display:inline-block;

margin-bottom:1rem;

color:#f4b400;

font-size:.85rem;

font-weight:700;

letter-spacing:.15em;

text-transform:uppercase;

}

.services-hero h1{

margin-bottom:1.5rem;

font-size:clamp(2.5rem,5vw,4.5rem);

line-height:1.1;

color: #ffd600;

}

.services-hero p{

font-size:1.1rem;

line-height:1.8;

color:rgba(255,255,255,.92);

}

/*==========================================================

HOW WE WORK

==========================================================*/

.how-we-work{

padding:100px 0;

background:#ffffff;

}

.work-grid{

display:grid;

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

gap:1.5rem;

}

.work-card{

position:relative;

background:#E8E9EB;

border-radius:20px;

padding:2rem 1.5rem;

text-align:center;

transition:all .3s ease;

}

.work-card:hover{

transform:translateY(-8px);

box-shadow:0 20px 40px rgba(0,0,0,.10);

}

.work-number{

position:absolute;

top:18px;

right:18px;

font-size:.85rem;

font-weight:700;

color:#f4b400;

}

.work-card i{

font-size:2.2rem;

color:#f4b400;

margin-bottom:1.2rem;

}

.work-card h3{
	
font-size:2rem;

margin-bottom:1rem;

color:#000;

}

.work-card p{

color:#000;

line-height:1.7;

}

/*==========================================================

INDUSTRIES WE SERVE

==========================================================*/

.industries-section{

padding:100px 0;

background:#ffd600;

color:#ffffff;

}

.industries-section .section-header{

text-align:center;

max-width:760px;

margin:0 auto 60px;

}

.industries-content h2{

margin-bottom:1.5rem;

font-size:clamp(2.2rem,5vw,3.8rem);

line-height:1.15;

color:#ffffff;

}

.industries-content p{

margin-bottom:2rem;

font-size:1.1rem;

line-height:1.8;

color:#000
;

}

.industries-grid{

display:grid;

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

gap:1.5rem;

}

.industry-card{

background:#000;

border:1px solid rgba(255,255,255,.08);

border-radius:20px;

padding:2rem;

text-align:center;

transition:all .3s ease;

}

.industry-card:hover{

transform:translateY(-6px);

border-color:#f4b400;

}

.industry-card i{

font-size:2.5rem;

color:#f4b400;

margin-bottom:1rem;

}

.industry-card h3{

color:#ffffff;

font-size:1.15rem;

}

.industry-card p{

color:#000;

}

/*==========================================================

RESPONSIVE

==========================================================*/

@media screen and (max-width:992px){

.work-grid{

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

}

.industries-grid{

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

}

}

@media screen and (max-width:576px){

.services-hero{

padding:120px 0 90px;

}

.services-hero p{

font-size:1rem;

}

.how-we-work,

.industries-section{

padding:80px 0;

}

.work-grid,

.industries-grid{

grid-template-columns:1fr;

}

}
/*==========================================================

CONTACT HERO BANNER

==========================================================*/

.contact-hero{

position:relative;

padding:170px 0 120px;

background:url('../images/hero/contact-hero.jpg') center/cover no-repeat;

overflow:hidden;

}

.contact-hero-overlay{

position:absolute;

inset:0;

background:linear-gradient(135deg, rgba(0,0,0,.80), rgba(0,0,0,.62));

}

.contact-hero-content{

position:relative;

z-index:2;

max-width:760px;

color:#ffffff;

}

.contact-hero h1{

margin-bottom:1.5rem;

font-size:clamp(2.6rem,5vw,4.5rem);

line-height:1.1;

color: #ffd600;

}

.contact-hero p{

margin-bottom:2rem;

font-size:1.1rem;

line-height:1.8;

color:rgba(255,255,255,.92);

}

.contact-hero-buttons{

display:flex;

gap:1rem;

flex-wrap:wrap;

}

.contact-hero-buttons .btn{

min-width:200px;

justify-content:center;

}

@media screen and (max-width:768px){

.contact-hero{

padding:140px 0 100px;

}

.contact-hero p{

font-size:1rem;

}

}

@media screen and (max-width:576px){

.contact-hero-buttons{

flex-direction:column;

}

.contact-hero-buttons .btn{

width:100%;

min-width:100%;

}

}
/*==========================================================

CONTACT INFORMATION CARDS

==========================================================*/

.contact-info-section{

position:relative;

padding:60px 0 60px;

background:#ffd600;

}

.contact-info-grid{

display:grid;

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

gap:1.5rem;

margin-top:0px;

position:relative;

z-index:5;

}

.contact-info-card{

background:#ffffff;

border-radius:22px;

padding:2rem 1.5rem;

text-align:center;

box-shadow:0 15px 40px rgba(0,0,0,.08);

border: 1px solid #ffd600;

transition:all .3s ease;

}

.contact-info-card:hover{

transform:translateY(-8px);

box-shadow:0 25px 50px rgba(0,0,0,.12);

}

.contact-info-icon{

width:72px;

height:72px;

display:flex;

align-items:center;

justify-content:center;

margin:0 auto 1.5rem;

border-radius:18px;

background:#ffd600;

color:#000;

font-size:1.8rem;

}

.contact-info-card h3{

margin-bottom:.75rem;

color:#000;

font-size:1.2rem;

}

.contact-info-card p{

color:#000;

line-height:1.7;

margin:0;

}

/*==========================================================

RESPONSIVE

==========================================================*/

@media screen and (max-width:992px){

.contact-info-grid{

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

margin-top:-40px;

}

}

@media screen and (max-width:576px){

.contact-info-section{

padding:0 0 80px;

}

.contact-info-grid{

grid-template-columns:1fr;

margin-top:-30px;

}

.contact-info-card{

padding:1.75rem 1.5rem;

}

}
/*==========================================================

QUOTE REQUEST FORM

==========================================================*/

.quote-form-section{

padding:100px 0;

background:#ffffff;

}

.quote-wrapper{

display:grid;

grid-template-columns:1fr 1.1fr;

gap:3rem;

align-items:start;

}

.quote-content h2{

margin:1rem 0 1.5rem;

font-size:clamp(2rem,4vw,3rem);

line-height:1.2;

color:#111827;

}

.quote-content p{

color:#000;

line-height:1.8;

margin-bottom:2rem;

}

.quote-features{

display:grid;

gap:1rem;

}

.quote-features div{

display:flex;

align-items:center;

gap:.75rem;

color:#111827;

font-weight:500;

}

.quote-features i{

color:#f4b400;

}

.quote-form-card{

background:#f8fafc;

border-radius:24px;

padding:2.5rem;

box-shadow:0 20px 50px rgba(0,0,0,.08);

}

.form-grid{

display:grid;

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

gap:1.25rem;

}

.form-group{

display:flex;

flex-direction:column;

}

.form-group label{

margin-bottom:.6rem;

font-weight:600;

color:#111827;

}

.form-group input,

.form-group select,

.form-group textarea{

width:100%;

padding:1rem 1rem;

border:1px solid #e5e7eb;

border-radius:14px;

background:#ffffff;

font-size:1rem;

color:#111827;

transition:all .3s ease;

}

.form-group input:focus,

.form-group select:focus,

.form-group textarea:focus{

outline:none;

border-color:#f4b400;

box-shadow:0 0 0 4px rgba(244,180,0,.15);

}

.form-group textarea{

resize:vertical;

}

.full-width{

grid-column:1 / -1;

}

.quote-submit{

width:100%;

margin-top:1.5rem;

padding:1rem 1.5rem;

font-size:1rem;

font-weight:700;

}

/*==========================================================

RESPONSIVE

==========================================================*/

@media screen and (max-width:992px){

.quote-wrapper{

grid-template-columns:1fr;

}

}

@media screen and (max-width:576px){

.quote-form-section{

padding:80px 0;

}

.quote-form-card{

padding:1.75rem;

}

.form-grid{

grid-template-columns:1fr;

}

.full-width{

grid-column:auto;

}

}
/*==========================================================

GOOGLE MAP SECTION

==========================================================*/

.map-section{

padding:100px 0;

background:#f8fafc;

}

.map-section .section-header{

text-align:center;

max-width:760px;

margin:0 auto 50px;

}

.map-wrapper{

border-radius:24px;

overflow:hidden;

box-shadow:0 20px 50px rgba(0,0,0,.12);

}

.map-wrapper iframe{

display:block;

width:100%;

}

@media screen and (max-width:576px){

.map-section{

padding:80px 0;

}

.map-wrapper iframe{

height:350px;

}

}
select.form-control {

cursor: pointer;

}
/*==========================================================

PRODUCT HERO SECTION

==========================================================*/
.products-hero{

position:relative;

min-height:360px;

display:flex;

align-items:center;

background:url('../images/products-hero.jpg') center center/cover no-repeat;

overflow:hidden;

}

.products-hero-overlay{

position:absolute;

inset:0;

background:linear-gradient(90deg, rgba(0,0,0,.88) 0%, rgba(0,0,0,.72) 45%, rgba(0,0,0,.35) 100%);

}

.products-hero-content{

position:relative;

z-index:2;

max-width:620px;

color:#fff;

}
.hero-subtitle{

display:inline-block;

margin-bottom:1rem;

color:#f4b400;

font-weight:700;

letter-spacing:2px;

}

.products-hero-content h1{

font-size:clamp(3.5rem, 6vw, 2rem);

line-height:1.05;

margin-bottom:1.5rem;

font-weight:800;

color: #ffd600;

}

.products-hero-content p{

font-size:1.1rem;

line-height:1.8;

color:#e5e7eb;

}
@media (max-width:768px){

.products-hero{

min-height:500px;

padding:2rem 0;

}

.products-hero-content h1{

font-size:2.3rem;

}

.products-hero-content p{

font-size:1rem;

}

}
.product-categories{

padding:5rem 0;

background:#fff;

}

.section-header{

text-align:center;

margin-bottom:3rem;

}

.section-header h2{

font-size:2.5rem;

color:#000;

margin:1rem 0;

padding-bottom: 10px;

}

.section-header p{

color:#000;

font-size:1.1rem;

}

.categories-grid{

display:grid !important;

grid-template-columns:repeat(auto-fit, minmax(150px,1fr)) !important;

gap:1rem !important;

align-items:stretch;

}
.category-card{

background:#fff;

border:1px solid #e5e7eb;

border-radius:18px;

padding:1.25rem;

text-align:center;

text-decoration:none;

transition:all .3s ease;

width:100%;

display:flex;

flex-direction:column;

justify-content:space-between;

}

.category-card:hover{

transform:translateY(-6px);

box-shadow:0 12px 30px rgba(0,0,0,.12);

border-color:#ffd600;

}

.category-image img{

width:100%;

height:120px;

object-fit:contain;

}

.category-card h3{

color:#111827;

font-size:0.85rem;

margin:1rem 0 .75rem;

}

.category-arrow{

color:#111827;

font-size:1.5rem;

font-weight:700;

}
@media (max-width:1200px){

.categories-grid{

grid-template-columns:repeat(4, minmax(0, 1fr)) !important;

}

}

@media (max-width:768px){

.categories-grid{

grid-template-columns:repeat(2, minmax(0, 1fr)) !important;

}

}

.section-header h2{

font-size:2rem;

}

}
.quote-cart{

position:relative;

display:flex;

align-items:center;

gap:.55rem;

padding:.75rem 1rem;

border-radius:14px;

background:#111827;

color:#ffffff;

text-decoration:none;

font-weight:700;

letter-spacing:.5px;

transition:all .25s ease;

margin-left:1rem;

}

.quote-cart:hover{

background:#fff;

color:#ffd600;

transform:none;

}

.quote-cart i{

font-size:1.1rem;

}

.quote-label{

font-size:.9rem;

}

.quote-count{

position:absolute;

top:30px;

right:40px;

width:24px;

height:24px;

border-radius:50%;

background:#ffd600;

color:#111827;

font-size:.75rem;

font-weight:800;

display:flex;

align-items:center;

justify-content:center;

}
@media (max-width:768px){

.quote-cart{

padding:.65rem .85rem;

gap:.45rem;

}

.quote-label{

font-size:.8rem;

}

.quote-count{

position:absolute;

top:30px;

right:60px;

width:24px;

height:24px;

border-radius:50%;

background:#ffd600;

color:#111827;

font-size:.75rem;

font-weight:800;

display:flex;

align-items:center;

justify-content:center;

}

}

/* ==========================================

PRODUCTS DROPDOWN MENU

========================================== */

.has-dropdown{

position:relative;

}

.dropdown-menu{

position:absolute;

top:100%;

left:0;

min-width:280px;

background:#000;

border-radius:0px;

padding:.75rem 0;

box-shadow:0 15px 35px rgba(0,0,0,.12);

border:none;

opacity:0;

visibility:hidden;

transform:translateY(10px);

transition:all .25s ease;

z-index:1000;

}

.has-dropdown:hover .dropdown-menu{

opacity:1;

visibility:visible;

transform:translateY(0);

}

.dropdown-menu li{

list-style:none !important;

margin-left:20px !important;

margin-top:10px !important;

padding:0 !important;

}

.dropdown-menu a{

display:flex;

align-items:center;

padding:.4rem 1rem;

color:#FFF;

text-decoration:none;

font-size:.95rem;

font-weight:600;

transition:all .2s ease;

}

.dropdown-menu a:hover{

background:#333;

color:#f4b400;

border-bottom: #ffd600;

padding-left:1.5rem;

}

.has-dropdown > a i{

margin-left:.4rem;

font-size:.75rem;

}

@media (max-width:768px){

.dropdown-menu{

position:static;

opacity:1;

visibility:visible;

transform:none;

box-shadow:none;

border:none;

background:#f8fafc;

margin-top:.5rem;

display:none;

}

.has-dropdown.active .dropdown-menu{

display:block;

}

}
/* ==========================================

QUOTE NOTIFICATION

========================================== */
.quote-notification{

position:fixed;

top:90px;

right:20px;

background:#111827;

color:#fff;

padding:1rem 1.25rem;

border-radius:14px;

display:flex;

align-items:center;

gap:.75rem;

transform:translateX(120%);

transition:transform .3s ease;

z-index:9999;

}

.quote-notification.show{

transform:translateX(0);

}
/* ==========================================

FEATURED PRODUCTS

========================================== */
.featured-products{

padding:1rem 0;

background:#f3f3f3;

}

.section-header.left{

text-align:left;

}

.products-grid{

display:grid;

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

gap:1.5rem;

margin-top:3rem;

}

.product-card{

background:#fff;

border-radius:12px;

overflow:hidden;

box-shadow:0 8px 25px rgba(0,0,0,.06);

transition:all .3s ease;

border: 1px solid #ffd600;

padding:0 !important;

margin:0 !important;

}

.product-card:hover{

transform:translateY(-8px);

box-shadow:0 20px 40px rgba(0,0,0,.12);

}
.product-image img{

display:block;

width:100%;

height:220px;

object-fit:cover;

margin:0 !important;

padding:0 !important;

}

.product-content{

padding:0 1.25rem 1.25rem !important;

margin:0 !important;

}

.product-category{

display:inline-block;

background:#fff;

color:#b45309;

padding:0 .65rem;

border-radius:999px;

font-size:.72rem;

font-weight:700;

margin:0;

}

.product-content h3{

color:#000;

font-size:1.15rem;

line-height:1.3;

margin:0 0 .6rem;

}

.product-content p{

color:#6b7280;

line-height:1.7;

margin-bottom:1.5rem;

}
.add-quote-btn{

width:100%;

display:flex;

align-items:center;

justify-content:center;

gap:.6rem;

background:#000;

color:#ffd600;

border:none;

padding:1rem;

border-radius:12px;

font-weight:700;

cursor:pointer;

transition:all .25s ease;

}

.add-quote-btn:hover{

background:#ffd600;

color: #000;

transform:translateY(-2px);

}
@media (max-width:1200px){

.products-grid{

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

}

}

@media (max-width:768px){

.products-grid{

grid-template-columns:1fr;

}

.product-content{

padding:1rem 1.25rem 1.25rem;

}

.product-content h3{

font-size:1.05rem;

line-height:1.35;

}

}

/* ==========================================

VIEW ALL BUTTON

========================================== */
.view-all-btn{

display:inline-flex;

align-items:center;

gap:.6rem;

margin-top:1rem;

padding:.9rem 1.4rem;

background:#ffd600;

color:#000;

border-radius:12px;

text-decoration:none;

font-weight:700;

transition:all .25s ease;

}

.view-all-btn:hover{

background:#000;

color:#fff;

transform:translateY(-2px);

}

.view-all-btn i{

transition:transform .25s ease;

}

.view-all-btn:hover i{

transform:translateX(3px);

}
.separator {
  border: none;
  border-top: 1px solid #999;
  margin-top: 10px;
  margin-bottom: 0;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
}
.trust-features-bar{

padding:3rem 0;

background:#000000;

}

.trust-features-content{

display:flex;

flex-direction:column;

gap:2rem;

}

.trust-features-list{

display:grid;

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

gap:1rem;

}

.trust-item{

display:flex;

align-items:center;

gap:.75rem;

padding:1rem;

border:1px solid #ffd600;

border-radius:14px;

color:#ffffff;

font-weight:600;

}

.trust-item i{

color:#ffd600;

font-size:1.2rem;

}
.trust-cta{

position:relative;

overflow:hidden;

display:flex;

align-items:center;

justify-content:space-between;

gap:2rem;

padding:2rem;

border-radius:20px;

border:1px solid #ffd600;

background:url('../images/cta/cta-bg.jpg') center/cover no-repeat;

}

.trust-cta::before{

content:'';

position:absolute;

inset:0;

background:linear-gradient(135deg, rgba(0,0,0,.78), rgba(0,0,0,.60));

}

.trust-cta-text,

.trust-cta-btn{

position:relative;

z-index:1;

}

.trust-cta-text h3{

color:#ffffff;

font-size:1.5rem;

margin-bottom:.5rem;

}

.trust-cta-text p{

color:#fff;

line-height:1.7;

}

.trust-cta-btn{

display:inline-flex;

align-items:center;

gap:.6rem;

padding:1rem 1.5rem;

background:#ffd600;

color:#000;

border-radius:14px;

text-decoration:none;

font-weight:700;

white-space:nowrap;

transition:all .25s ease;

}

.trust-cta-btn:hover{

background:#f4b400;

transform:translateY(-2px);

color: #fff;

}
@media (max-width:992px){

.trust-features-list{

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

}

.trust-cta{

flex-direction:column;

align-items:flex-start;

}

}

@media (max-width:576px){

.trust-features-list{

grid-template-columns:1fr;

}

.trust-cta-btn{

width:100%;

justify-content:center;

}

}
.rfq-hero{

padding:7rem 0 4rem;

background:#ffd600;

color:#fff;

text-align:center;

}

.rfq-hero-content p {
	
color: #000;
}

.rfq-page{

padding:4rem 0;

background:#f8fafc;

}

.rfq-layout{

display:grid;

grid-template-columns:1.2fr .8fr;

gap:2rem;

}

.rfq-products-panel,

.rfq-form-panel{

background:#fff;

border-radius:20px;

padding:2rem;

box-shadow:0 10px 30px rgba(0,0,0,.06);

}
.rfq-panel-header{

display:flex;

justify-content:space-between;

align-items:center;

margin-bottom:1.5rem;

padding-bottom:1rem;

border-bottom:1px solid #e5e7eb;

}

.rfq-form-panel form{

display:flex;

flex-direction:column;

gap:1rem;

}

.rfq-form-panel input,

.rfq-form-panel textarea{

width:100%;

padding:1rem;

border:1px solid #d1d5db;

border-radius:12px;

}

.rfq-submit-btn{

width:100%;

padding:1rem;

font-size:1rem;

font-weight:700;

}
.rfq-item{

display:flex;

gap:1rem;

padding:1rem 0;

border-bottom:1px solid #e5e7eb;

}

.rfq-item img{

width:90px;

height:90px;

object-fit:cover;

border-radius:12px;

}

.rfq-item-info{

flex:1;

}

.rfq-item-info h4{

margin-bottom:.35rem;

color:#111827;

}

.rfq-item-info p{

color:#000;

font-size:.9rem;

margin-bottom:.75rem;

}

.rfq-item-qty{

display:flex;

align-items:center;

gap:.5rem;

}

.rfq-item-qty input{

width:70px;

padding:.45rem;

border:1px solid #d1d5db;

border-radius:8px;

text-align:center;

}
@media (max-width:992px){

.rfq-layout{

grid-template-columns:1fr;

}

}
.rfq-remove-btn{

width:38px;

height:38px;

border:none;

border-radius:10px;

background:#ef4444;

color:#fff;

cursor:pointer;

transition:all .25s ease;

}

.rfq-remove-btn:hover{

background:#dc2626;

transform:translateY(-2px);

}
.rfq-success {

margin-top: 1rem;

padding: 1.25rem;

border-radius: 14px;

text-align: center;

background: #ecfdf5;

border: 1px solid #10b981;

color: #065f46;

}

.rfq-success i {

font-size: 2rem;

margin-bottom: .5rem;

color: #10b981;

}
.rfq-error {

margin-top: 1rem;

padding: 1.25rem;

border-radius: 14px;

text-align: center;

background: #fef2f2;

border: 1px solid #ef4444;

color: #991b1b;

}

.rfq-error i {

font-size: 1.5rem;

margin-bottom: .5rem;

color: #ef4444;

}
.category-hero{

position:relative;

min-height:420px;

display:flex;

align-items:center;

}

.category-hero-overlay{

width:100%;

background:linear-gradient(135deg, rgba(0,0,0,.78), rgba(0,0,0,.55));

padding:100px 0;

}

.category-breadcrumb{

display:flex;

align-items:center;

gap:.5rem;

margin-bottom:2rem;

color:rgba(255,255,255,.8);

}

.category-breadcrumb a{

color:#fbbf24;

text-decoration:none;

}

.category-tag{

display:inline-block;

background:#fbbf24;

color:#111827;

padding:.4rem 1rem;

border-radius:999px;

font-weight:700;

margin-bottom:1rem;

}

.category-hero-content h1{

font-size:3rem;

color:#fff;

margin-bottom:1rem;

}

.category-hero-content p{

color:rgba(255,255,255,.9);

max-width:680px;

line-height:1.7;

margin-bottom:2rem;

}

.category-hero-actions{

display:flex;

gap:1rem;

flex-wrap:wrap;

}
.category-overview{

padding:70px 0;

background:#f8fafc;

}

.overview-grid{

display:grid;

grid-template-columns:repeat(auto-fit,minmax(220px,1fr));

gap:1.5rem;

}

.overview-card{

background:#fff;

padding:2rem;

border-radius:18px;

text-align:center;

box-shadow:0 10px 30px rgba(0,0,0,.05);

}

.overview-card i{

font-size:2rem;

color:#fbbf24;

margin-bottom:1rem;

}

.overview-card h3{

margin-bottom:.5rem;

}

.overview-card p{

color:#64748b;

margin:0;

}
.subcategory-filter{

padding:30px 0;

border-bottom:1px solid #e5e7eb;

}

.filter-buttons{

display:flex;

flex-wrap:wrap;

gap:.75rem;

}

.filter-btn{

padding:.8rem 1.2rem;

border:1px solid #d1d5db;

background:#fff;

border-radius:999px;

font-weight:600;

cursor:pointer;

transition:.3s ease;

}

.filter-btn:hover{

border-color:#fbbf24;

color:#111827;

}

.filter-btn.active{

background:#111827;

color:#fff;

border-color:#111827;

}
.product-specs{

display:flex;

flex-wrap:wrap;

gap:.5rem;

margin:1rem 0 1.25rem;

}

.product-specs span{

background:#f3f4f6;

color:#374151;

padding:.35rem .75rem;

border-radius:999px;

font-size:.85rem;

font-weight:600;

}
.technical-highlights{

padding:80px 0;

background:#fff;

}

.tech-grid{

display:grid;

grid-template-columns:repeat(auto-fit,minmax(240px,1fr));

gap:1.5rem;

}

.tech-item{

background:#f8fafc;

padding:1.75rem;

border-radius:18px;

border:1px solid #e5e7eb;

}

.tech-item h4{

margin-bottom:.75rem;

color:#111827;

}

.tech-item p{

color:#64748b;

margin:0;

line-height:1.6;

}
.category-cta{

padding:80px 0;

}

.category-cta-box{

background:#050505;

color:#fff;

border-radius:24px;

padding:3rem;

display:flex;

justify-content:space-between;

align-items:center;

gap:2rem;

flex-wrap:wrap;

}

.category-cta-box h2{

color:#fff;

margin-bottom:.75rem;

}

.category-cta-box p{

color:rgba(255,255,255,.8);

margin:0;

}

.cta-actions{

display:flex;

gap:1rem;

flex-wrap:wrap;

}
@media (max-width:768px){

.category-hero-content h1{

font-size:2.2rem;

}

.category-cta-box{

padding:2rem;

text-align:center;

}

.cta-actions{

width:100%;

justify-content:center;

}

}