/* ===== صفحه اصلی نوین فرایند — مطابق novin-farayand-mockup.html ===== */

/* --- بج هیرو --- */
#nf-hero-badge .nf-badge{
  display:inline-flex;align-items:center;gap:8px;
  background:var(--nf-bg-alt);border:1px solid var(--nf-border);
  color:var(--nf-blue-dark);font-size:13px;font-weight:600;
  padding:6px 14px;border-radius:999px;
}
#nf-hero-badge .nf-dot{width:6px;height:6px;border-radius:50%;background:var(--nf-teal);display:inline-block;}
#nf-hero-badge{margin-bottom:20px;}

/* --- هیرو --- */
#nf-hero{
  background:
    radial-gradient(600px 300px at 85% -10%, rgba(0,161,154,0.10), transparent),
    radial-gradient(500px 260px at 10% 0%, rgba(0,96,194,0.08), transparent);
  overflow:hidden;
}
#nf-hero-inner{max-width:780px;}
#nf-hero-title .elementor-heading-title{
  font-size:56px;font-weight:900;line-height:1.28;letter-spacing:-0.5px;
}
#nf-hero-title{margin-bottom:24px;}
#nf-hero-title .nf-accent{color:var(--nf-blue);}
#nf-hero-lead p{font-size:19px;color:var(--nf-text-soft);max-width:600px;}
#nf-hero-lead{margin-bottom:38px;}
#nf-hero-cta{margin-bottom:64px;}
#nf-hero-values-wrap{padding-top:32px;border-top:1px solid var(--nf-border);}
.nf-hero-values{display:flex;gap:36px;flex-wrap:wrap;}
.nf-hero-values div{font-size:14px;color:var(--nf-text-soft);display:flex;align-items:center;gap:8px;}
.nf-hero-values b{color:var(--nf-navy);font-weight:700;}

/* --- دکمه‌های مشترک --- */
#nf-hero-btn-primary .elementor-button,
#nf-cta-consult .elementor-button{
  background:var(--nf-blue);color:#fff;
  padding:12px 26px;border-radius:10px;font-weight:600;font-size:15px;line-height:1.8;
  border:1px solid transparent;transition:background .2s;
}
#nf-hero-btn-primary .elementor-button:hover{background:var(--nf-blue-dark);}

#nf-hero-btn-ghost .elementor-button{
  background:transparent;color:var(--nf-text);
  padding:12px 26px;border-radius:10px;font-weight:600;font-size:15px;line-height:1.8;
  border:1px solid var(--nf-border);transition:all .2s;
}
#nf-hero-btn-ghost .elementor-button:hover{border-color:var(--nf-blue);color:var(--nf-blue);}

/* --- تیتر بخش‌ها --- */
#nf-services-head,#nf-process-head,#nf-portfolio-head,#nf-why-head,#nf-approach-inner{
  max-width:640px;margin-bottom:56px;
}
#nf-services-title .elementor-heading-title,
#nf-process-title .elementor-heading-title,
#nf-portfolio-title .elementor-heading-title,
#nf-why-title .elementor-heading-title,
#nf-approach-title .elementor-heading-title{
  font-size:34px;font-weight:800;letter-spacing:-0.3px;
}
#nf-services-title,#nf-process-title,#nf-portfolio-title,#nf-why-title,#nf-approach-title{margin-bottom:16px;}
#nf-services-sub p,#nf-process-sub p,#nf-portfolio-sub p,#nf-why-sub p{
  color:var(--nf-text-soft);font-size:17px;
}

/* --- رویکرد مسئله‌محور --- */
#nf-approach{background:var(--nf-bg-alt);}
#nf-approach-inner{margin-bottom:0;}
#nf-approach-text p{color:var(--nf-text-soft);font-size:17px;}

