/* ================= JR FURNACE — ARABIC SITE DESIGN SYSTEM ================= */
@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@400;600;700;800;900&family=Tajawal:wght@300;400;500;700&display=swap');

:root{
  --bg:        #F4F6FA;
  --panel:     #E8EDF4;
  --ink:       #123A63;
  --steel:     #52627A;
  --ember:     #F0791D;
  --ember-dark:#D4650D;
  --line:      #D7DFEA;
  --white:     #FFFFFF;
  --radius:    2px;
  --max:       1180px;
}

*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth; overflow-x:hidden;}
body{
  background:var(--bg);
  color:var(--ink);
  font-family:'Tajawal', sans-serif;
  line-height:1.85;
  direction:rtl;
  text-align:right;
  font-size:16px;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
  max-width:100vw;
}
h1,h2,h3,h4{
  font-family:'Cairo', sans-serif;
  font-weight:800;
  line-height:1.3;
  color:var(--ink);
}
a{color:inherit; text-decoration:none;}
img{max-width:100%; display:block;}
ul{list-style:none;}
.wrap{max-width:var(--max); margin:0 auto; padding:0 28px;}
.eyebrow{
  font-family:'Cairo',sans-serif;
  font-weight:700;
  font-size:13px;
  letter-spacing:.5px;
  color:var(--ember);
  text-transform:uppercase;
  display:flex; align-items:center; gap:10px;
  margin-bottom:14px;
}
.eyebrow::before{content:''; width:26px; height:2px; background:var(--ember); display:inline-block;}

