/* ==========================================================================
   NOORANI STEEL — DARK METALLIC / GOLD FORGED-STEEL THEME
   Loaded LAST. Overrides base theme + premium-enhancements to deliver:
   black/graphite metallic backgrounds, subtle steel texture, restrained
   metallic-gold accents, clean white typography.
   ========================================================================== */

:root{
  /* core surfaces — deeper, truer black (Dubai-trading-house feel) */
  --mt-jet:#040404;          /* page background */
  --mt-charcoal:#0c0c0d;     /* section background */
  --mt-graphite:#141415;     /* card background */
  --mt-graphite-2:#1d1d1f;   /* elevated / hover card */
  --mt-steel-line:rgba(255,255,255,0.09);
  --mt-steel-line-soft:rgba(255,255,255,0.055);

  /* metallic gold — sharper, brighter, classic bullion gold */
  --mt-gold:#d4af37;
  --mt-gold-bright:#f8e39b;
  --mt-gold-deep:#9c7a1a;
  --mt-gold-grad:linear-gradient(135deg,#9c7a1a 0%,#d4af37 25%,#f8e39b 50%,#d4af37 75%,#9c7a1a 100%);

  /* type */
  --mt-white:#f7f6f2;
  --mt-ash:#adadb2;
  --mt-ash-dim:#828288;

  /* premium spacing scale */
  --mt-space-lg:110px;
  --mt-space-md:70px;

  /* map premium-enhancements.js/css vars onto the new palette */
  --ns-navy:#0c0c0d;
  --ns-navy-2:#040404;
  --ns-gold:#d4af37;
  --ns-gold-2:#9c7a1a;
  --ns-glass:rgba(4,4,4,0.8);
}

/* ---------------------------------------------------------------------- */
/* BASE / STEEL TEXTURE                                                   */
/* ---------------------------------------------------------------------- */
html, body{ background:var(--mt-jet) !important; }
body{
  color:var(--mt-ash) !important;
  background-image:
    repeating-linear-gradient(115deg, rgba(255,255,255,0.012) 0px, rgba(255,255,255,0.012) 1px, transparent 1px, transparent 3px),
    radial-gradient(ellipse at top, rgba(255,255,255,0.05), transparent 55%) !important;
  background-attachment:fixed !important;
}
a{ color:inherit; }
::selection{ background:var(--mt-gold); color:#0a0a0b; }

/* generic light-surface resets seen across the theme */
.preloader{ background-color:var(--mt-jet) !important; }

/* ---------------------------------------------------------------------- */
/* HEADER                                                                  */
/* ---------------------------------------------------------------------- */
.main-header .header-top{ background-color:var(--mt-jet) !important; border-bottom:1px solid var(--mt-steel-line-soft); }
.main-header .header-top .top-left .text:before{ background-color:var(--mt-jet) !important; }
.main-header .header-top .info-list li,
.main-header .header-top .info-list li a,
.main-header .header-top .top-left .text{ color:var(--mt-ash) !important; }
.main-header .header-top .info-list li .icon,
.main-header .header-top .info-list li a:hover .txt{ color:var(--mt-gold) !important; }

.main-header .header-upper{ background-color:var(--mt-charcoal) !important; border-bottom:1px solid var(--mt-steel-line-soft); }
.main-menu .navigation > li > a,
.sticky-header .main-menu .navigation > li > a{ color:var(--mt-white) !important; }
.main-menu .navigation > li > a:hover,
.main-menu .navigation > li.current > a,
.sticky-header .main-menu .navigation > li:hover > a{ color:var(--mt-gold) !important; }
.main-menu .navigation > li > ul,
.main-menu .navigation > li > ul > li{ background-color:var(--mt-graphite) !important; border-color:var(--mt-steel-line) !important; }
.main-menu .navigation > li > ul > li > a{ color:var(--mt-ash) !important; }
.main-menu .navigation > li > ul > li:hover > a{ color:var(--mt-gold) !important; background-color:var(--mt-graphite-2) !important; }
.main-header .search-box-btn{ color:var(--mt-white) !important; }
.sticky-header.ns-scrolled{ background:rgba(10,10,11,0.9) !important; }

.rev-burger span{ background:var(--mt-white) !important; }

/* ---------------------------------------------------------------------- */
/* SECTION TITLES                                                          */
/* ---------------------------------------------------------------------- */
.sec-title h2, .sec-title h3{
  background:none !important; -webkit-text-fill-color:var(--mt-white) !important; color:var(--mt-white) !important;
}
.sec-title .text{ color:var(--mt-ash) !important; }
.sec-title h2:before, .sec-title h2:after,
.sec-title h3:before, .sec-title h3:after{ background-color:var(--mt-gold) !important; }

/* ---------------------------------------------------------------------- */
/* BUTTONS — restrained gold: outline by default, gold fill on hover      */
/* ---------------------------------------------------------------------- */
.theme-btn, .btn-style-one, .btn-style-two{
  background:transparent !important;
  border:1.5px solid var(--mt-gold) !important;
  color:var(--mt-gold) !important;
  box-shadow:none !important;
}
.theme-btn:hover, .btn-style-one:hover, .btn-style-two:hover{
  background:var(--mt-gold-grad) !important;
  color:#171308 !important;
  border-color:var(--mt-gold-bright) !important;
}
.theme-btn:hover *, .btn-style-one:hover *, .btn-style-two:hover *{ color:#171308 !important; }
/* primary submit-style CTAs stay solid so the single main action still reads clearly */
.contact-form-wrap .submit-btn{
  background:var(--mt-gold-grad) !important;
  color:#171308 !important;
  border:none !important;
}
.contact-form-wrap .submit-btn:hover{ filter:brightness(1.08); background:var(--mt-gold-grad) !important; }

/* ---------------------------------------------------------------------- */
/* SERVICE / VALUE CARDS                                                   */
/* ---------------------------------------------------------------------- */
.services-block .inner-box{
  background-color:var(--mt-graphite) !important;
  border-bottom:3px solid var(--mt-gold) !important;
}
.services-block .inner-box:before{ background-color:var(--mt-charcoal) !important; }
.services-block .inner-box:hover{ border-color:var(--mt-gold-bright) !important; }
.services-block .inner-box .icon-box{ color:var(--mt-gold) !important; }
.services-block .inner-box h3, .services-block .inner-box h3 a{ color:var(--mt-white) !important; }
.services-block .inner-box .text{ color:var(--mt-ash) !important; }
/*.services-block .inner-box .arrow{ color:var(--mt-gold) !important; }*/
.services-block .inner-box .arrow{color: #000;}
.services-block .inner-box:hover .arrow{ background-color:var(--mt-gold) !important; color:#171308 !important; }

.services-section-two .inner-container{ background-color:var(--mt-charcoal) !important; }

/* CTA quote banners (used repeatedly per product page) — graphite w/ gold trim, not solid gold */
.quote-section .inner-section{
  background-color:var(--mt-graphite) !important;
  border:1px solid var(--mt-steel-line) !important;
  border-left:4px solid var(--mt-gold) !important;
}
.quote-section .content .icon,
.quote-section .content h3,
.quote-section .content .text{ color:var(--mt-white) !important; }
.quote-section .content .icon{ color:var(--mt-gold) !important; }

/* ---------------------------------------------------------------------- */
/* CLIENTS / TESTIMONIALS / NEWS                                           */
/* ---------------------------------------------------------------------- */
.clients-section{ background-color:var(--mt-charcoal) !important; }
.testimonial-block .inner-box .text,
.testimonial-block .inner-box h3,
.testimonial-block .inner-box .location{ color:var(--mt-white) !important; }
.testimonial-block .inner-box .image-outer .quote{ color:var(--mt-gold) !important; }
.testimonial-block-one .upper{ background:var(--mt-graphite) !important; }
.testimonial-block-one .upper:before{ border-top-color:var(--mt-graphite) !important; }
.testimonial-block-one .upper .icon{ color:var(--mt-gold) !important; }
.testimonial-block-one .lower .name, .testimonial-block-one .lower .location{ color:var(--mt-white) !important; }

.news-section{ background-color:var(--mt-jet) !important; }
.news-block .inner-box .lower-content,
.news-block-two .inner-box .lower-content{ background-color:var(--mt-graphite) !important; }
.news-block .inner-box .lower-content h3 a,
.news-block-two .inner-box .lower-content h3 a{ color:var(--mt-white) !important; }
.news-block .inner-box .lower-content h3:after,
.news-block-two .inner-box .lower-content h3:after{ background-color:var(--mt-gold) !important; }
.news-block .inner-box .lower-content .arrow,
.news-block-two .inner-box .lower-content .arrow{ background-color:var(--mt-gold) !important; color:#171308 !important; }

/* ---------------------------------------------------------------------- */
/* COUNTERS / FACT BLOCKS                                                   */
/* ---------------------------------------------------------------------- */
.innovation-section .content-column .inner-column .counter-box,
.fact-counter, .services-detail .inner-box .lower-content .fact-counter,
.about-section-two .fact-counter{
  background-color:var(--mt-graphite) !important;
  box-shadow:0 0 35px rgba(0,0,0,0.5) !important;
}
.fact-counter .count-outer, .fact-counter .count-outer .count-text{ color:var(--mt-gold) !important; }
.fact-counter .column .counter-title{ color:var(--mt-white) !important; }
.innovation-section .content-column .bold-text{ color:var(--mt-white) !important; }
.innovation-section .content-column .text{ color:var(--mt-ash) !important; }

/* ---------------------------------------------------------------------- */
/* PROJECTS / FACTORY / SKILL                                              */
/* ---------------------------------------------------------------------- */
.projects-section .projects-carousel .image-carousel .content-column h3{ color:var(--mt-white) !important; }
.projects-section .projects-carousel .image-carousel .content-column .title,
.projects-section .projects-carousel .image-carousel .content-column .text{ color:var(--mt-ash) !important; }
.projects-section .projects-carousel .image-carousel .content-column .read-more{ color:var(--mt-gold) !important; }
.projects-section .projects-carousel .image-carousel .content-column .read-more i{ color:var(--mt-gold) !important; }

.factory-section .title-box h2{ color:var(--mt-white) !important; }
.factory-section .title-box .text{ color:var(--mt-ash) !important; }

.skill-section:before{ background-color:rgba(10,10,11,0.75) !important; }
.skill-section .skill-column h2{ color:var(--mt-white) !important; }
.skill-section .skill-column h2:before{ background-color:var(--mt-gold) !important; }
.skills .skill-item .skill-bar{ background-color:rgba(255,255,255,0.08) !important; }
.skills .skill-item .skill-bar .bar-inner .bar{ background:var(--mt-gold-grad) !important; }

/* ---------------------------------------------------------------------- */
/* FOOTER                                                                    */
/* ---------------------------------------------------------------------- */
.main-footer{ background-color:var(--mt-jet) !important; border-top:1px solid var(--mt-steel-line-soft); }
.main-footer .footer-widget h2{ color:var(--mt-white) !important; }
.main-footer .footer-widget h2:before{ background-color:var(--mt-gold) !important; }
.main-footer .about-widget .text,
.main-footer .contact-widget ul li,
.main-footer .footer-bottom .copyright{ color:var(--mt-ash) !important; }
.main-footer .contact-widget .number{ color:var(--mt-gold) !important; }
.main-footer .contact-widget ul li a:hover,
.main-footer .footer-bottom .social-links li a:hover{ color:var(--mt-gold) !important; }
.main-footer .footer-bottom{ border-top:1px solid var(--mt-steel-line-soft) !important; }

/* ---------------------------------------------------------------------- */
/* INNER PAGE HERO (embedded style block colours realigned via variables) */
/* ---------------------------------------------------------------------- */
.inner-page-hero{
  background:linear-gradient(135deg, var(--mt-jet) 0%, var(--mt-charcoal) 50%, var(--mt-jet) 100%) !important;
}
.inner-page-hero .breadcrumb-box a{ color:var(--mt-gold) !important; }

/* ---------------------------------------------------------------------- */
/* CUSTOM PAGE SECTIONS (about / product / contact / faq / quote / compare)*/
/* ---------------------------------------------------------------------- */
.about-page-section, .product-detail-section, .contact-page-section,
.quote-page-section, .product-comparison{ background:var(--mt-jet) !important; }
.about-page-section .about-text{ color:var(--mt-ash) !important; }

.about-mission-box{ background:var(--mt-graphite) !important; border-left:4px solid var(--mt-gold) !important; }
.about-mission-box h4{ color:var(--mt-gold) !important; }
.about-mission-box p{ color:var(--mt-ash) !important; }

.about-values{ background:var(--mt-charcoal) !important; }
.value-box{ background:var(--mt-graphite) !important; box-shadow:0 5px 25px rgba(0,0,0,0.45) !important; border:1px solid var(--mt-steel-line-soft); }
.value-box .icon{ color:var(--mt-gold) !important; }
.value-box h4{ color:var(--mt-white) !important; }
.value-box p{ color:var(--mt-ash) !important; }

.team-member-box .member-img{ background:var(--mt-graphite-2) !important; border-color:var(--mt-gold) !important; }
.team-member-box h5{ color:var(--mt-white) !important; }
.team-member-box span{ color:var(--mt-gold) !important; }

.about-stats-bar{ background:linear-gradient(135deg, var(--mt-charcoal), var(--mt-jet)) !important; border-top:1px solid var(--mt-steel-line-soft); border-bottom:1px solid var(--mt-steel-line-soft); }
.stat-item-ab .number{ color:var(--mt-gold) !important; }

.product-spec-table th{ background:var(--mt-graphite-2) !important; color:var(--mt-white) !important; }
.product-spec-table td{ color:var(--mt-ash) !important; border-bottom-color:var(--mt-steel-line-soft) !important; }
.product-spec-table tr:nth-child(even) td{ background:var(--mt-graphite) !important; }
.product-spec-table{ box-shadow:0 3px 15px rgba(0,0,0,0.5) !important; }

.product-highlight-bar{
  background:var(--mt-graphite) !important;
  border:1px solid var(--mt-steel-line);
  border-left:4px solid var(--mt-gold) !important;
  color:var(--mt-white) !important;
}
.product-highlight-bar h5{ color:var(--mt-gold) !important; }

.use-item{ background:var(--mt-graphite) !important; }
.use-item .use-icon{ background:var(--mt-jet) !important; color:var(--mt-gold) !important; border:1px solid var(--mt-steel-line); }
.use-item h6{ color:var(--mt-white) !important; }
.use-item p{ color:var(--mt-ash) !important; }

.contact-info-card{ background:linear-gradient(135deg, var(--mt-graphite), var(--mt-jet)) !important; border:1px solid var(--mt-steel-line); }
.contact-info-card h3{ color:var(--mt-gold) !important; }
.contact-info-item .ci-icon{ background:rgba(201,162,75,0.14) !important; color:var(--mt-gold) !important; }
.contact-info-item .ci-text h5{ color:rgba(255,255,255,0.55) !important; }
.contact-info-item .ci-text a, .contact-info-item .ci-text p{ color:var(--mt-white) !important; }

.contact-form-wrap{ background:var(--mt-graphite) !important; border:1px solid var(--mt-steel-line); }
.contact-form-wrap h3{ color:var(--mt-white) !important; }
.contact-form-wrap label{ color:var(--mt-ash) !important; }
.contact-form-wrap input, .contact-form-wrap select, .contact-form-wrap textarea{
  background:rgba(255,255,255,0.04) !important;
  border-color:var(--mt-steel-line) !important;
  color:var(--mt-white) !important;
}
.contact-form-wrap input:focus, .contact-form-wrap select:focus, .contact-form-wrap textarea:focus{ border-color:var(--mt-gold) !important; }

.map-placeholder{ background:var(--mt-graphite) !important; color:var(--mt-ash-dim) !important; border:1px dashed var(--mt-steel-line); }
.map-placeholder .fa{ color:var(--mt-gold) !important; }

.faq-question{ background:var(--mt-graphite) !important; color:var(--mt-white) !important; border-color:var(--mt-steel-line) !important; }
.faq-question:hover{ background:var(--mt-graphite-2) !important; }
.faq-question .faq-toggle{ color:var(--mt-gold) !important; }
.faq-answer{ background:var(--mt-charcoal) !important; color:var(--mt-ash) !important; border-color:var(--mt-steel-line) !important; }
.faq-item{ border-color:var(--mt-steel-line) !important; }

.quote-process-steps{ background:var(--mt-charcoal) !important; }
.step-item .step-num{ background:var(--mt-gold-grad) !important; color:#171308 !important; }
.step-item h5{ color:var(--mt-white) !important; }
.step-item p{ color:var(--mt-ash) !important; }

.compare-table{ box-shadow:0 5px 25px rgba(0,0,0,0.5) !important; }
.compare-table th{ background:var(--mt-graphite-2) !important; color:var(--mt-white) !important; }
.compare-table td{ color:var(--mt-ash) !important; border-bottom-color:var(--mt-steel-line-soft) !important; }
.compare-table td:first-child{ color:var(--mt-white) !important; }
.compare-table tr:nth-child(even) td{ background:var(--mt-graphite) !important; }

.form-success{ background:rgba(90,180,120,0.15) !important; color:#8fe0a8 !important; border-color:rgba(90,180,120,0.35) !important; }

/* ---------------------------------------------------------------------- */
/* WHATSAPP / SCROLL-TOP / CURSOR-GLOW / FORM-FOCUS                        */
/* premium-enhancements.js hardcodes a few rgba(245,166,35,..) glows that  */
/* don't route through the --ns-gold var — recolour them to metallic gold */
/* ---------------------------------------------------------------------- */
.ns-wa-tooltip{ background:var(--mt-graphite) !important; }
.ns-wa-tooltip::after{ border-color:transparent transparent transparent var(--mt-graphite) !important; }
.theme-btn:hover{ box-shadow:0 14px 30px -8px rgba(201,162,75,0.45) !important; }
.scroll-to-top{ box-shadow:0 8px 22px rgba(201,162,75,0.35) !important; }
.scroll-to-top:hover{ box-shadow:0 12px 28px rgba(201,162,75,0.5) !important; }
.ns-cursor-glow{ border-color:rgba(201,162,75,0.85) !important; }
.ns-cursor-glow.ns-grow{ background:rgba(201,162,75,0.16) !important; }
input:focus, textarea:focus, select:focus{ box-shadow:0 0 0 3px rgba(201,162,75,0.25) !important; border-color:var(--mt-gold) !important; }

/* ---------------------------------------------------------------------- */
/* PREMIUM DUBAI-TRADING-HOUSE SPACING & TYPOGRAPHY POLISH                 */
/* Deeper black + sharper gold reads flat without extra breathing room —  */
/* widen letter-spacing on headings/labels and add generous card padding. */
/* ---------------------------------------------------------------------- */
.sec-title h2, .sec-title h3{ letter-spacing:0.5px !important; }
.sec-title .divider{ background-color:var(--mt-gold) !important; }

.value-box{ padding:45px 30px !important; }
.services-block .inner-box{ padding:65px 20px 70px !important; }
.about-mission-box{ padding:32px 38px !important; }
.contact-info-card{ padding:48px 40px !important; }
.contact-form-wrap{ padding:48px 40px !important; }
.use-item{ padding:20px !important; }
.testimonial-block-one .upper{ padding:48px 40px 88px !important; }

.theme-btn, .btn-style-one, .btn-style-two{
  letter-spacing:1.5px !important;
  text-transform:uppercase !important;
}

.main-footer .footer-widget h2{ letter-spacing:1px !important; }
.main-header .header-top .info-list li{ letter-spacing:0.3px !important; }

/* finer gold hairlines instead of thick fills — reads more "trading house" */
.sec-title h2:before, .sec-title h2:after,
.sec-title h3:before, .sec-title h3:after{ height:1px !important; }
.services-block .inner-box{ border-bottom-width:2px !important; }
.about-mission-box, .product-highlight-bar, .quote-section .inner-section{ border-left-width:3px !important; }

/* section rhythm: a touch more vertical breathing room between blocks */
.about-page-section, .about-values, .product-detail-section,
.contact-page-section, .quote-page-section, .product-comparison,
.services-section, .clients-section, .news-section{
  padding-top:var(--mt-space-md) !important;
  padding-bottom:var(--mt-space-md) !important;
}

/* ---------------------------------------------------------------------- */
/* RESPECT REDUCED MOTION (inherit) — no additional rules needed          */
/* ---------------------------------------------------------------------- */