/*
Theme Name: ITX بازرسی جامع
Theme URI: https://itx.ir
Author: ITX - Information Technology eXperts Arya Kish
Description: قالب اختصاصی وردپرس برای سایت سیستم جامع عملیاتی بازرسی شرکت ITX (لوید آلمان کیش). ساخته شده برای ویرایش آسان محتوا از داخل پیشخوان وردپرس.
Version: 1.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: itx
*/

/* ==========================================================================
   DESIGN TOKENS
   Subject: enterprise inspection / audit operations software.
   Signature idea: the product's own authentication device — the
   hologram + QR "seal" stamped on every inspection report — becomes the
   page's recurring visual mark (seal badge in hero, corner-bracket frames
   on cards, dotted "scan line" rules between sections).
   ========================================================================== */

/* ==========================================================================
   فونت ایران‌سنس — به‌صورت مستقیم داخل خود قالب (بدون وابستگی به CDN
   خارجی)، تا در محیط لوکال یا هر شبکه‌ای بدون نیاز به اینترنت لود شود.
   ========================================================================== */
@font-face{
  font-family:'IRANSans';
  src:url('assets/fonts/IRANSansWeb_UltraLight.ttf') format('truetype');
  font-weight:200; font-style:normal; font-display:swap;
}
@font-face{
  font-family:'IRANSans';
  src:url('assets/fonts/IRANSansWeb_Light.ttf') format('truetype');
  font-weight:300; font-style:normal; font-display:swap;
}
@font-face{
  font-family:'IRANSans';
  src:url('assets/fonts/IRANSansWeb.ttf') format('truetype');
  font-weight:400; font-style:normal; font-display:swap;
}
@font-face{
  font-family:'IRANSans';
  src:url('assets/fonts/IRANSansWeb_Medium.ttf') format('truetype');
  font-weight:500; font-style:normal; font-display:swap;
}
@font-face{
  font-family:'IRANSans';
  src:url('assets/fonts/IRANSansWeb_Bold.ttf') format('truetype');
  font-weight:700; font-style:normal; font-display:swap;
}
@font-face{
  font-family:'IRANSans';
  src:url('assets/fonts/IRANSansWeb_Black.ttf') format('truetype');
  font-weight:800; font-style:normal; font-display:swap;
}

:root{
  --ink:        #101317;   /* near-black — primary text / dark sections  */
  --ink-soft:   #363B44;   /* softened black for body copy on light bg   */
  --steel:      #55606E;   /* slate — secondary label colour             */
  --steel-2:    #8A93A1;   /* lighter slate for tints / hovers           */
  --paper:      #F4F5F3;   /* near-white paper background                */
  --paper-2:    #E9EAEC;   /* slightly deeper paper for section bands    */
  --line:       #D8DAE0;   /* hairline borders                           */
  --amber:      #667BB4;   /* brand blue, sampled from the ITX logo      */
  --amber-dark: #48598A;
  --verify:     #101317;
  --white:      #FFFFFF;

  --font-display: 'IRANSans', 'Tahoma', sans-serif;
  --font-body:    'IRANSans', 'Tahoma', sans-serif;
  --font-mono:    'IRANSans', 'Tahoma', monospace;

  --radius: 2px;
  --container: 1180px;
}

/* ==========================================================================
   RESET / BASE
   ========================================================================== */

*, *::before, *::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0;
  font-family:var(--font-body);
  background:var(--paper);
  color:var(--ink-soft);
  direction:rtl;
  text-align:right;
  line-height:1.85;
  font-size:17px;
  -webkit-font-smoothing:antialiased;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
ul{ margin:0; padding:0; list-style:none; }
h1,h2,h3,h4{ font-family:var(--font-display); color:var(--ink); margin:0 0 .5em; font-weight:800; line-height:1.35; }
p{ margin:0 0 1em; }
button{ font-family:inherit; cursor:pointer; }

.container{ max-width:var(--container); margin:0 auto; padding:0 28px; }

