/* =====================================================================
   فرپو انرژی — farpoo-home.css (سکشن‌های صفحهٔ اصلی و برگه‌ها)
   فقط صفحهٔ اصلی و برگه‌ها (نه سبد/پرداخت/حساب). بعد از farpoo.css لود می‌شود.
   ===================================================================== */

/* ---------- ۱. هیرو صفحهٔ اصلی (fp-hero) ---------- */
.fp-hero { position: relative; overflow: hidden; color: var(--on-navy); padding-block: var(--space-16) var(--space-12); font-family: var(--font-sans);
  background: var(--navy) url("../img/hero/hero-bg-blue.svg") 50% 50% / cover no-repeat; } /* 1.1.40: طیف سرمه‌ای/آبی با خطوط ایزومتریک سفید (قبلاً روشن) */
.fp-hero__copy .fp-eyebrow { color: var(--red-on-dark); }
.fp-hero__inner { max-width: var(--container); margin: 0 auto; padding-inline: var(--space-6); box-sizing: border-box;
  display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--space-12); align-items: center; }
.fp-hero__copy { display: grid; gap: var(--space-6); justify-items: start; align-content: center; }
.fp-hero__copy .fp-eyebrow { display: inline-flex; align-items: center; gap: 10px; }
.fp-hero__copy .fp-eyebrow::after { content: ""; width: 10px; height: 10px; background: currentColor; clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%); }
.fp-hero h1 { margin: 0; font-size: 48px; line-height: 68px; font-weight: 850; color: var(--on-navy); text-wrap: balance; overflow-wrap: break-word; }
/* 1.1.30: بدون white-space: nowrap؛ Safari آیفون nowrap را کنار text-wrap: balance غلط حساب می‌کرد و «یو پی اس» از کادر بیرون می‌زد */
.fp-hero h1 em { font-style: normal; color: var(--red-on-dark); }
.fp-hero__lead { margin: 0; font-size: 18px; line-height: 34px; color: var(--on-navy-muted); max-width: 34em; }
.fp-hero__cta { display: flex; flex-wrap: wrap; gap: var(--space-3); }
/* دکمهٔ Outline روی زمینهٔ تیره (1.1.40) */
.fp-hero .fp-btn--outline { color: var(--on-navy); box-shadow: inset 0 0 0 2px var(--on-navy); --ring: var(--focus-ring-inverse); }
.fp-hero .fp-btn--outline:hover, .fp-hero .fp-btn--outline:focus { color: var(--on-navy); background: rgba(255,255,255,.1); }
.fp-hero .fp-btn--outline:focus-visible { box-shadow: inset 0 0 0 2px var(--on-navy), inset 0 0 0 5px var(--navy), inset 0 0 0 7px var(--on-navy); }
.fp-hero__call { margin: 0; font-size: 14px; line-height: 24px; color: var(--on-navy-muted); }
.fp-hero__call a { color: var(--on-navy); font-weight: 750; text-decoration: none; border-bottom: 1px solid var(--on-navy-muted); }
.fp-hero__call a:hover { color: var(--on-navy); border-bottom-color: var(--red-on-dark); }
.fp-hero__call a:focus-visible { outline: 2px solid var(--focus-ring-inverse); outline-offset: 2px; }
/* جملهٔ بولد مشاوره (1.1.26) */
.fp-hero__pitch { margin: 0; max-width: 34em; padding-inline-start: var(--space-4); border-inline-start: 3px solid var(--red-on-dark); font-size: 17px; line-height: 32px; color: var(--on-navy); }
.fp-hero__pitch strong { font-weight: 800; }
@media (max-width: 767px) { .fp-hero__pitch { font-size: 15px; line-height: 28px; } }

/* تصویر شهر (SVG شفاف، از 1.1.34): بدون قاب؛ width/height در HTML جای تصویر را از قبل نگه می‌دارد (بدون CLS) */
.fp-hero__art { margin: 0; aspect-ratio: 7 / 5; }
.fp-hero__art img { display: block; width: 100%; height: 100%; object-fit: contain; }

