/* ===== Local fonts ===== */
@font-face{
  font-family:'IRANSans';
  src:url('../storage/fonts/IRANSans.woff2') format('woff2'),
      url('../storage/fonts/IRANSans.woff') format('woff');
  font-display:swap;
}
@font-face{
  font-family:'Vazir';
  src:url('../storage/fonts/Vazir.woff2') format('woff2'),
      url('../storage/fonts/Vazir.woff') format('woff');
  font-display:swap;
}
@font-face{
  font-family:'MSFFIcons';
  src:url('../storage/fonts/icons.woff2') format('woff2'),
      url('../storage/fonts/icons.woff') format('woff');
  font-display:swap;
}

.ms-fullfront, .ms-fullfront * { box-sizing: border-box; }
.ms-fullfront{
  --bg-img: var(--ms-ff-bg, none);
  --fg: #ffffff;
  --title: #ffffff;
  --muted: rgba(255,255,255,.9);
  --cta-from: #3db6ff;
  --cta-to:   #3a80ff;

  width: 100%;
  min-height: clamp(520px, 78vh, 740px);
  background-image: var(--bg-img);
  background-size: cover;
  background-position: bottom;
  position: relative;
  isolation: isolate;
  /* فضای عمودی جمع‌وجورتر */
  padding: clamp(28px, 4vw, 48px) 0 clamp(110px, 12vh, 160px);
  color: var(--fg);
  font-family: 'IRANSans','Vazir',Tahoma,Arial,sans-serif;
}

/* ===== Layout: لپ‌تاپ چپ | متن راست (مثل قبل) ===== */
.ms-fullfront__inner{
  width: 100%;
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 clamp(16px, 4vw, 32px);

  display: grid;
  grid-template-columns: 1.25fr 1.0fr;   /* لپ‌تاپ پهن‌تر بماند */
  grid-template-areas: "visual content"; /* ← برعکسِ قبلی */
  align-items: center;
  gap: clamp(24px, 4vw, 48px);
}

.ms-fullfront__content{ grid-area: content; align-self: center; }
.ms-fullfront__visual { grid-area: visual;  position: relative; min-height: 300px; }

/* لپ‌تاپ بزرگ (مثل قبل) فقط شیفت متناسب با چپ/راست */
.ms-fullfront__laptop{
  width: 115%;
  max-width: none;
  height: auto;
  display: block;
  transform: translateX(4%);  /* قبلاً -4% بود؛ حالا به سمت راست هل می‌دهیم */
  filter: drop-shadow(0 28px 46px rgba(0,0,0,.26));
}


/* ===== Typography ===== */
.ms-fullfront__badge{
  display:inline-flex; align-items:center; gap:10px;
  background: rgba(255,255,255,.12);
  padding: 8px 12px; border-radius: 999px;
  font-weight: 700; font-size: .95rem; color: var(--muted);
  backdrop-filter: blur(2px);
}
.ms-fullfront__badge-dot{
  width: 6px; height: 6px; border-radius: 50%; background: #5fe1a1;
  box-shadow: 0 0 0 3px rgba(95,225,161,.25);
}
.ms-fullfront__icon-check{ font-family: 'MSFFIcons', sans-serif; font-style: normal; line-height: 1; }
.ms-fullfront__icon-check::before{ content: "✔"; }

/* عنوان کمی بزرگ‌تر */
.ms-fullfront__title{
  margin: 18px 0 10px;
  font-weight: 900;
  line-height: 1.25;
  font-size: clamp(26px, 4.4vw, 56px); /* بزرگ‌تر از قبل */
  color: var(--title);
  letter-spacing: -.2px;
  text-align: right; /* متن فارسی همچنان راست‌چین */
}

.ms-fullfront__subtitle{
  margin: 12px 0 26px;
  font-size: clamp(14px, 1.15vw, 17px);
  color: var(--muted);
  max-width: 44ch;
}

.ms-fullfront__cta{
  display:inline-flex; align-items:center; justify-content:center;
  height:46px; padding:0 20px; border-radius:14px;
  background:linear-gradient(135deg,var(--cta-from),var(--cta-to));
  color:#fff; text-decoration:none; font-weight:800; font-size:1rem;
  box-shadow:0 12px 34px rgba(58,128,255,.36);
  transition:transform .15s ease, filter .2s ease, box-shadow .2s ease;
}
.ms-fullfront__cta:hover{
  transform:translateY(-1px);
  filter:brightness(1.03);
  box-shadow:0 14px 40px rgba(58,128,255,.44);
}



/* کارت‌های شناور با اندازهٔ ذاتی */
.ms-fullfront__float{
  position: absolute;
  width: auto; height: auto; max-width: 100%;
  user-select: none; pointer-events: none;
  will-change: transform;
  animation: msff-float 5.5s ease-in-out infinite;
  filter: drop-shadow(0 8px 20px rgba(0,0,0,.25));
}
/* با چینش جدید کمی جابه‌جایی */
.ms-fullfront__float--a{ top: 8%;  left: 6%;  animation-delay: 0s; }
.ms-fullfront__float--b{ top: 14%; right: 10%; animation-delay: .9s; }
.ms-fullfront__float--c{ top: 38%; left: 14%; animation-delay: 1.6s; }

@keyframes msff-float{
  0%   { transform: translateY(0) rotate(0deg); }
  50%  { transform: translateY(-14px) rotate(-4deg); }
  100% { transform: translateY(0) rotate(0deg); }
}

/* ===== Mobile / Tablet ===== */
@media (max-width: 960px){
  .ms-fullfront{
    padding: clamp(20px,4vw,34px) 0 clamp(60px,8vh,100px); /* فضای خالی کم‌تر */
  }
  .ms-fullfront__inner{
    grid-template-columns: 1fr;
    grid-template-areas:
      "content"
      "visual";
    gap: clamp(16px, 3vw, 28px);
    text-align: center;
  }
  .ms-fullfront__title{ text-align: center; font-size: clamp(24px, 6vw, 40px); }
  .ms-fullfront__subtitle{ margin-left:auto; margin-right:auto; }
  .ms-fullfront__visual{ max-width: 720px; margin: 0 auto; }

  .ms-fullfront__laptop{
    width: 100%;
    transform: none;
  }
  .ms-fullfront__float--a{ top: -2%; left: 10%; }
  .ms-fullfront__float--b{ top: 2%;  right: 8%; }
  .ms-fullfront__float--c{ top: 24%; left: 6%; }
}

/* ===== Dark mode ===== */
@media (prefers-color-scheme: dark){
  .ms-fullfront{ --muted: rgba(255,255,255,.92); }
}