@media (prefers-reduced-motion: reduce){
  *{ animation:none !important; transition:none !important; scroll-behavior:auto !important; }
}

/* focus visibility */
a:focus-visible, button:focus-visible{
  outline:2px solid var(--amber);
  outline-offset:3px;
}

/* ==========================================================================
   EYEBROW / LABEL / SCAN-LINE DIVIDER (signature devices)
   ========================================================================== */

.eyebrow{
  font-family:var(--font-mono);
  font-size:12.5px;
  letter-spacing:.14em;
  color:var(--steel);
  text-transform:uppercase;
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:14px;
}
.eyebrow::before{
  content:"";
  width:22px; height:1px;
  background:var(--amber);
  display:inline-block;
}

.scanline{
  height:1px;
  background-image:repeating-linear-gradient(to left, var(--line) 0 6px, transparent 6px 12px);
  margin:0;
}

/* corner-bracket "viewfinder" card frame — echoes the scan/verify motif */
.bracket-card{
  position:relative;
  padding:30px 26px;
  background:var(--white);
}
.bracket-card::before,
.bracket-card::after{
  content:"";
  position:absolute;
  width:16px; height:16px;
  border:2px solid var(--amber);
  opacity:.85;
}
.bracket-card::before{ top:-1px; right:-1px; border-left:none; border-bottom:none; }
.bracket-card::after{ bottom:-1px; left:-1px; border-right:none; border-top:none; }

/* number tag used only where content is a genuine sequence (modules, steps) */
.tag-num{
  font-family:var(--font-mono);
  font-size:13px;
  color:var(--amber-dark);
  letter-spacing:.05em;
}

/* ==========================================================================
   HEADER
   ========================================================================== */

.site-header{
  position:sticky; top:0; z-index:50;
  background:rgba(241,241,236,.92);
  backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line);
}
.site-header .container{
  display: flex;
  align-items: center;
  height: 88px;
  width: 100%;
  padding: 0 10px;
  max-width: 1200px;
  margin: 0 auto;
  padding-inline: 100px;
}

.site-logo{
  display: flex;
  align-items: center;
  gap: 14px;
  margin-inline-end: auto;
 
}