/* مسیرهای سریع: هر پرسونا یک ورودی */
/* .fp-hero جلوی selector لازم است: .fp-host ul (farpoo.css بخش ۱۵) قوی‌تر از یک کلاس است و margin/padding کارت‌ها را صفر می‌کند */
.fp-hero .fp-hero__paths { max-width: var(--container); margin: var(--space-12) auto 0; padding-inline: var(--space-6); box-sizing: border-box;
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-4); list-style: none; }
.fp-hero .fp-hero__paths li { display: flex; }
.fp-path { --c: var(--chamfer-md); flex: 1; position: relative; display: grid; grid-template-columns: 1fr auto; gap: var(--space-1) var(--space-4); align-items: center;
  padding: var(--space-6); text-decoration: none; color: var(--on-navy);
  background: rgba(255,255,255,.16); box-shadow: inset 0 0 0 1px rgba(255,255,255,.34); /* 1.1.41: روشن‌تر از زمینهٔ سرمه‌ای تا در موبایل دیده شود */
  clip-path: polygon(var(--c) 0, 100% 0, 100% calc(100% - var(--c)), calc(100% - var(--c)) 100%, 0 100%, 0 var(--c));
  transition: background-color .2s ease; }
.fp-path__tag { grid-column: 1; font-family: var(--font-latin); font-size: 12px; line-height: 16px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--red-on-dark); direction: ltr; justify-self: start; --fp-digits: "ss01" 0; }
.fp-path__title { grid-column: 1; font-size: 18px; line-height: 30px; font-weight: 750; }
.fp-path__desc { grid-column: 1; font-size: 14px; line-height: 24px; color: var(--on-navy-muted); }
.fp-path__go { grid-column: 2; grid-row: 1 / span 3; width: 40px; height: 40px; display: grid; place-items: center; box-shadow: inset 0 0 0 1px var(--on-navy-muted); transition: background-color .2s ease, box-shadow .2s ease; }
.fp-path__go svg { width: 20px; height: 20px; }
.fp-path:hover { background: rgba(255,255,255,.24); color: var(--on-navy); }
.fp-path:hover .fp-path__go { background: var(--red); box-shadow: none; }
.fp-path:focus-visible { outline: none; box-shadow: inset 0 0 0 3px var(--focus-ring-inverse); }

@media (max-width: 1024px) {
  .fp-hero__inner { grid-template-columns: 1fr; gap: var(--space-8); }
  .fp-hero__art { aspect-ratio: 16 / 9; }
  .fp-hero .fp-hero__paths { grid-template-columns: 1fr; }
}
@media (max-width: 767px) {
  .fp-hero { padding-block: var(--space-8) var(--space-12); }
  .fp-hero__inner, .fp-hero .fp-hero__paths { padding-inline: var(--space-4); }
  .fp-hero h1 { font-size: 32px; line-height: 50px; text-wrap: wrap; }
  .fp-hero__lead { font-size: 16px; line-height: 30px; }
  .fp-hero__cta { display: grid; width: 100%; }
  .fp-hero__cta .fp-btn { width: 100%; box-sizing: border-box; }
  .fp-hero__art { aspect-ratio: 4 / 3; }
  .fp-hero .fp-hero__paths { margin-top: var(--space-8); gap: var(--space-3); }
  .fp-path { padding: var(--space-4); }
}
/* ---------- ۲. تایل دسته‌ها (fp-cats) ---------- */
.fp-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: var(--space-4); }
.fp-tile {
  --c: var(--chamfer-md);
  position: relative; display: grid; gap: var(--space-3); align-content: start;
  min-height: 200px; padding: var(--space-6);
  background: var(--surface-raised); color: var(--ink); text-decoration: none;
  box-shadow: inset 0 0 0 1px var(--line);
  clip-path: polygon(var(--c) 0, 100% 0, 100% calc(100% - var(--c)), calc(100% - var(--c)) 100%, 0 100%, 0 var(--c));
  transition: background-color .2s ease, color .2s ease;
}
.fp-tile svg.fp-tile__icon { width: 40px; height: 40px; color: var(--navy); }
.fp-tile h3 { margin: 0; font-size: 20px; line-height: 32px; font-weight: 750; color: var(--navy); }
.fp-tile p { margin: 0; font-size: 14px; line-height: 24px; color: var(--ink-muted); }
.fp-tile__go { margin-top: auto; display: inline-flex; align-items: center; gap: var(--space-2); font-size: 14px; font-weight: 700; color: var(--red); }
.fp-tile__go::after { content: ""; width: 18px; height: 2px; background: currentColor; transition: width .2s ease; }
.fp-tile::before { content: ""; position: absolute; top: 0; left: 0; width: 56px; height: 56px; background: var(--red); clip-path: polygon(0 0, 100% 0, 0 100%); transform: translate(-100%, -100%); transition: transform .25s ease; }
.fp-tile:hover { background: var(--navy-deep); }
.fp-tile:hover h3, .fp-tile:hover svg.fp-tile__icon { color: var(--on-navy); }
.fp-tile:hover p { color: var(--on-navy-muted); }
.fp-tile:hover .fp-tile__go { color: var(--red-on-dark); }
.fp-tile:hover .fp-tile__go::after { width: 32px; }
.fp-tile:hover::before { transform: translate(0, 0); }
.fp-tile:focus-visible { outline: none; box-shadow: inset 0 0 0 3px var(--focus-ring); }

