/* Fields of work — /services index + landing pages (/services/<slug>) */
.fd-index { max-width: var(--max); margin-inline: auto; padding: 0.5rem 1.5rem 5rem; }

/* Landing hero: copy + decorative image */
.fd-hero { position: relative; overflow: hidden; padding: 2.6rem 1.5rem 3.4rem; }
.fd-hero-inner { position: relative; z-index: 1; max-width: var(--max); margin-inline: auto; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: 3rem; align-items: center; }
.fd-hero-copy .post-back { display: inline-block; margin-bottom: 1.2rem; }
.fd-stickers { justify-content: flex-start; margin-bottom: 1.2rem; }
.fd-hero .page-title { font-size: clamp(2.2rem, 5.2vw, 3.9rem); }
.fd-lede { margin-top: 1rem; max-width: 34rem; font-size: 1.08rem; line-height: 2; }
.fd-chips--hero { margin-top: 1.3rem; }
.fd-chips--hero li { font-size: 0.86rem; padding: 0.25rem 0.9rem; border: 1.5px solid var(--ink); background: var(--paper); font-weight: 600; }
.fd-actions { justify-content: flex-start; margin-top: 1.8rem; }
.fd-hero-media { margin: 0; }
.fd-hero-frame { position: relative; border: 1.5px solid var(--ink); border-radius: calc(var(--radius) + 0.4rem); overflow: visible; box-shadow: 10px 10px 0 var(--tint); background: var(--accent); }
.fd-hero-frame img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 11; object-fit: cover; border-radius: calc(var(--radius) + 0.3rem); }
.fd-hero-icon { position: absolute; bottom: -1.7rem; inset-inline-start: -1.2rem; width: 4.4rem; height: 4.4rem; display: grid; place-items: center; border-radius: 50%; background: var(--paper); color: var(--accent); border: 1.5px solid var(--ink); box-shadow: 4px 4px 0 var(--gold); }
.fd-hero-icon svg { width: 2.2rem; height: 2.2rem; }
.fd-credit { margin-top: 1.1rem; font-size: 0.78rem; color: var(--muted); text-align: end; padding-inline: 4.5rem 0.3rem; }
.fd-credit a { color: var(--muted); border-bottom: 1px solid var(--line); }
.fd-credit a:hover { color: var(--accent); }

