/* =========================================================
   صفحه‌ساز روناس — استایل سیستم سکشن‌ها
   (بعد از ronas.css لود می‌شود؛ کلاس‌های اصلی سایت دست‌نخورده می‌مانند)
   ========================================================= */

/* هدر/فوتر داخل نگهدارنده‌ای هستند که در صفحه‌ساز قابل انتخاب است؛ نگهدارنده جعبه نمی‌سازد تا sticky بودن هدر حفظ شود */
[data-chrome]:not([hidden]) { display: contents; }

/* ---------- استایل‌های اختصاصی سکشن‌های صفحهٔ اصلی (قبلاً inline در Index/_Head) ---------- */
/* تخصص‌ها: ارتفاع کارت‌های دپارتمان هم‌اندازهٔ کارت تصویری */
.sec.sec-services .field-icon{height:auto;margin-bottom:6px}
.sec.sec-services .dept-icon{width:64px;height:64px;margin-bottom:8px}
.sec.sec-services .dept-icon svg{width:64px;height:64px}
@media (max-width:575.98px){
  .sec.sec-services .card-ronas b{font-size:.9rem}
}
/* نمونه‌کارها: کادر ثابت ۳:۴ تا عکس‌های با ابعاد مختلف هم‌اندازه دیده شوند */
.sec.sec-portfolio .ba-shot{height:auto;aspect-ratio:3/4;overflow:hidden;cursor:zoom-in}
.sec.sec-portfolio .ba-shot.ba-wide{aspect-ratio:3/2}
.sec.sec-portfolio .ba-shot img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .35s ease}
.sec.sec-portfolio .ba-shot:hover img{transform:scale(1.04)}
.sec.sec-portfolio .ba-lbl{z-index:1}
.pf-modal .pf-full{max-height:75vh;width:100%;object-fit:contain;border-radius:12px;background:#f3f6f6}
/* اسلایدر مقایسهٔ قبل/بعد داخل مودال */
.pf-cmp{--r:.75;position:relative;aspect-ratio:var(--r);width:min(100%,calc(72vh * var(--r)));margin:auto;
  border-radius:14px;overflow:hidden;background:#eef2f2;cursor:ew-resize;touch-action:pan-y;-webkit-user-select:none;user-select:none}
.pf-cmp-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none}
.pf-cmp-before{position:absolute;inset:0;clip-path:inset(0 0 0 var(--x))}
.pf-cmp-line{position:absolute;top:0;bottom:0;left:var(--x);width:3px;margin-left:-1.5px;background:#fff;
  box-shadow:0 0 10px rgba(0,0,0,.35);pointer-events:none}
.pf-cmp-knob{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:44px;height:44px;border-radius:50%;
  background:var(--rn-primary);color:#fff;border:3px solid #fff;display:flex;align-items:center;justify-content:center;
  box-shadow:0 6px 16px rgba(0,0,0,.3);font-size:12px;direction:ltr;transition:transform .15s}
.pf-cmp.dragging .pf-cmp-knob{transform:translate(-50%,-50%) scale(1.1)}
.pf-cmp-tag{position:absolute;top:12px;font-size:11px;font-weight:800;letter-spacing:.06em;padding:4px 12px;border-radius:999px;color:#fff;pointer-events:none}
.pf-cmp-tag.b{right:12px;background:rgba(47,80,79,.8)}
.pf-cmp-tag.a{left:12px;background:var(--rn-pink)}
.pf-cmp-range{position:absolute;inset:0;width:100%;height:100%;opacity:0;pointer-events:none;margin:0}
.pf-cmp:has(.pf-cmp-range:focus-visible) .pf-cmp-knob{outline:3px solid var(--rn-pink);outline-offset:2px}
/* مودال «درخواست ثبت شد» فرم مشاوره */
.rn-booking-done{border:none;border-radius:28px;box-shadow:0 30px 60px -20px rgba(15,61,62,.35)}
.rn-booking-done-tick{width:76px;height:76px;margin:auto;border-radius:50%;display:grid;place-items:center;color:#fff;
  background:var(--rn-primary);box-shadow:0 0 0 10px var(--rn-primary-soft);animation:rnTickPop .45s ease}
.rn-booking-done-tick svg{width:38px;height:38px}
@keyframes rnTickPop{0%{transform:scale(.4);opacity:0}70%{transform:scale(1.08)}100%{transform:scale(1);opacity:1}}

/* ---------- ظاهر قابل تنظیم سکشن‌ها (تب «ظاهر» صفحه‌ساز) ---------- */
.sec.sb-box { position: relative; border-radius: 24px; padding-inline: clamp(16px, 3vw, 40px); }
.sec.sb-white { background: #fff; box-shadow: 0 .125rem .25rem rgba(0,0,0,.075); }
.sec.sb-tint { background: var(--rn-primary-soft); }
.sec.sb-dark { background: linear-gradient(135deg, var(--rn-festival) 0%, #0b2e2f 100%); }
.sec.sb-custom { background: var(--sec-bg); }
.sec.sb-image { background: linear-gradient(var(--sec-overlay), var(--sec-overlay)), var(--sec-img) center / cover no-repeat; }

/* متن روشن روی زمینهٔ تیره: توکن‌ها در همین سکشن بازتعریف می‌شوند */
.txt-light { --rn-ink: #eef7f6; --rn-grey: #bcd5d3; --bs-body-color: #eef7f6; color: #eef7f6; }
.txt-light .text-ink, .txt-light .text-muted-2 { color: inherit !important; }
.txt-light .text-muted-2 { opacity: .85; }
.txt-dark { --rn-ink: #2f504f; --rn-grey: #6b7280; color: #2f504f; }

/* فاصله‌ها */
.sec.spt-0 { padding-top: 0 !important; }    .sec.spb-0 { padding-bottom: 0 !important; }
.sec.spt-xs { padding-top: .75rem !important; } .sec.spb-xs { padding-bottom: .75rem !important; }
.sec.spt-sm { padding-top: 1.5rem !important; } .sec.spb-sm { padding-bottom: 1.5rem !important; }
.sec.spt-md { padding-top: 3rem !important; }   .sec.spb-md { padding-bottom: 3rem !important; }
.sec.spt-lg { padding-top: 4.5rem !important; } .sec.spb-lg { padding-bottom: 4.5rem !important; }
.sec.spt-xl { padding-top: 6rem !important; }   .sec.spb-xl { padding-bottom: 6rem !important; }

/* عرض: سکشن‌ها داخل main.container هستند */
.sec.sw-narrow { max-width: 860px; margin-inline: auto; }
.sec.sw-full { width: 100vw; margin-inline: calc(50% - 50vw); border-radius: 0; padding-inline: max(16px, calc(50vw - 50%)); }

@media (max-width: 991.98px) { .hide-mobile { display: none !important; } }
@media (min-width: 992px) { .hide-desktop { display: none !important; } }

/* ---------- سکشن‌های عمومی ---------- */
.rn-prose { color: var(--rn-grey); font-size: 15px; line-height: 2.1; }
.rn-prose > *:last-child { margin-bottom: 0; }
.rn-prose h2, .rn-prose h3, .rn-prose h4 { color: var(--rn-ink); font-weight: 900; margin: 1.4em 0 .6em; }
.rn-prose h2 { font-size: 1.4rem; } .rn-prose h3 { font-size: 1.2rem; } .rn-prose h4 { font-size: 1.05rem; }
.rn-prose a { color: var(--rn-primary); text-underline-offset: 4px; }
.rn-prose ul, .rn-prose ol { padding-inline-start: 1.4em; }
.rn-prose img { max-width: 100%; height: auto; border-radius: 16px; }
.rn-prose blockquote { margin: 1.2em 0; padding: 12px 18px; border-inline-start: 4px solid var(--rn-primary-strong); background: var(--rn-primary-soft); border-radius: 12px; }
.rn-prose b, .rn-prose strong { color: var(--rn-ink); }
.rn-justify { text-align: justify; }

.rn-check-list { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; color: var(--rn-ink); font-weight: 700; }
.rn-check-list li { display: flex; align-items: center; gap: 10px; }
.rn-check-list svg { width: 24px; height: 24px; padding: 5px; border-radius: 50%; background: var(--rn-primary-soft); color: var(--rn-primary); flex: none; }

.rn-card-ic { width: 56px; height: 56px; border-radius: 18px; display: grid; place-items: center; background: var(--rn-primary-soft); color: var(--rn-primary); font-size: 1.6rem; }
.rn-card-ic svg { width: 30px; height: 30px; }

.rn-banner { display: flex; align-items: center; gap: 22px; border-radius: 32px; position: relative; overflow: hidden; }
.rn-banner-dark { background: linear-gradient(135deg, var(--rn-festival) 0%, #0b2e2f 100%); color: #fff; }
.rn-banner-dark p { color: #d9efee; }
.rn-banner-brand { background: linear-gradient(135deg, var(--rn-primary-strong) 0%, var(--rn-primary) 100%); color: #fff; }
.rn-banner-pink { background: linear-gradient(135deg, #ff2d7d 0%, var(--rn-pink) 100%); color: #fff; }
.rn-banner-soft { background: var(--rn-primary-soft); border: 1px solid var(--rn-primary-border); color: var(--rn-ink); }
.rn-banner-ic { width: 60px; height: 60px; border-radius: 20px; display: grid; place-items: center; flex: none; background: rgba(255,255,255,.14); font-size: 1.7rem; }
.rn-banner-soft .rn-banner-ic { background: #fff; color: var(--rn-primary); }
.rn-banner-ic svg { width: 30px; height: 30px; }
@media (max-width: 767.98px) { .rn-banner { flex-direction: column; text-align: center; } }

.rn-faq .accordion-item { border: 1px solid var(--rn-line); border-radius: 16px !important; overflow: hidden; margin-bottom: 10px; }
.rn-faq .accordion-button { font-weight: 800; color: var(--rn-ink); background: #fff; box-shadow: none; gap: 10px; }
.rn-faq .accordion-button:not(.collapsed) { background: var(--rn-primary-soft); color: var(--rn-primary); }
.rn-faq .accordion-button::after { margin-inline-start: auto; margin-inline-end: 0; }
.rn-faq .accordion-body { font-size: 14px; }

.rn-logos { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 24px 44px; }
.rn-logos img { height: 44px; width: auto; max-width: 170px; object-fit: contain; transition: filter .3s, opacity .3s; }
.rn-logos-gray img { filter: grayscale(1); opacity: .6; }
.rn-logos-gray img:hover, .rn-logos-gray a:hover img { filter: none; opacity: 1; }

.sec-spacer { padding: 0 !important; }
.rn-spacer { height: var(--h); display: grid; place-items: center; }
.rn-spacer-line::before { content: ''; width: 100%; height: 1px; background: var(--rn-line); }
@media (max-width: 767.98px) { .rn-spacer { height: var(--hm); } }

/* طراحی آزاد (GrapesJS): بلوک‌های پایه سازگار با طراحی سایت */
.vb-root { position: relative; }
.vb-root img { max-width: 100%; height: auto; }
.vb-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 24px; align-items: start; }
.vb-col { min-height: 40px; }
.vb-card { padding: 24px; background: #fff; border: 1px solid var(--rn-line); border-radius: 24px; }
.vb-card h3 { font-size: 1.05rem; font-weight: 900; color: var(--rn-ink); }
.vb-card p { margin: 8px 0 0; color: var(--rn-grey); }
.vb-quote { margin: 0; padding: 16px 22px; border-inline-start: 4px solid var(--rn-primary-strong); background: var(--rn-primary-soft); border-radius: 14px; font-size: 1.05rem; color: var(--rn-ink); }
.vb-hr { border: 0; height: 1px; background: var(--rn-line); margin: 24px 0; opacity: 1; }
.vb-h { font-size: clamp(1.4rem, 3vw, 2.1rem); font-weight: 900; color: var(--rn-ink); }
.vb-p { color: var(--rn-grey); font-size: 15px; line-height: 2.1; }
.vb-btns { display: flex; gap: 10px; flex-wrap: wrap; }
.vb-video { position: relative; aspect-ratio: 16 / 9; border-radius: 24px; overflow: hidden; }
.vb-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

/* راهنماهای صفحه‌ساز */
.ed-note { color: var(--rn-grey); font-size: 14px; padding: 18px; border: 1.5px dashed var(--rn-primary-border); border-radius: 16px; display: block; text-align: center; }
.ed-empty { margin: 120px auto; max-width: 520px; text-align: center; color: var(--rn-grey); padding: 40px; border: 2px dashed var(--rn-primary-border); border-radius: 24px; }

@media (prefers-reduced-motion: reduce) {
  .sec *, .sec *::before, .sec *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* بلوک محتوا (لندینگ‌های تبدیل‌شده): بدون جعبهٔ اضافه تا چیدمان قبلی دقیقاً حفظ شود */
.sec-block { display: contents; }
.sec-block > section { scroll-margin-top: 96px; }