/* --- کارت‌های خدمات --- */
#nf-services-grid > .e-con{
  flex:1 1 0;min-width:0;width:auto;
  background:#fff;border:1px solid var(--nf-border);border-radius:var(--nf-radius);
  transition:all .25s;
}
#nf-services-grid > .e-con:hover{
  border-color:var(--nf-blue);transform:translateY(-4px);
  box-shadow:0 16px 32px rgba(34,48,59,0.08);
}
.nf-service-icon{
  width:52px;height:52px;border-radius:12px;
  background:linear-gradient(135deg,var(--nf-blue),var(--nf-teal));
  display:flex;align-items:center;justify-content:center;
  color:#fff;font-size:22px;font-weight:800;
}
[id$="-icon"]{margin-bottom:22px;}
#nf-services-grid .elementor-heading-title{font-size:18px;font-weight:700;}
#nf-services-grid [id$="-title"]{margin-bottom:10px;}
#nf-services-grid [id$="-desc"] p{font-size:14.5px;color:var(--nf-text-soft);}
#nf-services-grid [id$="-desc"]{margin-bottom:18px;}
.nf-more{font-size:13.5px;font-weight:700;color:var(--nf-blue);text-decoration:none;}

/* لینک «همه نمونه‌کارها» زیر گرید صفحه اصلی.
   انتخابگر مضاعف چون `.elementor-widget-text-editor p:only-child{margin:0}`
   وگرنه فاصله بالا را می‌خورد. */
.elementor-widget-text-editor p.nf-more-wrap,
.nf-more-wrap{margin:32px 0 0;font-size:15px;font-weight:600;}
.nf-more-wrap a{color:var(--nf-blue);text-decoration:none;border-bottom:1px solid rgba(0,96,194,.25);padding-bottom:2px;}
.nf-more-wrap a:hover{color:var(--nf-blue-dark);border-bottom-color:var(--nf-blue-dark);}

/* «بیشتر بدانید» همه کارت‌ها در یک تراز، ته کارت.
   توضیح کارت‌ها هم‌اندازه نیست، پس بدون این، لینک هر کارت در ارتفاع
   متفاوتی می‌نشیند. `margin-top:auto` فضای اضافه را بالای لینک می‌ریزد. */
#nf-services-grid > .e-con{display:flex;flex-direction:column;}
#nf-services-grid [id$="-more"]{margin-top:auto;}

/* --- فرآیند کار --- */
#nf-process{background:var(--nf-bg-alt);}
#nf-process-grid > .e-con{flex:1 1 0;min-width:0;width:auto;position:relative;}
/* خط‌چین رابط بین مراحل (در RTL از راست به چپ) */
#nf-process-grid > .e-con:not(:last-child)::after{
  content:'';position:absolute;top:26px;left:0;width:100%;height:1px;
  background:repeating-linear-gradient(to left,var(--nf-border) 0 6px, transparent 6px 12px);
}
.nf-step-num{
  width:52px;height:52px;border-radius:50%;background:var(--nf-navy);color:#fff;
  display:flex;align-items:center;justify-content:center;font-weight:800;font-size:18px;
  position:relative;z-index:1;
}
#nf-process-grid [id$="-num"]{margin-bottom:22px;}
#nf-process-grid .elementor-heading-title{font-size:16.5px;font-weight:700;}
#nf-process-grid [id$="-title"]{margin-bottom:8px;}
#nf-process-grid [id$="-desc"] p{font-size:14px;color:var(--nf-text-soft);}

/* --- نمونه‌کارها --- */
#nf-portfolio-grid > .e-con{
  flex:1 1 0;min-width:0;width:auto;
  border-radius:var(--nf-radius);overflow:hidden;
  border:1px solid var(--nf-border);background:#fff;
}
.nf-portfolio-thumb{
  height:180px;background:linear-gradient(135deg,var(--nf-navy),var(--nf-blue-dark));
  display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,0.35);
  font-size:13px;font-weight:600;letter-spacing:.5px;
}
#nf-portfolio-grid [id$="-thumb"]{width:100%;}
.nf-tag{font-size:12.5px;color:var(--nf-teal);font-weight:700;display:block;}
#nf-portfolio-grid [id$="-tag"]{margin-bottom:8px;}
#nf-portfolio-grid .elementor-heading-title{font-size:16.5px;font-weight:700;}
#nf-portfolio-grid [id$="-title"]{margin-bottom:6px;}
#nf-portfolio-grid [id$="-desc"] p{font-size:13.5px;color:var(--nf-text-soft);}