/* ۲.۱ سکشن تایل دسته‌های صفحهٔ اصلی (fp-cats، از 1.1.6)
   تایل = li با یک لینک اصلی کشیده روی کل تایل (h3 a::after) + لینک زیرگروه‌ها روی آن (z-index).
   تایل اول (fp-tile--feature) دو ردیف دسکتاپ را می‌گیرد: مهم‌ترین دسته از نظر فروش. */
.fp-cats { padding-block: var(--space-24); background: var(--surface); color: var(--ink); font-family: var(--font-sans); }
.fp-cats__inner { max-width: var(--container); margin: 0 auto; padding-inline: var(--space-6); box-sizing: border-box; display: grid; gap: var(--space-12); }
.fp-cats .fp-cats__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-4); list-style: none; }
.fp-cats .fp-tile { display: flex; flex-direction: column; gap: var(--space-3); min-height: 0; margin: 0; overflow: hidden; } /* مثلث hover بیرون از تایل اسکرول افقی نسازد */
.fp-cats .fp-tile--feature { grid-row: span 2; padding: var(--space-8); gap: var(--space-4); }
.fp-tile__top { display: flex; align-items: center; gap: var(--space-3); } /* برچسب کنار آیکون، دور از گوشهٔ مثلث hover */
.fp-tile__tag { font-family: var(--font-latin); font-size: 12px; line-height: 16px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--red); direction: ltr; --fp-digits: "ss01" 0; }
.fp-cats .fp-tile--feature svg.fp-tile__icon { width: 56px; height: 56px; }
.fp-cats .fp-tile--feature h3 { font-size: 28px; line-height: 40px; font-weight: 800; }
.fp-cats .fp-tile--feature p { font-size: 16px; line-height: 30px; max-width: 30em; }
.fp-tile__link { color: inherit; }
.fp-tile__link::after { content: ""; position: absolute; inset: 0; z-index: 1; }
.fp-tile__link:focus-visible { outline: none; }
.fp-tile:has(.fp-tile__link:focus-visible) { box-shadow: inset 0 0 0 3px var(--focus-ring); }
.fp-cats .fp-tile__subs { position: relative; z-index: 2; display: flex; flex-wrap: wrap; gap: var(--space-2); list-style: none; }
.fp-tile__subs a { display: inline-flex; align-items: center; min-height: 36px; padding: 0 var(--space-3); box-sizing: border-box;
  font-size: 14px; line-height: 20px; font-weight: 600; color: var(--navy); background: var(--surface); box-shadow: inset 0 0 0 1px var(--line);
  border-radius: var(--radius-sm); transition: background-color .2s ease, box-shadow .2s ease, color .2s ease; }
