/* =========================
   WIDESH · ACCOUNTING OVERVIEW
   SCOPED: .wacc-
   ========================= */

/* پس‌زمینه (اورورا ملایم) */
.wacc{position:relative;isolation:isolate;background:#fff;overflow:hidden}
.wacc *{box-sizing:border-box}
.wacc-bg{
  position:absolute;inset:0;z-index:0;pointer-events:none;
  background:
    conic-gradient(from 230deg at 80% 10%, rgba(92,47,246,.10), transparent 35%),
    radial-gradient(680px 320px at 8% 92%, rgba(34,211,238,.12), transparent 60%),
    linear-gradient(180deg,#FFFFFF 0%, #F8F7FF 58%, #FFFFFF 100%);
}

/* کانتینر — هم‌ترازی با نمونه‌ی ارسالی (Automation) */
.wacc-container{
  position:relative;z-index:2;
  max-width:1200px;          /* مثل نمونه */
  margin-inline:auto;
  padding:44px 20px;         /* مثل نمونه */
}
@media (min-width:1440px){ .wacc-container{ max-width:1320px } }

/* لایه‌بندی — تصویر راست، محتوا چپ (جمع‌وجور) */
.wacc-layout{
  display:grid;align-items:center;gap:24px;               /* مثل نمونه: gap=24 */
  grid-template-columns: minmax(0,0.95fr) minmax(0,1.05fr);
}
@media (max-width:1024px){ .wacc-layout{ grid-template-columns:1fr } }

/* تصویر (کوچک‌تر و کنترل‌شده) */
.wacc-media{
  margin:0; order:2; /* راست در RTL */
  border-radius:22px; overflow:hidden;
  border:1px solid #E9E1FF;
  background:linear-gradient(180deg,#FFFFFF,#FBF9FF);
  box-shadow:0 24px 60px rgba(27,20,64,.12), inset 0 0 0 1px rgba(255,255,255,.75);
  justify-self:end;
  max-width:520px;               /* سقف عرض تصویر */
}
.wacc-media img{
  display:block;width:100%;height:auto;object-fit:contain;
  aspect-ratio:16/10; max-height:420px;  /* جمع‌وجور مانند نمونه‌ی شما */
}
@media (max-width:1024px){
  .wacc-media{max-width:none}
  .wacc-media img{max-height:none;aspect-ratio:auto}
}

/* محتوا */
.wacc-content{order:1}
.wacc-head{margin-bottom:12px}
.wacc-title{
  font-family:"Lalezar",system-ui;font-weight:400;margin:0 0 6px;
  color:#1B1440;font-size:clamp(26px,3.6vw,40px);
  text-shadow:0 6px 20px rgba(0,0,0,.08)
}
.wacc-subtitle{
  font-family:iransans,Tahoma,sans-serif;color:#4B4B57;margin:0;
  font-size:clamp(14px,1.6vw,16px); line-height:1.95
}

/* تب‌ها — قرص‌های شیشه‌ای + خط زیر متحرک (سایز کمی کوچک‌تر) */
.wacc-tabs{position:relative;display:flex;flex-wrap:wrap;gap:10px;margin-top:12px}
.wacc-tab{
  position:relative;display:inline-flex;align-items:center;gap:8px;
  padding:9px 12px;border-radius:9999px;
  background:linear-gradient(180deg,#FFFFFF,#FBF9FF);
  border:1px solid #E9E1FF;
  font-family:iransans,Tahoma,sans-serif;font-weight:900;font-size:12.5px;
  color:#2A2550;cursor:pointer;box-shadow:0 8px 18px rgba(27,20,64,.08)
}
.wacc-tab i{color:#5C2FF6}
.wacc-tab.is-active{
  color:#0F1027;background:linear-gradient(135deg,#22D3EE,#7CF4FF);border-color:#BFF7FF
}
.wacc-underline{
  position:absolute;inset-inline-start:0;bottom:-6px;height:3px;border-radius:2px;
  background:linear-gradient(90deg,#22D3EE,#7CF4FF);
  width:52px;transform:translateX(0);transition:transform .28s ease, width .28s ease
}

/* پانل‌ها — گلس‌افکت جذاب‌تر */
.wacc-panels{margin-top:16px}
.wacc-panel{
  display:none; position:relative;
  background:linear-gradient(180deg, rgba(255,255,255,.86), rgba(255,255,255,.80));
  backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
  border:1px solid #E6DEFF; border-radius:18px;
  padding:16px; box-shadow:0 18px 40px rgba(27,20,64,.12);
  overflow:hidden;
}
.wacc-panel::before{
  content:""; position:absolute; inset:auto -20% -40% -20%;
  height:140px;
  background: radial-gradient(60% 50% at 50% 50%, rgba(124,244,255,.22), transparent 70%);
  filter: blur(10px);
}
.wacc-panel.is-active{display:block}

/* لیست ویژگی‌ها — کارت‌های جمع‌وجور، راست‌چین */
.wacc-list{list-style:none;margin:0 0 12px 0;padding:0;display:flex;flex-direction:column;gap:10px}
.wacc-list li{
  display:grid;grid-template-columns:36px 1fr;gap:10px;align-items:flex-start;
  padding:10px 12px;border-radius:14px;
  background:linear-gradient(180deg,#FFFFFF,#FBFAFF);
  border:1px solid #EEE8FF; box-shadow:0 10px 24px rgba(27,20,64,.08);
}
.wacc-list i{color:#10B981;font-size:13px;align-self:center}
.wacc-list span{
  font-family:iransans,Tahoma,sans-serif;color:#2A2550;font-size:13.5px;line-height:2
}

/* CTA */
.wacc-cta{
  display:inline-flex;align-items:center;gap:10px;padding:10px 14px;border-radius:9999px;
  background:linear-gradient(135deg,#22D3EE,#7CF4FF);color:#0F1027;font-weight:900;
  border:1px solid rgba(0,0,0,.04);text-decoration:none;
  font-family:iransans,Tahoma,sans-serif;box-shadow:0 10px 26px rgba(27,20,64,.14)
}
.wacc-cta:hover{transform:translateY(-2px)}

/* جلوگیری از اسکرول افقی */
.wacc, .wacc *{max-width:100%}
/* ===== Alignment Fix · Match section gutters with the rest (no HTML change) ===== */

/* Desktop: مجموع عرض ستون‌ها کنترل و کل گرید وسط کانتینر قرار بگیرد */
@media (min-width: 1100px){
  .wacc-layout{
    /* ستون چپ (محتوا) و ستون راست (عکس) با سقف مشخص */
    grid-template-columns: minmax(0, 630px) minmax(0, 630px);
    column-gap: 24px;              /* مثل سکشن‌های دیگر */
    justify-content: center;       /* کل گرید وسط کانتینر؛ گوتر چپ/راست مساوی */
  }

  /* سقف عرض برای محتوا و پانل‌ها تا از کادر بیرون نزنند */
  .wacc-content { max-width: 630px; }
  .wacc-head, .wacc-panels { max-width: 630px; }

  /* سقف عرض تصویر سمت راست؛ فاصله از لبه مثل سکشن‌های دیگر */
  .wacc-media { max-width: 630px; justify-self: end; }
}

/* جلوگیری از هرگونه ناهماهنگی ریز در شکستن خطوط */
.wacc-panel { overflow-wrap: anywhere; }
.wacc-list span { overflow-wrap: anywhere; }