/* --- چرا نوین فرایند --- */
#nf-why{background:var(--nf-bg-alt);}
#nf-why-grid > .e-con{flex:1 1 0;min-width:0;width:auto;}
.nf-why-num{font-size:13px;color:var(--nf-teal);font-weight:800;letter-spacing:1px;}
#nf-why-grid [id$="-num"]{margin-bottom:12px;}
#nf-why-grid .elementor-heading-title{font-size:18px;font-weight:700;}
#nf-why-grid [id$="-title"]{margin-bottom:10px;}
#nf-why-grid [id$="-desc"] p{font-size:14.5px;color:var(--nf-text-soft);}

/* --- تماس --- */
#nf-cta-banner{background:var(--nf-navy);border-radius:24px;color:#fff;}
#nf-cta-title .elementor-heading-title{font-size:28px;font-weight:800;color:#fff;}
#nf-cta-title{margin-bottom:12px;}
#nf-cta-sub p{color:rgba(255,255,255,0.65);font-size:15.5px;max-width:420px;}
/* کانتینرهای تودرتوی المنتور width:100% می‌گیرند و در flex row همدیگر را له می‌کنند */
#nf-cta-text{flex:1 1 auto;width:auto;min-width:0;}
#nf-cta-actions{flex:0 0 auto;width:auto;}
#nf-cta-phone .elementor-button{
  background:var(--nf-teal);color:#fff;white-space:nowrap;
  padding:12px 26px;border-radius:10px;font-weight:600;font-size:15px;line-height:1.8;
  border:1px solid transparent;transition:background .2s;
}
#nf-cta-phone .elementor-button:hover{background:#008a84;}
#nf-cta-consult .elementor-button{
  background:transparent;border-color:rgba(255,255,255,0.3);color:#fff;white-space:nowrap;
}
#nf-cta-consult .elementor-button:hover{border-color:#fff;background:transparent;}

/* --- فرم تماس --- */
#nf-contact-form{
  max-width:640px;margin-inline:auto;background:#fff;
  border:1px solid var(--nf-border);border-radius:var(--nf-radius);
}
#nf-contact-form label{
  display:block;font-size:13.5px;font-weight:600;
  color:var(--nf-text-soft);margin-bottom:8px;
}
#nf-contact-form input[type="text"],
#nf-contact-form input[type="tel"],
#nf-contact-form input[type="email"],
#nf-contact-form textarea{
  width:100%;padding:12px 14px;border:1px solid var(--nf-border);border-radius:10px;
  font-family:'IRANSansWeb',Tahoma,sans-serif;font-size:14.5px;
  color:var(--nf-text);background:var(--nf-bg-alt);
}
#nf-contact-form textarea{min-height:110px;resize:vertical;}
#nf-contact-form .wpcf7-form > p{margin-bottom:16px;}
#nf-contact-form input[type="submit"]{
  width:100%;background:var(--nf-blue);color:#fff;border:0;
  padding:12px 26px;border-radius:10px;font-weight:600;font-size:15px;
  font-family:'IRANSansWeb',Tahoma,sans-serif;cursor:pointer;transition:background .2s;
}
#nf-contact-form input[type="submit"]:hover{background:var(--nf-blue-dark);}

/* --- واکنش‌گرا (مطابق مدیا کوئری موکاپ) --- */
@media(max-width:1000px){
  #nf-hero-title .elementor-heading-title{font-size:38px;}
  #nf-services-grid,#nf-process-grid,#nf-portfolio-grid,#nf-why-grid{flex-wrap:wrap;}
  #nf-services-grid > .e-con,
  #nf-process-grid > .e-con,
  #nf-portfolio-grid > .e-con,
  #nf-why-grid > .e-con{flex:1 1 45%;}
  #nf-process-grid > .e-con:not(:last-child)::after{display:none;}
  #nf-cta-banner{flex-direction:column;text-align:center;}
}

@media(max-width:600px){
  #nf-hero{padding-block:64px 56px;}
  #nf-hero-title .elementor-heading-title{font-size:30px;}
  #nf-services,#nf-process,#nf-portfolio,#nf-why,#nf-approach,#nf-contact{padding-block:56px;}
  #nf-services-grid > .e-con,
  #nf-process-grid > .e-con,
  #nf-portfolio-grid > .e-con,
  #nf-why-grid > .e-con{flex:1 1 100%;}
  #nf-cta-banner{padding:44px 28px;}
  #nf-hero-cta{flex-wrap:wrap;}
}