.fp-tile__subs a:hover { color: var(--navy); background: var(--navy-soft); box-shadow: inset 0 0 0 1px var(--navy); }
.fp-tile__subs a:focus-visible { outline: none; box-shadow: inset 0 0 0 2px var(--focus-ring); }
.fp-cats .fp-tile:hover .fp-tile__tag { color: var(--red-on-dark); }
.fp-cats .fp-tile:hover .fp-tile__subs a { color: var(--on-navy); background: transparent; box-shadow: inset 0 0 0 1px var(--line-on-dark); }
.fp-cats .fp-tile:hover .fp-tile__subs a:hover { background: var(--navy-hover); box-shadow: inset 0 0 0 1px var(--on-navy-muted); }
.fp-cats .fp-tile:hover .fp-tile__subs a:focus-visible { box-shadow: inset 0 0 0 2px var(--focus-ring-inverse); }
.fp-cats .fp-tile__go { padding-top: var(--space-2); }
.fp-cats .fp-tile--feature .fp-tile__subs { margin-top: auto; }
.fp-cats .fp-tile--feature .fp-tile__go { margin-top: 0; }
@media (max-width: 1024px) {
  .fp-cats .fp-cats__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .fp-cats .fp-tile--feature { grid-row: auto; grid-column: 1 / -1; }
}
@media (max-width: 767px) {
  .fp-cats { padding-block: var(--space-12); }
  .fp-cats__inner { padding-inline: var(--space-4); gap: var(--space-8); }
  .fp-cats .fp-section-head h2 { font-size: 24px; line-height: 36px; }
  .fp-cats .fp-cats__grid { grid-template-columns: 1fr; gap: var(--space-3); }
  .fp-cats .fp-tile, .fp-cats .fp-tile--feature { padding: var(--space-6) var(--space-4); }
  .fp-cats svg.fp-tile__icon, .fp-cats .fp-tile--feature svg.fp-tile__icon { width: 32px; height: 32px; }
  .fp-cats .fp-tile--feature h3 { font-size: 22px; line-height: 34px; }
  .fp-cats .fp-tile--feature p { font-size: 14px; line-height: 24px; }
}

/* ---------- ۳. خدمات (fp-svc) ----------
   ستون راست: فهرست ۵ خدمت (کل ردیف لینک است، h3 a::after). ستون چپ: پنل تیرهٔ مسیر تعمیر + نوار اضطراری.
   فهرست ردیفی است، نه تایل، تا با سکشن تایل دسته‌ها تکراری نشود. */
.fp-svc { padding-block: var(--space-24); background: var(--surface-sunken); color: var(--ink); font-family: var(--font-sans); }
.fp-svc__inner { max-width: var(--container); margin: 0 auto; padding-inline: var(--space-6); box-sizing: border-box; display: grid; gap: var(--space-12); }
.fp-svc .fp-section-head p a { color: var(--navy); font-weight: 700; box-shadow: inset 0 -2px 0 var(--red); }
.fp-svc .fp-section-head p a:hover { color: var(--red); }
.fp-svc__body { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--space-8); align-items: start; }
.fp-svc .fp-svc__list { list-style: none; display: grid; background: var(--surface-raised); box-shadow: inset 0 0 0 1px var(--line); }
.fp-svc__item { position: relative; display: grid; grid-template-columns: 40px minmax(0, 1fr) 24px; gap: var(--space-4); align-items: center;
  padding: var(--space-6); border-top: 1px solid var(--line); transition: background-color .2s ease; }