/* ---------- Top utility bar ---------- */
.topbar{
  background:var(--ink); color:#D8D1BE; font-size:13px;
  font-family:'Cairo',sans-serif;
}
.topbar .wrap{display:flex; justify-content:space-between; align-items:center; padding:8px 28px; flex-wrap:wrap; gap:8px;}
.topbar a{color:#D8D1BE;}
.topbar .contact-line{display:flex; gap:22px; flex-wrap:wrap;}
.topbar .contact-line span{display:inline-flex; align-items:center; gap:6px;}
.topbar .lang-line{opacity:.75}

/* ---------- Header / Nav ---------- */
header.site{
  background:var(--bg);
  border-bottom:1px solid var(--line);
  position:sticky; top:0; z-index:50;
}
header.site .wrap{display:flex; align-items:center; justify-content:space-between; padding:16px 28px;}
.brand{display:flex; align-items:center; gap:12px; font-family:'Cairo',sans-serif; font-weight:900; font-size:22px;}
.brand-logo{height:44px; width:auto; display:block;}
@media(max-width:600px){ .brand-logo{height:36px;} }
.brand .mark{
  width:42px;height:42px; border:2px solid var(--ink); border-radius:50%;
  display:flex; align-items:center; justify-content:center; font-size:16px; font-weight:900;
  color:var(--ember);
}
nav.primary > ul{display:flex; gap:30px; font-family:'Cairo',sans-serif; font-weight:600; font-size:15px;}
nav.primary a{position:relative; padding:6px 0;}
nav.primary a:hover{color:var(--ember);}

/* Dropdown (Products submenu) — works for BOTH our fallback menu (.has-dropdown/.dropdown)
   AND a WordPress custom menu built in Appearance -> Menus (.menu-item-has-children/.sub-menu) */
nav.primary li.has-dropdown,
nav.primary li.menu-item-has-children{position:relative;}

nav.primary .dropdown,
nav.primary .sub-menu{
  display:none; position:absolute; top:100%; right:0; background:var(--white);
  border:1px solid var(--line); border-radius:var(--radius); min-width:220px;
  box-shadow:0 14px 30px rgba(28,26,23,.12); padding:8px 0; z-index:60;
  flex-direction:column; gap:0; list-style:none; margin:0;
}
nav.primary li.has-dropdown:hover > .dropdown,
nav.primary li.menu-item-has-children:hover > .sub-menu{display:flex;}

nav.primary .dropdown li, nav.primary .sub-menu li{width:100%;}
nav.primary .dropdown a, nav.primary .sub-menu a{display:block; padding:11px 20px; font-weight:500; font-size:14px;}
nav.primary .dropdown a:hover, nav.primary .sub-menu a:hover{background:var(--panel); color:var(--ember);}

/* Mega-menu (Products) — icon-card style like reference sites */
nav.primary li.mega .mega-menu{
  display:none; position:absolute; top:100%; right:50%; transform:translateX(50%);
  background:var(--white); border:1px solid var(--line); border-radius:var(--radius);
  box-shadow:0 20px 45px rgba(18,58,99,.16); padding:22px; z-index:60;
  width:640px; grid-template-columns:1fr 1fr; gap:4px;
}
nav.primary li.mega:hover .mega-menu{display:grid;}
.mega-item{display:flex; gap:14px; padding:14px; border-radius:var(--radius); transition:background .2s;}
.mega-item:hover{background:var(--panel);}
.mega-icon{font-size:26px; flex-shrink:0; width:44px; height:44px; background:var(--panel); border-radius:50%; display:flex; align-items:center; justify-content:center;}
.mega-item h4{font-family:'Cairo',sans-serif; font-size:14.5px; margin-bottom:4px; color:var(--ink);}
.mega-item p{font-size:12.5px; color:var(--steel); margin-bottom:6px; font-weight:400;}
.mega-link{font-family:'Cairo',sans-serif; font-weight:700; font-size:12.5px; color:var(--ember);}
.mega-item.mega-all{display:flex; align-items:center; justify-content:center; background:var(--panel); border-radius:var(--radius); text-align:center;}
.mega-link-btn{
  display:inline-block; background:var(--ember); color:#fff !important; padding:8px 16px;
  border-radius:20px; margin-top:4px;
}
@media(max-width:1100px){ nav.primary li.mega .mega-menu{width:480px;} }
.cta-btn{
  background:var(--ember); color:#fff !important; font-family:'Cairo',sans-serif; font-weight:700;
  padding:12px 26px; border-radius:var(--radius); font-size:14px; display:inline-block;
  transition:background .2s;
}
.cta-btn:hover{background:var(--ember-dark);}
.cta-outline{
  border:2px solid var(--ink); color:var(--ink) !important; font-family:'Cairo',sans-serif; font-weight:700;
  padding:10px 24px; border-radius:var(--radius); font-size:14px; display:inline-block;
}
.pdf-link{position:relative; padding-inline-start:38px !important;}
.pdf-link::before{
  content:'⬇'; position:absolute; right:16px; top:50%; transform:translateY(-50%); font-size:13px;
}
.mobile-toggle{display:none;}

/* ---------- Hero ---------- */
.hero{
  background:linear-gradient(180deg, var(--panel) 0%, var(--bg) 100%);
  border-bottom:1px solid var(--line);
  padding:70px 0 60px;
}
.hero .wrap{display:grid; grid-template-columns:1.15fr .85fr; gap:50px; align-items:center;}
.hero h1{font-size:46px; margin-bottom:22px;}
.hero h1 span{color:var(--ember);}
.hero p.lead{font-size:18px; color:var(--steel); max-width:52ch; margin-bottom:32px;}
.hero .actions{display:flex; gap:16px; flex-wrap:wrap;}
.hero .stats{display:flex; gap:0; margin-top:46px; border-top:1px solid var(--line);}
.hero .stats div{padding:18px 26px 0; border-inline-end:1px solid var(--line);}
.hero .stats div:last-child{border-inline-end:none;}
.hero .stats b{font-family:'Cairo',sans-serif; font-size:28px; display:block; color:var(--ink);}
.hero .stats span{font-size:13px; color:var(--steel);}
.hero .media{position:relative;}
.hero .media img{border-radius:var(--radius); width:100%; aspect-ratio:4/3.1; object-fit:cover;}
.hero .media .tag{
  position:absolute; bottom:-18px; right:-18px; background:var(--ink); color:#fff;
  font-family:'Cairo',sans-serif; font-weight:700; padding:14px 20px; font-size:14px; border-radius:var(--radius);
}

/* ---------- Section shell ---------- */
section{padding:78px 0;}
section.alt{background:var(--panel); border-top:1px solid var(--line); border-bottom:1px solid var(--line);}
.section-head{display:flex; justify-content:space-between; align-items:flex-end; gap:30px; margin-bottom:44px; flex-wrap:wrap;}
.section-head h2{font-size:32px; max-width:60ch;}
.section-head p{color:var(--steel); max-width:40ch; font-size:15px;}

/* ---------- Product grid ---------- */
.grid-products{display:grid; grid-template-columns:repeat(3,1fr); gap:26px;}
.pcard{
  background:var(--white); border:1px solid var(--line); border-radius:var(--radius);
  overflow:hidden; display:flex; flex-direction:column; transition:transform .2s, box-shadow .2s;
}
.pcard:hover{transform:translateY(-4px); box-shadow:0 14px 30px rgba(28,26,23,.09);}
.pcard .num{
  font-family:'Cairo',sans-serif; font-weight:900; font-size:13px; color:var(--ember);
  padding:16px 20px 0;
}
.pcard img{width:100%; height:190px; object-fit:cover;}
.pcard .body{padding:20px; display:flex; flex-direction:column; flex:1;}
.pcard h3{font-size:19px; margin-bottom:10px;}
.pcard p{color:var(--steel); font-size:14.5px; margin-bottom:18px; flex:1;}
.pcard .meta{display:flex; justify-content:space-between; font-size:13px; color:var(--steel); border-top:1px solid var(--line); padding-top:14px; margin-bottom:16px;}
.pcard .meta b{color:var(--ink); font-family:'Cairo',sans-serif;}
.pcard .link{font-family:'Cairo',sans-serif; font-weight:700; color:var(--ink); display:flex; align-items:center; gap:8px;}
.pcard .link::after{content:'←'; transition:transform .2s;}
.pcard:hover .link::after{transform:translateX(-4px);}

/* ---------- Gauge (signature element) ---------- */
.gauge-row{display:grid; grid-template-columns:repeat(4,1fr); gap:20px; margin:40px 0;}
.gauge{
  background:var(--white); border:1px solid var(--line); border-radius:var(--radius);
  padding:22px; text-align:center;
}
.gauge svg{width:100%; max-width:120px; height:auto; margin:0 auto 8px; display:block;}
.gauge .val{font-family:'Cairo',sans-serif; font-weight:900; font-size:22px;}
.gauge .lbl{font-size:12.5px; color:var(--steel); margin-top:4px;}

/* ---------- Why / features ---------- */
.feat-list{display:grid; grid-template-columns:repeat(2,1fr); gap:34px;}
.feat-item{display:flex; gap:18px;}
.feat-item .idx{
  font-family:'Cairo',sans-serif; font-weight:900; font-size:14px; color:var(--ember);
  border:2px solid var(--ember); border-radius:50%; width:38px; height:38px;
  display:flex; align-items:center; justify-content:center; flex-shrink:0;
}
.feat-item h4{font-size:17px; margin-bottom:6px;}
.feat-item p{color:var(--steel); font-size:14.5px;}

/* ---------- Milestones (About page journey) ---------- */
.milestone-row{display:grid; grid-template-columns:repeat(4,1fr); gap:24px; margin-top:20px;}
.milestone{
  background:var(--white); border:1px solid var(--line); border-radius:var(--radius); padding:26px 20px;
  text-align:center; border-top:3px solid var(--ember);
}
.milestone b{display:block; font-family:'Cairo',sans-serif; font-weight:900; font-size:24px; color:var(--ink); margin-bottom:8px;}
.milestone span{font-size:13.5px; color:var(--steel); line-height:1.6;}
@media(max-width:960px){ .milestone-row{grid-template-columns:1fr 1fr;} }
@media(max-width:600px){ .milestone-row{grid-template-columns:1fr;} }

/* ---------- Certification strip ---------- */
.cert-strip{display:flex; gap:40px; flex-wrap:wrap; justify-content:space-between; align-items:center; padding:30px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line);}
.cert-strip div{font-family:'Cairo',sans-serif; font-weight:800; font-size:15px; color:var(--steel); letter-spacing:.5px;}