/* Segments (e.g. خانگی / اداری / صنعتی) */
.fd-segments { max-width: var(--max); margin: 0 auto; padding: 1rem 1.5rem 1rem; }
.fd-seg-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.fd-seg-grid--1 { grid-template-columns: 1fr; } .fd-seg-grid--2, .fd-seg-grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.fd-seg { position: relative; overflow: hidden; padding: 1.5rem 1.4rem 1.5rem; border: 1.5px solid var(--ink); border-radius: 1.4rem; background: var(--paper); }
.fd-seg:nth-child(3n + 1) { background: var(--accent); color: #fff; box-shadow: 6px 6px 0 var(--gold); }
.fd-seg:nth-child(3n + 1) p { color: rgba(255, 255, 255, 0.85); }
.fd-seg:nth-child(3n + 2) { background: var(--accent-soft); }
.fd-seg:nth-child(3n) { background: var(--sand); }
.fd-seg-num { display: block; font-family: "Syne", Vazirmatn, sans-serif; font-weight: 800; font-size: 2.6rem; line-height: 1; opacity: 0.22; margin-bottom: 0.6rem; }
.fd-seg h2 { font-size: 1.3rem; margin-bottom: 0.35rem; }
.fd-seg p { color: var(--muted); font-size: 0.95rem; }
.fd-seg.reveal:nth-child(2) { transition-delay: 0.07s; } .fd-seg.reveal:nth-child(3) { transition-delay: 0.14s; }

/* Services list */
.fd-services { max-width: var(--max); margin-inline: auto; padding: 4.6rem 1.5rem 4.4rem; }
.fd-svc-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.fd-svc { position: relative; padding: 1.35rem 1.3rem 1.4rem; background: var(--paper); border: 1.5px solid var(--ink); border-radius: 1.3rem; transition: transform 0.3s var(--ease), box-shadow 0.3s var(--ease); }
.fd-svc:hover { transform: translateY(-4px); box-shadow: 6px 6px 0 var(--accent); }
.fd-svc-check { display: inline-grid; place-items: center; width: 2rem; height: 2rem; border-radius: 50%; background: var(--accent-soft); color: var(--accent); font-weight: 700; border: 1.5px solid var(--accent); margin-bottom: 0.8rem; }
.fd-svc h3 { font-size: 1.08rem; margin-bottom: 0.35rem; }
.fd-svc p { color: var(--muted); font-size: 0.94rem; }

/* Approach text */
.fd-about { padding: 0 1.5rem 4.6rem; }
.fd-about-inner { max-width: 46rem; margin-inline: auto; padding: 2.2rem 2rem; border: 1.5px dashed var(--accent-mid); border-radius: var(--radius); background: var(--paper); }
.fd-about-inner .eyebrow { margin-bottom: 0.8rem; }
.fd-prose p { line-height: 2.05; }

.fd-process { margin-bottom: 0; }
.fd-work { max-width: var(--max); margin-inline: auto; padding: 4.8rem 1.5rem 1rem; }
.fd-work .pf-empty { max-width: 40rem; margin-inline: auto; }
.fd-blog { padding-top: 4rem; }
.fd-cta-wrap { padding: 1rem 1.5rem 1rem; }
.fd-cta-wrap .pf-cta { margin-top: 3rem; }

/* Other fields */
.fd-others { max-width: var(--max); margin: 3.4rem auto 0; padding: 0 1.5rem 4.5rem; }
.fd-others .eyebrow { margin-bottom: 1rem; }
.fd-others-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr)); gap: 0.9rem; }
.fd-other { display: flex; align-items: center; gap: 0.9rem; padding: 1rem 1.1rem; border: 1.5px solid var(--ink); border-radius: 1.2rem; background: var(--paper); color: var(--ink); transition: box-shadow 0.25s var(--ease), transform 0.25s var(--ease); }
.fd-other:hover { box-shadow: 5px 5px 0 var(--accent); transform: translate(-2px, -2px); }
.fd-other-icon { flex: none; width: 2.8rem; height: 2.8rem; display: grid; place-items: center; border-radius: 50%; background: var(--accent-soft); color: var(--accent); }
.fd-other-icon svg { width: 1.5rem; height: 1.5rem; }
.fd-other-text { display: flex; flex-direction: column; flex: 1; min-width: 0; }
.fd-other-text small { color: var(--muted); font-size: 0.85rem; }
.fd-other-arrow { color: var(--accent); font-weight: 700; }

@media (max-width: 1000px) {
  .fd-hero-inner { grid-template-columns: 1fr; gap: 2.4rem; }
  .fd-hero-media { order: -1; max-width: 40rem; }
  .fd-svc-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 800px) {
  .fd-hero { padding: 1.6rem 1.25rem 2.4rem; }
  .fd-hero-inner { gap: 2.2rem; }
  .fd-hero-media { order: 0; }
  .fd-hero-icon { width: 3.6rem; height: 3.6rem; bottom: -1.4rem; inset-inline-start: -0.4rem; }
  .fd-hero-icon svg { width: 1.8rem; height: 1.8rem; }
  .fd-hero-frame { box-shadow: 6px 6px 0 var(--tint); }
  .fd-credit { padding-inline: 3.6rem 0; }
  .fd-lede { font-size: 1rem; }
  .fd-segments, .fd-services, .fd-work, .fd-others, .fd-index { padding-inline: 1.25rem; }
  .fd-seg-grid, .fd-seg-grid--2, .fd-seg-grid--4, .fd-svc-grid { grid-template-columns: 1fr; }
  .fd-services { padding-block: 3.4rem 3rem; }
  .fd-about { padding: 0 1.25rem 3.4rem; }
  .fd-about-inner { padding: 1.6rem 1.25rem; }
  .fd-work { padding-top: 3.4rem; }
  .fd-actions .btn { flex: 1 1 auto; }
}
@media (prefers-reduced-motion: reduce) { .fd-svc, .fd-other { transition: none; } }