.fp-svc__item:first-child { border-top: 0; }
.fp-svc__icon { width: 40px; height: 40px; color: var(--navy); }
.fp-svc__text { display: grid; gap: 2px; }
.fp-svc__tag { font-family: var(--font-latin); font-size: 12px; line-height: 16px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-subtle); direction: ltr; justify-self: start; --fp-digits: "ss01" 0; }
.fp-svc__item h3 { margin: 0; font-size: 18px; line-height: 30px; font-weight: 750; color: var(--navy); }
.fp-svc__item p { margin: 0; font-size: 14px; line-height: 24px; color: var(--ink-muted); }
.fp-svc__link { color: inherit; }
.fp-svc__link::after { content: ""; position: absolute; inset: 0; }
.fp-svc__link:focus-visible { outline: none; }
.fp-svc__item:has(.fp-svc__link:focus-visible) { box-shadow: inset 0 0 0 3px var(--focus-ring); }
.fp-svc__go { width: 24px; height: 2px; background: var(--red); position: relative; transition: width .2s ease; justify-self: end; }
.fp-svc__go::before { content: ""; position: absolute; left: 1px; top: 50%; width: 9px; height: 9px; border-left: 2px solid var(--red); border-bottom: 2px solid var(--red); transform: translateY(-50%) rotate(45deg); box-sizing: border-box; } /* 1.1.9: نوک فلش روی محور خط */
.fp-svc__item:hover { background: var(--navy-soft); }
.fp-svc__item:hover .fp-svc__go { width: 32px; }
/* خدمت اضطراری: نوار قرمز کناری + برچسب قرمز */
.fp-svc__item--urgent { box-shadow: inset -4px 0 0 var(--red); }
.fp-svc__item--urgent .fp-svc__tag { color: var(--red); }
.fp-svc__item--urgent h3 { font-size: 20px; }
/* پنل مسیر تعمیر */
.fp-svc__panel { --c: var(--chamfer-lg); display: grid; gap: var(--space-6); padding: var(--space-8);
  clip-path: polygon(var(--c) 0, 100% 0, 100% calc(100% - var(--c)), calc(100% - var(--c)) 100%, 0 100%, 0 var(--c)); }
.fp-svc__panel h3 { margin: 0; font-size: 22px; line-height: 34px; font-weight: 800; color: var(--on-navy); }
.fp-svc__steps--pending { display: grid; grid-template-columns: 10px 1fr; gap: var(--space-3); align-items: baseline;
  padding: var(--space-4); border: 2px dashed var(--amber); color: var(--on-navy-muted); font-size: 14px; line-height: 24px; }
.fp-svc__steps--pending p { margin: 0; }
.fp-svc__steps--pending strong { display: block; color: var(--amber); font-weight: 750; }
.fp-svc__steps--pending .fp-diamond { background: var(--amber); }
.fp-svc .fp-emergency { --c: 0px; padding: var(--space-6) 0 0; background: transparent; border-top: 1px solid var(--line-on-dark); flex-direction: column; align-items: stretch; }
.fp-svc .fp-emergency__actions { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-2); }
.fp-svc .fp-emergency__actions .fp-btn--primary { grid-column: 1 / -1; }
.fp-svc .fp-emergency .fp-btn { padding-inline: var(--space-3); font-size: 14px; }
.fp-svc .fp-emergency .fp-btn--outline:hover { color: var(--on-navy); }
@media (min-width: 1025px) { .fp-svc__panel { position: sticky; top: 96px; } }
@media (max-width: 1024px) {
  .fp-svc__body { grid-template-columns: 1fr; }
}
@media (max-width: 767px) {
  .fp-svc { padding-block: var(--space-12); }
  .fp-svc__inner { padding-inline: var(--space-4); gap: var(--space-8); }
  .fp-svc .fp-section-head h2 { font-size: 24px; line-height: 36px; }
  .fp-svc__item { grid-template-columns: 32px minmax(0, 1fr) 20px; gap: var(--space-3); padding: var(--space-4); }
  .fp-svc__icon { width: 32px; height: 32px; }
  .fp-svc__item h3, .fp-svc__item--urgent h3 { font-size: 17px; line-height: 28px; }
  .fp-svc__panel { --c: var(--chamfer-md); padding: var(--space-6) var(--space-4); }
  .fp-svc__panel h3 { font-size: 19px; line-height: 30px; }
  .fp-svc .fp-emergency__actions { grid-template-columns: 1fr; }
}