/* ---------- Specs table ---------- */
.spec-table{width:100%; border-collapse:collapse; margin:26px 0;}
.spec-table tr{border-bottom:1px solid var(--line);}
.spec-table td{padding:16px 4px; font-size:15px;}
.spec-table td:first-child{color:var(--steel); width:38%; font-family:'Cairo',sans-serif; font-weight:600;}
.spec-table td:last-child{font-weight:500;}

/* ---------- Applications tags ---------- */
.tag-cloud{display:flex; flex-wrap:wrap; gap:10px; margin-top:16px;}
.tag-cloud span{
  background:var(--panel); border:1px solid var(--line); padding:8px 16px; border-radius:20px; font-size:13.5px; font-family:'Cairo',sans-serif; font-weight:600;
}

/* ---------- FAQ (AEO target) ---------- */
.faq-item{border-bottom:1px solid var(--line); padding:22px 0;}
.faq-item h3{font-size:17px; margin-bottom:10px; display:flex; gap:10px;}
.faq-item h3::before{content:'؟'; color:var(--ember); font-weight:900;}
.faq-item p{color:var(--steel); font-size:15px; max-width:70ch;}

/* ---------- CTA banner ---------- */
.cta-banner{
  background:linear-gradient(135deg, var(--ink) 0%, #0D2A4A 60%, var(--ember-dark) 140%);
  color:#fff; border-radius:var(--radius); padding:56px 60px; text-align:center;
  position:relative; overflow:hidden;
}
.cta-banner::before{
  content:''; position:absolute; top:-60px; right:-60px; width:220px; height:220px;
  background:radial-gradient(circle, rgba(240,121,29,.35) 0%, transparent 70%);
}
.cta-banner .cta-icon{
  width:56px; height:56px; border-radius:50%; background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.25);
  display:flex; align-items:center; justify-content:center; margin:0 auto 18px; font-size:24px; position:relative; z-index:1;
}
.cta-banner h2{color:#fff; font-size:30px; margin-bottom:12px; position:relative; z-index:1;}
.cta-banner p{color:#D8D1BE; margin-bottom:26px; max-width:55ch; margin-inline:auto; position:relative; z-index:1;}
.cta-banner .actions{display:flex; gap:16px; justify-content:center; flex-wrap:wrap; position:relative; z-index:1;}
.cta-banner .cta-btn{box-shadow:0 8px 22px rgba(240,121,29,.4); transition:transform .2s, box-shadow .2s;}
.cta-banner .cta-btn:hover{transform:translateY(-2px); box-shadow:0 12px 28px rgba(240,121,29,.55);}
.cta-banner .direct-line{
  margin-top:26px; padding-top:22px; border-top:1px solid rgba(255,255,255,.15);
  display:flex; gap:24px; justify-content:center; flex-wrap:wrap; font-size:14px; color:#D8D1BE; position:relative; z-index:1;
}
.cta-banner .direct-line a{color:#fff; font-weight:700; font-family:'Cairo',sans-serif;}
.cta-banner .direct-line span{display:inline-flex; align-items:center; gap:7px;}

/* ---------- Breadcrumb ---------- */
.breadcrumb{font-size:13px; color:var(--steel); padding:18px 0; font-family:'Cairo',sans-serif;}
.breadcrumb a{color:var(--steel);}
.breadcrumb a:hover{color:var(--ember);}

/* ---------- Product hero (inner pages) ---------- */
.hero-quick-links{display:flex; gap:20px; margin-top:20px; flex-wrap:wrap;}
.hero-quick-links a{font-size:13px; color:var(--steel); font-family:'Cairo',sans-serif; font-weight:600;}
.hero-quick-links a:hover{color:var(--ember);}

.product-hero{
  background:var(--ink); border-bottom:none; padding:0; position:relative; overflow:hidden;
}
.product-hero::before{
  content:''; position:absolute; inset:0; opacity:.5;
  background-image:
    repeating-linear-gradient(90deg, rgba(255,255,255,.04) 0px, rgba(255,255,255,.04) 1px, transparent 1px, transparent 44px),
    repeating-linear-gradient(0deg, rgba(255,255,255,.04) 0px, rgba(255,255,255,.04) 1px, transparent 1px, transparent 44px);
}
.product-hero .breadcrumb{position:relative; z-index:2; color:#B7C4D8;}
.product-hero .breadcrumb a{color:#B7C4D8;}
.hero-card-grid{display:grid; grid-template-columns:1fr 1fr; align-items:stretch; position:relative; z-index:2;}
.hero-card{
  background:var(--white); padding:56px 50px; display:flex; flex-direction:column; justify-content:center;
}
.hero-card .eyebrow{color:var(--ember);}
.hero-card h1{font-size:36px; max-width:18ch; margin-bottom:18px;}
.hero-card .lead{color:var(--steel); font-size:16px; max-width:52ch; margin-bottom:30px;}
.hero-card .actions{display:flex; align-items:center; gap:22px; flex-wrap:wrap;}
.watch-video-btn{
  display:flex; align-items:center; gap:12px; background:none; border:none; cursor:pointer;
  font-family:'Cairo',sans-serif; font-weight:700; font-size:14.5px; color:var(--ink);
}
.watch-video-btn .play-circle{
  width:42px; height:42px; border-radius:50%; border:2px solid var(--ink); display:flex;
  align-items:center; justify-content:center; font-size:13px; transition:background .2s, color .2s;
}
.watch-video-btn:hover .play-circle{background:var(--ember); border-color:var(--ember); color:#fff;}
.hero-media{position:relative; min-height:420px;}
.hero-media .pg-carousel{height:100%; display:flex; flex-direction:column;}
.hero-media .pg-main{flex:1; border-radius:0;}
.hero-media .pg-track{height:100%;}
.hero-media .pg-track img{height:100%; aspect-ratio:auto;}
.hero-media .pg-thumbs{padding:12px; background:var(--ink);}

.gallery{display:grid; grid-template-columns:2fr 1fr 1fr; gap:12px; margin-top:36px;}
.gallery img{width:100%; height:100%; object-fit:cover; border-radius:var(--radius);}
.gallery a:first-child img{height:100%; min-height:260px;}
.gallery a:nth-child(2), .gallery a:nth-child(3){height:124px;}
.gallery a:nth-child(2) img, .gallery a:nth-child(3) img{height:124px;}

@media(max-width:960px){
  .hero-card-grid{grid-template-columns:1fr;}
  .hero-media{min-height:320px;}
  .hero-card{padding:40px 28px;}
}

/* ---------- Contact form ---------- */
.contact-grid{display:grid; grid-template-columns:1fr 1fr; gap:50px;}
.form-field{margin-bottom:18px;}
.form-field label{display:block; font-family:'Cairo',sans-serif; font-weight:700; font-size:14px; margin-bottom:8px;}
.form-field input, .form-field textarea, .form-field select{
  width:100%; padding:14px 16px; border:1px solid var(--line); border-radius:var(--radius);
  font-family:'Tajawal',sans-serif; font-size:15px; background:var(--white);
}
.info-card{background:var(--panel); border:1px solid var(--line); border-radius:var(--radius); padding:30px; margin-bottom:20px;}
.info-card h4{font-size:15px; margin-bottom:8px; display:flex; align-items:center; gap:10px;}
.info-card p{color:var(--steel); font-size:14.5px;}

/* ---------- Footer ---------- */
footer.site{background:var(--ink); color:#AEC0D6; padding:64px 0 24px; font-size:14.5px;}
footer.site .cols{display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:40px; padding-bottom:40px; border-bottom:1px solid #1F4C7A;}
footer.site h5{color:#fff; font-family:'Cairo',sans-serif; font-size:15px; margin-bottom:18px;}
footer.site ul li{margin-bottom:10px;}
footer.site a:hover{color:#fff;}
footer.site .bottom{display:flex; justify-content:space-between; padding-top:22px; flex-wrap:wrap; gap:10px; font-size:13px;}
footer.site .brand-foot{display:flex; align-items:center; gap:10px; font-family:'Cairo',sans-serif; font-weight:900; color:#fff; font-size:19px; margin-bottom:14px;}

footer.site .social-row{display:flex; gap:10px; margin:20px 0;}
footer.site .social-row a{
  width:38px; height:38px; border-radius:50%; background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.18); display:flex; align-items:center; justify-content:center;
  transition:background .2s, transform .2s;
}
footer.site .social-row a:hover{background:var(--ember); transform:translateY(-2px);}
footer.site .social-row svg{width:16px; height:16px; fill:#fff;}

footer.site .download-brochure{
  display:inline-flex; align-items:center; gap:8px; background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.2); color:#fff !important; font-family:'Cairo',sans-serif;
  font-weight:600; font-size:13.5px; padding:11px 18px; border-radius:var(--radius); transition:background .2s;
}
footer.site .download-brochure:hover{background:var(--ember); border-color:var(--ember);}
footer.site .download-brochure svg{width:16px; height:16px; fill:#fff;}

/* ---------- WhatsApp float ---------- */
.wa-float{
  position:fixed; bottom:24px; left:24px; background:#25D366; width:58px; height:58px; border-radius:50%;
  display:flex; align-items:center; justify-content:center; z-index:100; box-shadow:0 8px 20px rgba(0,0,0,.25);
}
.wa-float svg{width:28px; height:28px; fill:#fff;}

/* ---------- Responsive ---------- */
@media(max-width:960px){
  .hero .wrap{grid-template-columns:1fr;}
  .grid-products{grid-template-columns:1fr 1fr;}
  .feat-list{grid-template-columns:1fr;}
  .gauge-row{grid-template-columns:1fr 1fr;}
  footer.site .cols{grid-template-columns:1fr 1fr;}
  .contact-grid{grid-template-columns:1fr;}
  nav.primary{display:none;}
  nav.primary .dropdown, nav.primary .sub-menu{position:static; display:flex !important; box-shadow:none; border:none; padding-right:16px; margin-top:6px; background:transparent;}
  nav.primary li.mega .mega-menu{position:static; display:grid !important; grid-template-columns:1fr; transform:none; width:100%; box-shadow:none; border:none; background:transparent; padding:6px 0 6px 16px;}
  .mega-item:hover{background:transparent;}
}
@media(max-width:600px){
  .hero h1{font-size:32px;}
  .hero .stats{display:grid; grid-template-columns:1fr 1fr; gap:18px 10px;}
  .hero .stats div{border-inline-end:none; padding:0; border-top:1px solid var(--line); padding-top:14px;}
  .hero .stats b{font-size:22px;}
  .grid-products{grid-template-columns:1fr;}
  .gallery{grid-template-columns:1fr 1fr;}
  .gallery a:first-child{grid-column:span 2;}
  .cta-banner{padding:36px 20px;}
  footer.site .cols{grid-template-columns:1fr;}
  .product-hero h1{font-size:26px; max-width:none;}
  .topbar .contact-line{font-size:11.5px; gap:10px;}
  .topbar .contact-line span:last-child{display:none;}
  .jrfa-modal{padding:24px 18px; max-height:92vh;}
  .cert-strip{gap:18px; justify-content:center; text-align:center;}
  .contact-grid .info-card{padding:20px;}
}

/* ================= ANIMATIONS / SLIDER / CAROUSEL (WordPress theme additions) ================= */

/* Scroll reveal (progressive enhancement — content stays visible if JS fails) */
.reveal{opacity:1; transform:none;}
html.js .reveal{opacity:0; transform:translateY(28px); transition:opacity .7s ease, transform .7s ease;}
html.js .reveal.is-visible{opacity:1; transform:translateY(0);}
.reveal-delay-1{transition-delay:.1s;}
.reveal-delay-2{transition-delay:.2s;}
.reveal-delay-3{transition-delay:.3s;}
.reveal-delay-4{transition-delay:.4s;}

/* Sticky header shrink */
header.site.is-scrolled{box-shadow:0 4px 18px rgba(28,26,23,.06);}
header.site.is-scrolled .wrap{padding-top:10px; padding-bottom:10px;}

/* Hero slider */
.hero-slider{position:relative; overflow:hidden; border-radius:var(--radius);}
.hero-slider .slide{display:none; position:relative;}
.hero-slider .slide.active{display:block; animation:fadeSlide .8s ease;}
.hero-slider .slide img{width:100%; aspect-ratio:4/3.1; object-fit:cover; border-radius:var(--radius);}
@keyframes fadeSlide{from{opacity:0; transform:scale(1.03);} to{opacity:1; transform:scale(1);}}
.hero-slider .dots{position:absolute; bottom:14px; right:50%; transform:translateX(50%); display:flex; gap:8px; z-index:6;}
.hero-slider .dots button{width:9px; height:9px; border-radius:50%; border:none; background:rgba(255,255,255,.55); cursor:pointer; padding:0;}
.hero-slider .dots button.active{background:#fff; width:22px; border-radius:5px;}
.hero-slider .hs-nav{position:absolute; top:50%; transform:translateY(-50%); width:44px; height:44px; border-radius:50%; background:rgba(28,26,23,.55); backdrop-filter:blur(2px); color:#fff; border:2px solid rgba(255,255,255,.4); display:flex; align-items:center; justify-content:center; cursor:pointer; z-index:6; font-size:19px; transition:background .2s, transform .2s;}
.hero-slider .hs-nav:hover{background:var(--ember); transform:translateY(-50%) scale(1.08);}
.hero-slider .hs-nav.prev{right:14px;}
.hero-slider .hs-nav.next{left:14px;}

/* Ember / spark particle effect (furnace theme accent) */
.ember-field{position:absolute; inset:0; overflow:hidden; pointer-events:none; z-index:2; border-radius:var(--radius);}
.ember-field span{
  position:absolute; bottom:-10px; width:5px; height:5px; border-radius:50%;
  background:radial-gradient(circle, #FFB37A 0%, var(--ember) 60%, transparent 100%);
  opacity:0; animation:emberRise 5.5s ease-in infinite;
  box-shadow:0 0 6px 2px rgba(240,121,29,.5);
}
.ember-field span:nth-child(1){right:8%; animation-delay:.2s;}
.ember-field span:nth-child(2){right:22%; animation-delay:1.4s; width:4px; height:4px;}
.ember-field span:nth-child(3){right:38%; animation-delay:.8s; width:6px; height:6px;}
.ember-field span:nth-child(4){right:55%; animation-delay:2.2s;}
.ember-field span:nth-child(5){right:70%; animation-delay:.4s; width:4px; height:4px;}
.ember-field span:nth-child(6){right:85%; animation-delay:1.8s; width:5px; height:5px;}
.ember-field span:nth-child(7){right:15%; animation-delay:3s; width:3px; height:3px;}
.ember-field span:nth-child(8){right:62%; animation-delay:2.6s; width:4px; height:4px;}
@keyframes emberRise{
  0%{ transform:translateY(0) translateX(0); opacity:0; }
  10%{ opacity:1; }
  100%{ transform:translateY(-260px) translateX(18px); opacity:0; }
}

/* Product card hover lift + glow (more tactile) */
.pcard{ will-change:transform; }
.pcard:hover{ box-shadow:0 18px 36px rgba(240,121,29,.16); }
.pcard img{ transition:transform .5s ease; }
.pcard:hover img{ transform:scale(1.06); }
.pcard .num{ transition:color .2s; }

/* Animated gradient underline on section headings */
.section-head h2{ position:relative; display:inline-block; }
.section-head h2::after{
  content:''; position:absolute; right:0; bottom:-8px; height:3px; width:60px;
  background:linear-gradient(90deg, var(--ember), transparent);
}

/* Counter animation number ticking is handled via JS updating textContent, no extra CSS needed */

/* Logo / client carousel */
.logo-carousel{overflow:hidden; position:relative; border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:26px 0;}
.logo-track{display:flex; gap:60px; width:max-content; animation:scrollLogos 28s linear infinite;}
.logo-track span{font-family:'Cairo',sans-serif; font-weight:800; color:var(--steel); font-size:16px; letter-spacing:.5px; white-space:nowrap; opacity:.7;}
@keyframes scrollLogos{from{transform:translateX(0);} to{transform:translateX(-50%);}}
.logo-carousel:hover .logo-track{animation-play-state:paused;}

/* Product gallery carousel (inner pages) — main image + thumbnail strip */
.pg-carousel{position:relative;}
.pg-main{position:relative; overflow:hidden; border-radius:var(--radius); background:var(--panel);}
.pg-track{display:flex; transition:transform .4s ease;}
.pg-track img{width:100%; flex:0 0 100%; aspect-ratio:16/10; object-fit:cover;}
.pg-nav{position:absolute; top:50%; transform:translateY(-50%); width:40px; height:40px; border-radius:50%; background:rgba(28,26,23,.6); color:#fff; border:none; display:flex; align-items:center; justify-content:center; cursor:pointer; z-index:5; font-size:17px;}
.pg-nav.prev{right:14px;}
.pg-nav.next{left:14px;}
.pg-thumbs{display:flex; gap:10px; margin-top:12px; overflow-x:auto; padding-bottom:4px;}
.pg-thumbs img{
  width:92px; height:68px; object-fit:cover; border-radius:var(--radius); cursor:pointer;
  border:2px solid var(--line); opacity:.75; transition:opacity .2s, border-color .2s; flex-shrink:0;
}
.pg-thumbs img:hover{opacity:1;}
.pg-thumbs img.active{opacity:1; border-color:var(--ember);}
/* legacy dots kept hidden if present from older markup */
.pg-dots{display:none;}

/* Mobile nav */
.mobile-toggle{display:none; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; padding:6px;}
.mobile-toggle span{width:26px; height:2px; background:var(--ink); display:block;}
nav.primary.mobile-open{display:block !important; position:absolute; top:100%; right:0; left:0; background:var(--bg); border-bottom:1px solid var(--line); padding:20px 28px;}
nav.primary.mobile-open ul{flex-direction:column; gap:16px;}

@media(max-width:960px){
  .mobile-toggle{display:flex;}
}

/* Back to top */
.back-top{
  position:fixed; bottom:24px; right:24px; width:50px; height:50px; border-radius:50%;
  background:var(--ink); color:#fff; display:flex; align-items:center; justify-content:center;
  z-index:100; opacity:0; pointer-events:none; transition:opacity .3s; cursor:pointer; border:none; font-size:18px;
}
.back-top.show{opacity:1; pointer-events:auto;}

/* Form status */
.form-notice{padding:16px 20px; border-radius:var(--radius); margin-bottom:20px; font-family:'Cairo',sans-serif; font-weight:600; font-size:14px;}
.form-notice.success{background:#E4F3E8; color:#256B3B; border:1px solid #B9DFC4;}
.form-notice.error{background:#FBE7E2; color:#9C3D22; border:1px solid #F0C4B8;}

/* ---------- Sticky side toolbar (Contact / WhatsApp / Call) ---------- */
.side-toolbar{
  position:fixed; top:50%; right:0; transform:translateY(-50%); z-index:200;
  display:flex; flex-direction:column; box-shadow:-4px 0 16px rgba(0,0,0,.12);
}
.side-toolbar button, .side-toolbar a{
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px;
  width:56px; min-height:90px; border:none; cursor:pointer; color:#fff;
  font-family:'Cairo',sans-serif; font-weight:700; font-size:12.5px; padding:10px 4px;
  writing-mode:vertical-rl; text-orientation:mixed; letter-spacing:.5px;
}
.side-toolbar .st-contact{background:var(--ink);}
.side-toolbar .st-contact:hover{background:#2b2822;}
.side-toolbar .st-whatsapp{background:#25D366;}
.side-toolbar .st-whatsapp:hover{background:#1fb457;}
.side-toolbar .st-call{background:var(--ember);}
.side-toolbar .st-call:hover{background:var(--ember-dark);}
.side-toolbar svg{width:20px; height:20px; fill:#fff; writing-mode:horizontal-tb;}

@media(max-width:700px){
  .side-toolbar{top:auto; bottom:0; right:0; left:0; transform:none; flex-direction:row; box-shadow:0 -4px 16px rgba(0,0,0,.12);}
  .side-toolbar button, .side-toolbar a{width:100%; min-height:56px; flex-direction:row; writing-mode:horizontal-tb; font-size:13px;}
  body{padding-bottom:58px;}
  .back-top{bottom:70px;}
}

/* ---------- Contact modal (popup inquiry form) ---------- */
.jrfa-modal-overlay{
  position:fixed; inset:0; background:rgba(28,26,23,.55); z-index:300;
  display:none; align-items:center; justify-content:center; padding:20px;
}
.jrfa-modal-overlay.open{display:flex;}
.jrfa-modal{
  background:var(--bg); border-radius:var(--radius); max-width:520px; width:100%;
  max-height:88vh; overflow-y:auto; padding:34px; position:relative;
}
.jrfa-modal-close{
  position:absolute; top:16px; left:16px; background:var(--panel); border:none; border-radius:50%;
  width:34px; height:34px; font-size:18px; cursor:pointer; color:var(--ink);
}
.jrfa-modal h3{font-size:22px; margin-bottom:8px;}
.jrfa-modal p.sub{color:var(--steel); font-size:14px; margin-bottom:22px;}

/* ---------- Photo gallery grid + lightbox ---------- */
.photo-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:16px;}
.photo-item{display:block; border-radius:var(--radius); overflow:hidden; aspect-ratio:4/3; position:relative;}
.photo-item img{width:100%; height:100%; object-fit:cover; transition:transform .4s ease;}
.photo-item:hover img{transform:scale(1.08);}
@media(max-width:960px){ .photo-grid{grid-template-columns:repeat(3,1fr);} }
@media(max-width:600px){ .photo-grid{grid-template-columns:repeat(2,1fr); gap:10px;} }

/* ---------- Video grid + modal player ---------- */
.video-thumb{position:relative; overflow:hidden;}
.video-thumb img{width:100%; height:190px; object-fit:cover; transition:transform .4s ease;}
.video-card:hover .video-thumb img{transform:scale(1.06);}
.video-thumb .play-btn{
  position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  width:56px; height:56px; border-radius:50%; background:rgba(240,121,29,.9); color:#fff;
  display:flex; align-items:center; justify-content:center; font-size:20px; pointer-events:none;
}
.video-embed-wrap{position:relative; width:100%; padding-top:56.25%; height:0;}
.video-embed-wrap iframe{position:absolute; inset:0; width:100%; height:100%; border-radius:2px;}
