/*
Theme Name: Industrial Blue
Theme URI: https://example.com
Author: Custom
Author URI: https://example.com
Description: پوسته‌ی صفحه‌ی اصلی صنعتی با طراحی آبی/سرمه‌ای، راست‌به‌چپ و فارسی.
Version: 1.0
Requires at least: 5.8
Requires PHP: 7.4
Text Domain: industrial-blue
*/

:root{
  --navy:#001327;
  --navy2:#050F1F;
  --blue:#0B6EFA;
  --blue-dark:#0857C4;
  --light:#F7F9FC;
  --white:#FFFFFF;
  --ink:#101828;
  --muted:#5B6B7C;
  --border:#E4E7EC;
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  font-family:'Vazirmatn', sans-serif;
  color:var(--ink);
  background:var(--white);
  line-height:1.75;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%; display:block;}
a{color:inherit; text-decoration:none;}
ul{list-style:none;}
.wrap{max-width:1180px; margin:0 auto; padding:0 24px;}
section{padding:88px 0;}
h1,h2,h3,h4{font-weight:800; line-height:1.4;}
.kicker{display:block; font-size:13px; font-weight:700; color:var(--blue); margin-bottom:12px;}
.section-head{max-width:640px; margin-bottom:44px;}
.section-head h2{font-size:28px; color:var(--ink);}
.section-head p{color:var(--muted); font-size:15px; margin-top:10px;}
.btn{display:inline-flex; align-items:center; gap:8px; padding:13px 26px; border-radius:8px; font-weight:700; font-size:14.5px; border:1px solid transparent; cursor:pointer;}
.btn-blue{background:var(--blue); color:#fff;}
.btn-blue:hover{background:var(--blue-dark);}
.btn-outline{background:transparent; border-color:rgba(255,255,255,.35); color:#fff;}
.btn-outline:hover{border-color:#fff;}
.btn-outline-blue{background:transparent; border-color:var(--blue); color:var(--blue);}

/* header */
header.site-header{position:sticky; top:0; z-index:50; background:rgba(0,19,39,.96); backdrop-filter:blur(6px);}
.nav{display:flex; align-items:center; justify-content:space-between; height:74px;}
.logo{display:flex; align-items:center; gap:10px;}
.logo img{height:34px; width:auto;}
.nav-links{display:flex; align-items:center; gap:26px;}
.nav-links a{color:#C9D3DD; font-size:14.5px; font-weight:500;}
.nav-links a:hover{color:#fff;}
.menu-btn{display:none; background:none; border:none; color:#fff; font-size:24px; cursor:pointer;}

/* hero */
.hero{background:var(--navy); color:#fff; padding:90px 0;}
.hero .wrap{display:grid; grid-template-columns:1.15fr .85fr; gap:50px; align-items:center;}
.hero h1{font-size:38px; color:#fff; margin-bottom:18px;}
.hero h1 span{color:#3B9CFF;}
.hero p{color:#AAB8C4; font-size:16px; margin-bottom:30px;}
.hero-ctas{display:flex; gap:14px; flex-wrap:wrap;}
.hero-img{border-radius:10px; overflow:hidden; box-shadow:0 30px 60px -20px rgba(0,0,0,.55);}

/* stats */
.stats{background:var(--light); padding:44px 0;}
.stats .wrap{display:grid; grid-template-columns:repeat(5,1fr); gap:20px; text-align:center;}
.stat b{display:block; font-size:26px; color:var(--ink);}
.stat span{font-size:13px; color:var(--muted);}

/* products */
.products{background:var(--light);}
.head-row{display:flex; justify-content:space-between; align-items:flex-end; gap:24px; flex-wrap:wrap;}
.head-row .desc{max-width:340px; color:var(--muted); font-size:14px;}
.product-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-top:44px;}
.card{background:#fff; border:1px solid var(--border); border-radius:10px; overflow:hidden;}
.card img{aspect-ratio:16/11; object-fit:cover; width:100%;}
.card-body{padding:20px;}
.card-body h3{font-size:16.5px; margin-bottom:8px;}
.card-body p{font-size:13.5px; color:var(--muted); margin-bottom:14px;}
.card-body a{font-size:13.5px; font-weight:700; color:var(--blue);}

/* why us */
.why{background:var(--navy); color:#fff; position:relative; background-size:cover; background-position:center;}
.why-overlay{background:linear-gradient(to left, rgba(0,19,39,.35), rgba(0,19,39,.96) 55%); padding:90px 0;}
.why .wrap{max-width:560px;}
.why p{color:#AEB9C4; font-size:15px; margin:16px 0 26px;}
.why-features{background:var(--navy2);}
.why-features .wrap{display:grid; grid-template-columns:repeat(4,1fr); gap:18px; padding:40px 24px;}
.feature{text-align:center;}
.feature .ic{width:46px; height:46px; border-radius:50%; background:rgba(11,110,250,.15); color:var(--blue); display:flex; align-items:center; justify-content:center; margin:0 auto 12px; font-size:18px;}
.feature h4{font-size:14px; color:#fff;}

/* process */
.process-grid{display:grid; grid-template-columns:repeat(5,1fr); gap:18px; margin-top:44px;}
.step{text-align:center;}
.step .ic{width:52px; height:52px; border-radius:50%; background:var(--blue); color:#fff; display:flex; align-items:center; justify-content:center; margin:0 auto 14px; font-size:18px; font-weight:800;}
.step h4{font-size:14.5px; margin-bottom:6px;}
.step p{font-size:12.5px; color:var(--muted);}

/* industries */
.ind-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:18px; margin-top:44px;}
.ind-card{border-radius:10px; overflow:hidden; border:1px solid var(--border);}
.ind-card img{aspect-ratio:4/3; object-fit:cover; width:100%;}
.ind-card .lbl{display:flex; align-items:center; gap:8px; padding:12px 14px; font-size:14px; font-weight:700; color:var(--blue);}

/* blog */
.blog{background:var(--light);}
.blog-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:18px; margin-top:44px;}
.blog-card img{border-radius:8px; aspect-ratio:16/10; object-fit:cover; width:100%; margin-bottom:12px;}
.blog-card h4{font-size:14px; margin-bottom:6px;}
.blog-card span{font-size:12px; color:var(--muted);}

/* cta */
.cta{background:var(--navy); color:#fff;}
.cta .wrap{display:flex; justify-content:space-between; align-items:center; gap:24px; flex-wrap:wrap;}
.cta h2{color:#fff; font-size:26px; margin-bottom:8px;}
.cta p{color:#AEB9C4; font-size:14.5px;}

/* footer */
footer.site-footer{background:var(--navy2); color:#8A97A3; padding:64px 0 26px;}
.foot-grid{display:grid; grid-template-columns:1.3fr 1fr 1fr 1fr; gap:36px; margin-bottom:44px;}
.foot-col h5{color:#fff; font-size:14px; margin-bottom:14px;}
.foot-col li{margin-bottom:9px; font-size:13.5px;}
.foot-col a:hover{color:#fff;}
.foot-logo img{height:30px; margin-bottom:14px;}
.foot-bottom{border-top:1px solid rgba(255,255,255,.08); padding-top:20px; text-align:center; font-size:12.5px;}

@media (max-width: 980px){
  .hero .wrap{grid-template-columns:1fr;}
  .hero-img{order:-1;}
  .stats .wrap{grid-template-columns:repeat(2,1fr); gap:26px;}
  .product-grid{grid-template-columns:1fr 1fr;}
  .why-features .wrap{grid-template-columns:1fr 1fr;}
  .process-grid{grid-template-columns:1fr 1fr; row-gap:30px;}
  .ind-grid{grid-template-columns:1fr 1fr;}
  .blog-grid{grid-template-columns:1fr 1fr;}
  .foot-grid{grid-template-columns:1fr 1fr;}
  .nav-links{display:none;}
  .menu-btn{display:block;}
}
@media (max-width:560px){
  .hero h1{font-size:28px;}
  section{padding:56px 0;}
  .product-grid, .ind-grid, .blog-grid, .foot-grid{grid-template-columns:1fr;}
  .stats .wrap{grid-template-columns:1fr 1fr;}
}