/* ---------- ۴. محصولات منتخب (fp-feat) ---------- */
.fp-feat { padding-block: var(--space-24); background: var(--surface); color: var(--ink); font-family: var(--font-sans); }
.fp-feat__inner { max-width: var(--container); margin: 0 auto; padding-inline: var(--space-6); box-sizing: border-box; display: grid; gap: var(--space-12); }
.fp-feat__head { display: flex; align-items: end; justify-content: space-between; gap: var(--space-6); flex-wrap: wrap; }
.fp-feat__grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-4); list-style: none; }
@media (max-width: 1024px) { .fp-feat__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 767px) {
  .fp-feat { padding-block: var(--space-12); }
  .fp-feat__inner { padding-inline: var(--space-4); gap: var(--space-8); }
  .fp-feat .fp-section-head h2 { font-size: 24px; line-height: 36px; }
  /* موبایل: ردیف افقی با اسنپ؛ کارت بعدی نیمه‌پیداست تا اسکرول دیده شود */
  .fp-feat__grid { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 78%; overflow-x: auto; scroll-snap-type: x mandatory; margin-inline: calc(-1 * var(--space-4)); padding: 0 var(--space-4) var(--space-2); scroll-padding-inline: var(--space-4); scrollbar-width: none; }
  .fp-feat__grid::-webkit-scrollbar { display: none; }
  .fp-feat__grid > li { scroll-snap-align: start; }
  .fp-feat__head .fp-btn { width: 100%; }
  .fp-feat .fp-card .fp-card__body { padding: 0 var(--space-4) var(--space-4); }
}
.fp-feat a.fp-btn--outline:focus-visible { box-shadow: inset 0 0 0 2px var(--navy), inset 0 0 0 5px var(--surface-raised), inset 0 0 0 7px var(--navy); }

/* ---------- ۵. سؤال‌های متداول (fp-faq) ---------- */
.fp-faq { padding-block: var(--space-24); background: var(--surface); color: var(--ink); font-family: var(--font-sans); }
.fp-faq__inner { max-width: var(--container); margin: 0 auto; padding-inline: var(--space-6); box-sizing: border-box;
  display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--space-16); align-items: start; }
.fp-faq__inner *, .fp-faq__inner *::before, .fp-faq__inner *::after { box-sizing: border-box; }
.fp-faq__aside { position: sticky; top: calc(var(--space-24) + 24px); display: grid; gap: var(--space-8); }
.fp-faq .fp-section-head p a, .fp-faq__a a { color: var(--navy); font-weight: 700; box-shadow: inset 0 -2px 0 var(--red); text-decoration: none; }
.fp-faq .fp-section-head p a:hover, .fp-faq__a a:hover { color: var(--red); }
/* کادر «سؤالتان نیست؟» */
.fp-faq__help { --c: var(--chamfer-md); position: relative; padding: var(--space-6); background: var(--navy); color: var(--on-navy);
  clip-path: polygon(var(--c) 0, 100% 0, 100% calc(100% - var(--c)), calc(100% - var(--c)) 100%, 0 100%, 0 var(--c)); display: grid; gap: var(--space-4); }
.fp-faq__help::before { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .5;
  background-image: radial-gradient(var(--grid-dot) 1px, transparent 1px); background-size: var(--grid-pitch, 24px) var(--grid-pitch, 24px); }
.fp-faq__help > * { position: relative; margin: 0; }
.fp-faq__help strong { font-size: 18px; line-height: 30px; font-weight: 750; }
.fp-faq__help p { color: var(--on-navy-muted); font-size: 15px; line-height: 26px; }
.fp-faq__tels { display: grid; gap: 0; border-top: 1px solid var(--line-on-dark); }
.fp-faq__tels a { display: flex; justify-content: space-between; align-items: center; gap: var(--space-4); padding-block: var(--space-3);
  border-bottom: 1px solid var(--line-on-dark); color: var(--on-navy); text-decoration: none; font-weight: 600; }
.fp-faq__tels .fp-tel { font-weight: 700; }
.fp-faq__tels a:hover { color: var(--red-on-dark); }
/* آکاردئون: details/summary بومی، بدون JS، متن پاسخ در HTML برای خزنده */
.fp-faq__list { display: grid; gap: 0; border-top: 2px solid var(--navy); counter-reset: fpfaq; min-width: 0; }
.fp-faq__item { counter-increment: fpfaq; border-bottom: 1px solid var(--line); position: relative; }
.fp-faq__item summary { list-style: none; cursor: pointer; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center;
  gap: var(--space-6); padding: var(--space-6) 0; }