.site-header-right{
  display: flex;
  align-items: center;
  gap: 14px;
  margin-inline-start: auto;
}
.site-logo{  display: flex; align-items: center; gap: 14px; flex: 1;display:flex; text-align: left; }
.site-logo img{ height:58px; width:auto; text-align: left; direction: ltr;}
.site-logo .logo-text .initial{   color: #07467ecc; font-size: 1.2em; font-weight: 700;  display: inline-block; text-align: left;}
.site-logo .logo-text{   direction: ltr;   unicode-bidi: isolate;   white-space: nowrap; }
.site-logo .logo-text small{ display:block;  font-family:var(--font-mono); font-weight:700; font: size 14px; color:var(--steel); letter-spacing:.05em;  }

.primary-nav ul{ display:flex; gap:6px; }
.primary-nav a{
  display:inline-block;
  padding:10px 16px;
  font-size:14.5px;
  font-weight:600;
  color:var(--ink-soft);
  border-radius:var(--radius);
  transition:color .15s ease, background .15s ease;
}
.primary-nav a:hover,
.primary-nav .current-menu-item a{ color:var(--ink); background:var(--paper-2); }

.header-cta{ display:flex; align-items:center; gap:10px; }
.menu-toggle{ display:none; background:none; border:1px solid var(--line); padding:8px 10px; }
.menu-toggle span, .menu-toggle span::before, .menu-toggle span::after{
  content:""; display:block; width:20px; height:2px; background:var(--ink); position:relative; margin:4px 0;
}

@media (max-width: 900px){
  .site-header-right{ width:100%; justify-content:space-between; }
  .primary-nav{
    position:fixed; inset:88px 0 0 0; background:var(--paper);
    transform:translateY(-8px); opacity:0; pointer-events:none;
    transition:opacity .2s ease, transform .2s ease;
    overflow-y:auto;
  }
  .primary-nav ul{ flex-direction:column; padding:20px 28px; gap:2px; }
  .primary-nav a{ display:block; padding:16px 4px; border-bottom:1px solid var(--line); }
  .site-header.nav-open .primary-nav{ opacity:1; transform:translateY(0); pointer-events:auto; }
  .menu-toggle{ display:block; }
  .header-cta .btn-text{ display:none; }
  .site-logo img{ height:46px; }
}

/* ==========================================================================
   BUTTONS
   ========================================================================== */

.btn{
  display:inline-flex; align-items:center; gap:8px;
  padding:8px 18px;
  font-size:13px; font-weight:700;
  border-radius:var(--radius);
  border:1px solid transparent;
  transition:transform .15s ease, background .15s ease, border-color .15s ease;
  white-space:nowrap;
}
.btn:hover{ transform:translateY(-1px); }
.btn-amber{ background:var(--amber); color:var(--ink); }
.btn-amber:hover{ background:var(--amber-dark); color:var(--white); }
.btn-outline{ border-color:var(--ink); color:var(--ink); }
.btn-outline:hover{ background:var(--ink); color:var(--white); }
.btn-ghost-light{ border-color:rgba(255,255,255,.4); color:var(--white); }
.btn-ghost-light:hover{ background:var(--white); color:var(--ink); }

/* ==========================================================================
   HERO (seal / verification badge as signature element)
   ========================================================================== */

.hero{
  background:var(--ink);
  color:var(--white);
  position:relative;
  overflow:hidden;
  padding:96px 0 80px;
}
.hero::before{
  content:"";
  position:absolute; inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,.05) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.05) 1px, transparent 1px);
  background-size:44px 44px;
  mask-image:radial-gradient(ellipse at 70% 30%, black 0%, transparent 70%);
  pointer-events:none;
}
.hero .container{
  display:grid; grid-template-columns:1.15fr .85fr; gap:56px; align-items:center;
  position:relative;
}
.hero h1{
  color:var(--white);
  font-size:clamp(26px, 4vw, 26px);
  margin-bottom:20px;
}
.hero h1 em{ font-style:normal; color:var(--amber); }
.hero .lede{ color:#C9D3DE; font-size:17.5px; max-width:52ch; margin-bottom:32px; }
.hero .hero-actions{ display:flex; gap:12px; flex-wrap:wrap; }

.seal-wrap{ display:flex; justify-content:center; }
.seal{ width:100%; max-width:300px; animation:seal-in .9s ease both; }
.seal .ring-rot{ transform-origin:150px 150px; animation:seal-spin 40s linear infinite; }
@keyframes seal-spin{ to{ transform:rotate(360deg); } }
@keyframes seal-in{ from{ opacity:0; transform:scale(.92); } to{ opacity:1; transform:scale(1); } }

@media (max-width: 860px){
  .hero .container{ grid-template-columns:1fr; }
  .seal-wrap{ order:-1; }
  .seal{ max-width:180px; }
}

/* ==========================================================================
   SECTIONS — generic building blocks used by page templates
   ========================================================================== */

.section{ padding:50px 0; }
.section-tight{ padding:56px 0; }
.section-alt{ background:var(--white); }
.section-band{ background:var(--paper-2); }
.section-dark{ background:var(--ink); color:#C9D3DE; }
.section-dark h2, .section-dark h3{ color:var(--white); }

.section-head{ max-width:64ch; margin-bottom:48px; }
.section-head.center{ margin-left:auto; margin-right:auto; text-align:justify; }
.section-head h2{ font-size:clamp(24px,2.6vw,34px); }

.grid{ display:grid; gap:22px; }
.grid-2{ grid-template-columns:repeat(2,1fr); }
.grid-3{ grid-template-columns:repeat(3,1fr); }
.grid-4{ grid-template-columns:repeat(4,1fr); }
@media (max-width:920px){ .grid-2,.grid-3,.grid-4{ grid-template-columns:1fr; } }

/* problem / solution pairs */
.ps-item{
  border-top:1px solid var(--line);
  padding:34px 0;
  display:grid;
  grid-template-columns:220px 1fr;
  gap:36px;
}
.ps-item:last-child{ border-bottom:1px solid var(--line); }
.ps-item .ps-label{
  display:flex; align-items:center; gap:10px;
  font-family:var(--font-display); font-weight:800; font-size:15.5px;
  color:var(--amber); padding-top:2px;
}
.ps-item .ps-label .icon-badge{ width:38px; height:38px; margin:0; flex:none; }
.ps-item .ps-label .icon-badge svg{ width:19px; height:19px; }
.ps-item h3{ font-size:19px; margin-bottom:10px; }
.ps-item .ps-problems{ margin-bottom:14px; }
.ps-item .ps-problems li{ position:relative; padding-right:18px; margin-bottom:6px; color:var(--ink-soft); font-size:15.5px; }
.ps-item .ps-problems li::before{ content:"–"; position:absolute; right:0; color:var(--steel-2); }
.ps-item .ps-solution{
  background:var(--paper-2); border-radius:var(--radius); padding:16px 18px;
  font-size:15.5px; color:var(--ink-soft); text-align: justify;
}
.ps-item .ps-solution b{ color:var(--ink); }
@media (max-width:760px){ .ps-item{ grid-template-columns:1fr; gap:12px; } }

/* feature / card list */
.card{
  background:var(--white);
  border:1px solid var(--line);
  padding:26px 24px;
  border-radius:var(--radius);
}
.card h3{ font-size:17.5px; margin-bottom:8px; }
.card p{ font-size:15px; color:var(--ink-soft); margin:0; }

.features-title{ font-size:clamp(21px,2.1vw,27px); letter-spacing:-.01em; }

.feature-card{
  background:var(--paper);
  border:1px solid var(--line);
  border-top:3px solid var(--amber);
  border-radius:6px;
  padding:24px 22px;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease;
}
.feature-card:hover{
  transform:translateY(-3px);
  background:var(--white);
  box-shadow:0 14px 28px -18px rgba(16,19,23,.35);
  border-color:var(--amber);
}
.feature-icon{
  display:flex; align-items:center; justify-content:center;
  width:42px; height:42px; border-radius:50%;
  background:var(--white); color:var(--amber);
  margin-bottom:14px;
}
.feature-icon svg{ width:21px; height:21px; }
.feature-card p{ font-size:14.5px; font-weight:700; color:var(--ink); margin:0; line-height:1.7; }
.icon-badge{
  width:46px; height:46px; border:1.5px solid var(--amber); border-radius:50%;
  display:flex; align-items:center; justify-content:center; margin-bottom:16px;
  color:var(--amber);
}
.icon-badge svg{ width:22px; height:22px; }

/* module list — real numbered sequence (24 modules) */
.module-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:0; border-top:1px solid var(--line); border-right:1px solid var(--line); }
.module-item{ border-left:1px solid var(--line); border-bottom:1px solid var(--line); padding:20px 22px; }
.module-item .tag-num{ display:block; margin-bottom:6px; }
.module-item h4{ font-size:15px; margin:0; color:var(--ink); font-weight:700; }
@media (max-width:920px){ .module-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:620px){ .module-grid{ grid-template-columns:1fr; } }

/* process steps (real sequence -> connected icon nodes) */
.steps{ position:relative; }
.step{
  position:relative;
  display:grid; grid-template-columns:64px 1fr; gap:26px;
  padding:0 0 40px;
}
.step:last-child{ padding-bottom:0; }
.step::before{
  /* connecting sequence line */
  content:"";
  position:absolute;
  top:64px; bottom:-8px; right:31px;
  width:1px;
  background:repeating-linear-gradient(to bottom, var(--line) 0 5px, transparent 5px 10px);
}
.step.step-last::before{ display:none; }
.step-node{
  position:relative;
  width:64px; height:64px; border-radius:50%;
  background:var(--white); border:1.5px solid var(--amber);
  display:flex; align-items:center; justify-content:center;
  color:var(--amber); flex:none;
}
.step-node-icon svg{ width:26px; height:26px; }
.step-node-num{
  position:absolute; bottom:-7px; left:50%; transform:translateX(-50%);
  background:var(--ink); color:var(--white);
  font-family:var(--font-mono); font-size:10.5px; letter-spacing:.03em;
  padding:1px 6px; border-radius:20px;
}
.step h3{ font-family:var(--font-display); font-weight:800; font-size:18.5px; color:var(--ink); margin-bottom:6px; }
.step p{ font-size:15px; color:var(--ink-soft); margin:0; max-width:60ch; }

/* timeline (about page — real chronology) */
.timeline{ position:relative; padding-right:26px; border-right:2px solid var(--line); }
.timeline-item{ position:relative; padding-bottom:36px; }
.timeline-item:last-child{ padding-bottom:0; }
.timeline-item::before{
  content:""; position:absolute; right:-31px; top:4px; width:10px; height:10px;
  background:var(--amber); border-radius:50%; box-shadow:0 0 0 4px var(--paper);
}
.timeline-item .year{ font-family:var(--font-mono); color:var(--steel); font-size:13.5px; letter-spacing:.05em; }
.timeline-item h4{ margin:4px 0 6px; font-size:17px; }
.timeline-item p{ color:var(--ink-soft); font-size:15px; margin:0; }

/* accordion (used for detailed module specs on products page) */
.accordion-item{ border-top:1px solid var(--line); }
.accordion-item:last-child{ border-bottom:1px solid var(--line); }
.accordion-item summary{
  list-style:none; cursor:pointer;
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:20px 2px; font-weight:700; color:var(--ink); font-size:16px;
}
.accordion-item summary::-webkit-details-marker{ display:none; }
.accordion-item summary::after{
  content:"+"; font-family:var(--font-mono); font-size:20px; color:var(--amber-dark); flex:none;
}
.accordion-item[open] summary::after{ content:"–"; }
.accordion-item .accordion-body{ padding:0 2px 24px; color:var(--ink-soft); font-size:15px; }
.accordion-item .accordion-body ul{ margin-top:10px; }
.accordion-item .accordion-body li{ position:relative; padding-right:16px; margin-bottom:7px; }
.accordion-item .accordion-body li::before{ content:"–"; position:absolute; right:0; color:var(--steel-2); }

/* stat strip */
.stat-strip{ display:flex; flex-wrap:wrap; gap:0; border-top:1px solid rgba(255,255,255,.15); border-bottom:1px solid rgba(255,255,255,.15); }
.stat{ flex:1 1 200px; padding:28px 22px; border-left:1px solid rgba(255,255,255,.15); }
.stat .num{ font-family:var(--font-mono); font-size:34px; color:var(--amber); }
.stat .label{ font-size:14px; color:#C9D3DE; margin-top:4px; }

/* Customers / Logos */
.logo-grid{
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap:1px;
    width:100%;
    background:var(--line);
    border:1px solid var(--line);
}

.logo-grid .logo-cell{
    background:var(--white);
    padding:25px;
    min-height:150px;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
}

.logo-grid .logo-cell a{
    width:100%;
    height:100%;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-decoration:none;
}

.logo-grid .logo-cell img{
    width:100%;
    max-width:180px;
    height:85px;
    object-fit:contain;
    display:block;
}

.logo-grid .logo-cell .logo-name{
    margin-top:12px;
    font-size:14px;
    font-weight:600;
    color:var(--ink);
}

.logo-grid .logo-cell a:hover .logo-name{
    color:var(--amber);
}

@media (max-width:760px){
    .logo-grid{
        grid-template-columns:1fr;
    }
}
/* contact */
.contact-grid{ display:grid; grid-template-columns:.9fr 1.1fr; gap:10px; }
.contact-info .info-row{ display:flex; gap:16px; padding:18px 0; border-top:1px solid var(--line); }
.contact-info .info-row:last-child{ border-bottom:1px solid var(--line); }
.contact-info .info-row .k{ font-family:var(--font-mono); font-size:12.5px; color:var(--steel); min-width:90px; padding-top:2px; }
.contact-info .info-row .v{ font-size:16px; color:var(--ink); font-weight:600; }
.map-frame{ border:1px solid var(--line); height:100%; min-height:320px; }
.map-frame iframe{ width:100%; height:100%; min-height:320px; border:0; }
@media (max-width:860px){ .contact-grid{ grid-template-columns:1fr; } }

.wpcf7-form p{ margin-bottom:14px; }
.wpcf7-form input, .wpcf7-form textarea{
  width:100%; padding:13px 14px; border:1px solid var(--line); background:var(--white);
  font-family:var(--font-body); font-size:15px; border-radius:var(--radius);
}
.wpcf7-form input:focus, .wpcf7-form textarea:focus{ outline:2px solid var(--amber); border-color:var(--amber); }
.wpcf7-form textarea{ min-height:130px; resize:vertical; }
.wpcf7-form input[type="submit"]{ width:auto; background:var(--amber); border:none; font-weight:700; cursor:pointer; padding:13px 30px; }
.wpcf7-form input[type="submit"]:hover{ background:var(--amber-dark); color:var(--white); }

/* page banner (used on inner pages) */
.page-banner{ background:var(--ink); color:var(--white); padding:56px 0 44px; }
.page-banner h1{ color:var(--white); margin-bottom:8px; }
.page-banner p{ color:#C9D3DE; margin:0; }
.breadcrumb{ font-family:var(--font-mono); font-size:12.5px; color:var(--steel-2); letter-spacing:.05em; margin-bottom:14px; }

/* CTA band */
.cta-band{ background:var(--amber); color:var(--white); padding:56px 0; }
.cta-band .container{ display:flex; align-items:center; justify-content:space-between; gap:24px; flex-wrap:wrap; }
.cta-band h2{ margin:0; color:var(--white); font-size:26px; }
.cta-band p{ margin:6px 0 0; color:rgba(255,255,255,.85); }

/* generic content (default page/single fallback) */
.entry-content{ max-width:76ch; }
.entry-content h2{ margin-top:1.6em; }
/*========================================================
gita
==========================================================*/
/* لوگوی ITX در Hero */
.itx-hero-logo {
	display: flex;
	align-items: center;
	justify-content: center;
}

.itx-hero-logo img {
	display: block;
	width: 70%;
	max-width: 420px;
	height: auto;
	object-fit: contain;
	border: none;
	box-shadow: none;
}
/* لوگوی ITX در Hero */
.amber-text{
  color: var(--amber);
  font-weight: 700;
  font-size: 2em;
  text-align:center ;
}
.map-frame{
    width: 100%;
    height: 350px;
    overflow: hidden;
    border-radius: 12px;
}

.map-frame iframe{
    width: 100%;
    height: 100%;
    border: 0;
    display: block;
}
.ps-solution{
    margin-top:18px;
}

.solution-toggle{
    display:flex;
    align-items:center;
    gap:10px;
    background:none;
    border:0;
    padding:0;
    cursor:pointer;

    font-family:var(--font-display);
    font-size:16px;
    font-weight:700;
    color:var(--amber);
}

.solution-plus{
    width:28px;
    height:28px;
    border:1px solid var(--amber);
    border-radius:50%;

    display:flex;
    align-items:center;
    justify-content:center;

    font-size:22px;
    font-weight:400;
    line-height:1;

    transition:transform .2s ease;
}

.solution-content{
    display:none;
    margin-top:12px;
    padding:18px 22px;

    background:var(--paper-2);
    border-radius:4px;

    font-size:15px;
    line-height:2;
    color:var(--ink-soft);
}

.ps-solution.open .solution-content{
    display:block;
}

.ps-solution.open .solution-plus{
    transform:rotate(45deg);
}

/* Steps + Media */

.steps-layout{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:50px;
    align-items:start;
}


/* فریم ثابت سمت چپ */

.steps-media{
    position:sticky;
    top:100px;
}


.steps-media-frame{
    width:100%;
    height:290px;
    border:1px solid var(--line);
    background:#fff;
    overflow:hidden;
    display:flex;
    align-items:center;
    justify-content:center;
    position:relative;
}


/* عکس و فیلم */

.step-media-item{
    width:100%;
    height:100%;
    object-fit:contain;
    display:none;
}


.step-media-item.active{
    display:block;
}


/* مراحل */

.steps{
    display:flex;
    flex-direction:column;
}


.step{
    cursor:pointer;
    transition:all .25s ease;
    opacity:.65;
}


.step:hover{
    opacity:1;
}


.step.active{
    opacity:1;
}


.step.active h3{
    color:var(--amber);
}


/* موبایل */

@media (max-width:860px){

    .steps-layout{
        grid-template-columns:1fr;
    }

    .steps-media{
        position:relative;
        top:auto;
        order:-1;
    }

    .steps-media-frame{
        height:300px;
    }

}


/* =========================================================
   Module Details
========================================================= */

.module-detail-title {
    margin: 0 0 22px;
    font-size: 21px;
    font-weight: 800;
    line-height: 1.8;
    color: var(--ink);
}

.module-intro {
    margin: 0 0 28px;
    font-size: 16px;
    line-height: 2.2;
    font-weight: 500;
    text-align: justify;
    color: var(--ink-soft);
}

.module-list-title {
    margin: 25px 0 15px;
    font-size: 16px;
    line-height: 2;
    color: var(--ink);
}

.module-features {
    list-style: none;
    margin: 0;
    padding: 0;
}

.module-features li {
    position: relative;
    margin-bottom: 12px;
    padding-right: 28px;
    font-size: 15px;
    line-height: 2;
    color: var(--ink-soft);
}

.module-features li::before {
    content: "✓";
    position: absolute;
    right: 0;
    top: 0;
    font-weight: 800;
    color: var(--amber);
}

.module-image {
    width: 100%;
    margin: 28px 0;
    text-align: center;
}

.module-image img {
    display: inline-block;
    max-width: 100%;
    height: auto;
    border-radius: 8px;
    border: 1px solid var(--line);
}

.module-not-ready {
    font-size: 15px;
    color: var(--steel);
    margin: 0;
}


/* موبایل */

@media (max-width: 760px) {

    .accordion-body {
        padding: 22px 18px;
    }

    .module-detail-title {
        font-size: 18px;
    }

    .module-intro {
        font-size: 15px;
        line-height: 2;
    }

    .module-features li {
        font-size: 14px;
        line-height: 1.9;
    }

}
.module-description img {
    width: 70%;
    max-width: 70%;
    height: auto;
    display: block;
    margin: 10px auto;
}

/* تصاویر داخل ماژول‌ها - 70 درصد اندازه واقعی */
.accordion-body img {
    width: auto !important;
    height: auto !important;
    max-width: 70% !important;
    display: block;
    margin: 8px auto !important;
}
/* ==========================================================================
   FOOTER
   ========================================================================== */

.site-footer{ background:var(--ink); color:#AAB8C7; padding:64px 0 28px; }
.footer-grid{ display:grid; grid-template-columns:1.3fr 1fr 1fr 1fr; gap:40px; margin-bottom:48px; }
.footer-col h4{ color:var(--white); font-size:14.5px; margin-bottom:16px; }
.footer-col p{ font-size:14.5px; color:#9AA9B9; }
.footer-col ul li{ margin-bottom:10px; }
.footer-col a{ font-size:14.5px; color:#AAB8C7; transition:color .15s ease; }
.footer-col a:hover{ color:var(--amber); }
.footer-bottom{
  border-top:1px solid rgba(255,255,255,.12); padding-top:22px;
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;
  font-size:13px; color:#7C8CA0; font-family:var(--font-mono);
}
@media (max-width:860px){ .footer-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .footer-grid{ grid-template-columns:1fr; } }