.fp-faq__item summary::-webkit-details-marker { display: none; }
.fp-faq__item summary::before { content: counter(fpfaq, decimal-leading-zero); font-family: var(--font-latin); font-size: 22px; line-height: 1;
  font-weight: 600; color: var(--line-strong); min-width: 2ch; transition: color .2s; }
.fp-faq__q { margin: 0; font-size: 18px; line-height: 30px; font-weight: 700; color: var(--navy); transition: color .2s; }
.fp-faq__icon { position: relative; width: 32px; height: 32px; background: var(--surface-sunken);
  clip-path: polygon(8px 0, 100% 0, 100% calc(100% - 8px), calc(100% - 8px) 100%, 0 100%, 0 8px); transition: background .2s; }
.fp-faq__icon::before, .fp-faq__icon::after { content: ""; position: absolute; top: 50%; left: 50%; width: 12px; height: 2px; margin: -1px 0 0 -6px;
  background: var(--navy); transition: transform .2s, background .2s; }
.fp-faq__icon::after { transform: rotate(90deg); }
.fp-faq__item summary:hover .fp-faq__q, .fp-faq__item summary:hover::before { color: var(--red); }
.fp-faq__item[open] summary::before { color: var(--red); }
.fp-faq__item[open] .fp-faq__icon { background: var(--navy); }
.fp-faq__item[open] .fp-faq__icon::before, .fp-faq__item[open] .fp-faq__icon::after { background: var(--on-navy); }
.fp-faq__item[open] .fp-faq__icon::after { transform: rotate(0); }
.fp-faq__item[open]::before { content: ""; position: absolute; inset-block: -1px; inset-inline-start: calc(-1 * var(--space-6)); width: 3px; background: var(--red); }
.fp-faq__item summary:focus-visible { outline: 3px solid var(--focus-ring); outline-offset: 2px; }
.fp-faq__a { padding: 0 0 var(--space-6); padding-inline-start: calc(2ch + var(--space-6) + 6px); padding-inline-end: calc(32px + var(--space-6)); color: var(--ink-muted); max-width: var(--measure, 72ch); }
.fp-faq__a p { margin: 0 0 var(--space-3); } .fp-faq__a p:last-child { margin-bottom: 0; }
@media (max-width: 1024px) { .fp-faq__inner { grid-template-columns: minmax(0, 1fr); gap: var(--space-8); } .fp-faq__aside { position: static; display: contents; } .fp-faq__help { order: 3; } }
@media (max-width: 767px) {
  .fp-faq { padding-block: var(--space-12); }
  .fp-faq__inner { padding-inline: var(--space-4); }
  .fp-faq .fp-section-head h2 { font-size: 24px; line-height: 36px; }
  .fp-faq__item summary { gap: var(--space-3); padding: var(--space-4) 0; }
  .fp-faq__item summary::before { font-size: 16px; }
  .fp-faq__q { font-size: 16px; line-height: 28px; }
  .fp-faq__icon { width: 28px; height: 28px; }
  .fp-faq__a { padding-inline: 0; padding-bottom: var(--space-4); font-size: 15px; line-height: 26px; }
  /* موبایل: فهرست با ارتفاع ثابت و اسکرول داخلی؛ اسکرول‌بار سفارشی (ریل باریک + دستگیرهٔ پخ‌دار) */
  .fp-faq__scroll { position: relative; timeline-scope: --fp-faq; border-top: 2px solid var(--navy); }
  .fp-faq__list { border-top: 0; }
  .fp-faq__list { max-height: min(460px, 62svh); overflow-y: auto; overscroll-behavior-y: auto; -webkit-overflow-scrolling: touch;
    padding-inline: var(--space-3) var(--space-6); scrollbar-width: thin; scrollbar-color: var(--navy) var(--line); }
  .fp-faq__item[open]::before { inset-inline-start: calc(-1 * var(--space-3)); }
  /* محوشدن پایین = «ادامه دارد» */
  .fp-faq__scroll::after { content: ""; position: absolute; inset-inline: 0 var(--space-6); bottom: 0; height: 56px; pointer-events: none;
    background: linear-gradient(to bottom, transparent, var(--surface)); }
  @supports (animation-timeline: scroll()) {
    .fp-faq__list { scroll-timeline: --fp-faq y; scrollbar-width: none; }
    .fp-faq__list::-webkit-scrollbar { display: none; }
    /* ریل (پس‌زمینهٔ خود قاب) + دستگیرهٔ پخ‌دار (::before) که با اسکرول فهرست جابه‌جا می‌شود */
    .fp-faq__scroll { background: linear-gradient(var(--line), var(--line)) left 7px top var(--space-4) / 2px calc(100% - 2 * var(--space-4)) no-repeat; }
    .fp-faq__scroll::before { content: ""; position: absolute; left: 5px; top: var(--space-4); width: 6px; height: 22%; background: var(--navy); pointer-events: none;
      clip-path: polygon(0 3px, 3px 0, 100% 0, 100% calc(100% - 3px), calc(100% - 3px) 100%, 0 100%);
      animation: fp-faq-thumb linear both; animation-timeline: --fp-faq; }
    .fp-faq__scroll::after { animation: fp-faq-fade linear both; animation-timeline: --fp-faq; }
  }
}
@keyframes fp-faq-thumb { from { top: var(--space-4); } to { top: calc(78% - var(--space-4)); } }
@keyframes fp-faq-fade { 0%, 85% { opacity: 1; } 100% { opacity: 0; } }

/* ---------- ۶. مراحل تعمیر (fp-steps؛ داخل سکشن خدمات) ---------- */
.fp-steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); counter-reset: step; }
.fp-steps li { position: relative; display: grid; gap: var(--space-2); padding: 0 0 0 var(--space-4); counter-increment: step; }
.fp-steps li::before {
  content: counter(step, persian);
  display: grid; place-items: center; width: 48px; height: 48px;
  background: var(--navy); color: var(--on-navy); font-weight: 850; font-size: 18px;
  clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%);
}
.fp-steps li:last-child::before { background: var(--red); }
.fp-steps li::after { content: ""; position: absolute; top: 23px; right: 56px; left: 8px; height: 2px; background: repeating-linear-gradient(to left, var(--line-strong) 0 6px, transparent 6px 12px); }
.fp-steps li:last-child::after { display: none; }
.fp-steps h4 { margin: 0; font-size: 16px; line-height: 26px; font-weight: 750; color: var(--navy); }
.fp-steps p { margin: 0; font-size: 14px; line-height: 24px; color: var(--ink-muted); }
@media (max-width: 860px) {
  .fp-steps { grid-template-columns: 1fr; gap: var(--space-6); }
  .fp-steps li { grid-template-columns: 48px 1fr; column-gap: var(--space-4); padding: 0; }
  .fp-steps li::before { grid-row: span 2; }
  .fp-steps li::after { top: 56px; bottom: -20px; right: 23px; left: auto; width: 2px; height: auto; background: repeating-linear-gradient(to bottom, var(--line-strong) 0 6px, transparent 6px 12px); }
}

/* ---------- ۷. نوار اضطراری (fp-emergency؛ داخل سکشن خدمات) ---------- */
.fp-emergency {
  --c: var(--chamfer-md);
  display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); flex-wrap: wrap;
  padding: var(--space-4) var(--space-6);
  background: var(--navy-deep); color: var(--on-navy);
  clip-path: polygon(var(--c) 0, 100% 0, 100% calc(100% - var(--c)), calc(100% - var(--c)) 100%, 0 100%, 0 var(--c));
}
.fp-emergency__text { display: grid; gap: 2px; }
.fp-emergency__text strong { font-size: 17px; line-height: 28px; font-weight: 800; display: flex; align-items: center; gap: var(--space-2); }
.fp-emergency__text span { font-size: 14px; line-height: 22px; color: var(--on-navy-muted); }
.fp-emergency__actions { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.fp-tel { direction: ltr; unicode-bidi: isolate; --fp-tabular: "ss03" 1; }
.fp-emergency .fp-diamond { background: var(--red-on-dark); }
@media (prefers-reduced-motion: no-preference) {
  .fp-emergency .fp-diamond { animation: fp-blink 1.6s steps(2, jump-none) infinite; }
}
@keyframes fp-blink { 50% { opacity: .25; } }