/*
 * بخش‌های صفحه (۱ از ۲): پایه، معرفی، بنرها، فروش ویژه. قالب‌ها در templates/sections/، تنظیم‌ها در DGF_Section_Defs.
 *
 * جهان طراحی: «قفسه زنده». هر محصول شیئی است که می‌شود برداشت (assets/objects.css)، نه تصویر تخت در قاب.
 * زمینه‌های پررنگ از رنگ خود فروشگاه، تیره‌شده تا نوشته سفید خوانا بماند (DGF_Sections::deep).
 * همه زیر .dgf-sec و با متغیرهای «طراحی» افزونه (‎--dgf-accent، ‎--kb-*)؛ پس با هر پوسته‌ای یک‌دست است.
 * --s1/--s2: زمینه پررنگ بخش · --s-on: نوشته روی رنگ اصلی · --s-hue: فام رنگ اصلی · --dgs-top: جای سربرگ شفاف
 */

.dgf-sec { --dgs-ease: cubic-bezier(.2, .8, .2, 1); --dgs-gold: #ffe0a0; --dgs-ink: var(--kb-ink, #14161a); --dgs-mute: var(--kb-mute, #6b7280); --dgs-line: var(--kb-line, #e3e6ed); --dgs-bg: var(--kb-card, #fff); --dgs-soft: var(--kb-soft, #f5f6f9); --dgs-accent: var(--dgf-accent, #1f6feb); --dgs-r: var(--dgf-r-box, 14px); --dgs-rb: var(--dgf-r-btn, 12px); position: relative; color: var(--dgs-ink); font-family: var(--dgf-font, inherit); line-height: 1.9; }
.dgf-sec *, .dgf-sec *::before, .dgf-sec *::after { box-sizing: border-box; }
.dgf-sec :where(h1, h2, h3, p, ul, ol, figure) { margin-top: 0; }
.dgf.dgf-sec a { text-decoration: none; }
/* تیترهای بخش رنگ خود بخش را می‌گیرند (‎--dgs-h روی هر تیتر)، نه رنگ تیتر عمومی «طراحی» که front.css با .dgf.dgf.dgf
   می‌گذارد؛ وگرنه تیتر تیره روی زمینه پررنگ معرفی و فروش ویژه ناپیدا می‌شد. */
.dgf.dgf.dgf.dgf-sec :is(.dgs-title, .dgs-hero__title, .dgs-slide__title, .dgs-show__card h3, .dgs-post__body h3) { color: var(--dgs-h, inherit); }
.dgf.dgf-sec img { border-radius: 0; box-shadow: none; }
.dgf-sec .dgs-wrap { width: min(100% - 40px, var(--dgs-wide, 1200px)); margin-inline: auto; }
.dgf-sec .dgs-sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.dgf-sec .dgs-ic { flex: none; }
.dgf-sec.dgs-bg--soft > section { background: var(--dgs-soft); }
.dgf-sec :focus-visible { outline: 2px solid var(--dgs-accent); outline-offset: 2px; }
.dgf-sec :is(.dgs-hero, .dgs-sale, .dgs-show, .dgs-slider, .dgs-banner) :focus-visible { outline-color: #fff; }

/* دکمه‌ها و سرعنوان */
.dgf-sec .dgs-btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 52px; padding: 0 24px; border-radius: var(--dgs-rb); font-size: 16px; font-weight: 800; line-height: 1.4; white-space: nowrap; transition: transform .2s var(--dgs-ease), box-shadow .2s, background-color .2s, color .2s, border-color .2s; }
.dgf-sec .dgs-btn .dgs-ic { width: 18px; height: 18px; transition: transform .25s var(--dgs-ease); }
.dgf-sec .dgs-btn:hover > .dgs-ic:last-child { transform: translateX(-4px); }
.dgf-sec .dgs-btn--light { background: #fff; color: var(--s2, #14161a); box-shadow: 0 16px 34px -14px rgba(0, 0, 0, .5); }
.dgf-sec .dgs-btn--light:hover { transform: translateY(-2px); color: var(--s2, #14161a); }
.dgf-sec .dgs-btn--ghost { border: 1px solid rgba(255, 255, 255, .42); background: rgba(255, 255, 255, .07); color: #fff; }
.dgf-sec .dgs-btn--ghost:hover { border-color: #fff; background: rgba(255, 255, 255, .15); color: #fff; }
.dgf-sec .dgs-btn--ghost .dgs-ic { color: var(--dgs-gold); }
.dgf-sec .dgs-btn--accent { background: var(--dgs-accent); color: var(--s-on, #fff); box-shadow: 0 16px 32px -16px color-mix(in srgb, var(--dgs-accent) 75%, transparent); }
.dgf-sec .dgs-btn--accent:hover { transform: translateY(-2px); color: var(--s-on, #fff); filter: brightness(1.06); }
.dgf-sec .dgs-head { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 6px 20px; margin-bottom: clamp(20px, 3vw, 32px); }
.dgf-sec .dgs-head .dgs-title { grid-column: 1; margin: 0; font-family: var(--dgf-font-head, inherit); font-size: clamp(25px, 3vw, 38px); font-weight: 900; line-height: 1.35; text-wrap: balance; --dgs-h: var(--dgs-title-c); }
.dgf-sec .dgs-head .dgs-more { grid-column: 2; grid-row: 1; }
.dgf-sec .dgs-head .dgs-text { grid-column: 1 / -1; max-width: 46em; margin: 0; color: var(--dgs-text-c, var(--dgs-mute)); font-size: clamp(15px, 1.3vw, 17px); }
.dgf-sec .dgs-head--center { grid-template-columns: minmax(0, 1fr); justify-items: center; text-align: center; }
.dgf-sec .dgs-more { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; color: var(--dgs-accent); font-weight: 800; }
.dgf-sec .dgs-more .dgs-ic { width: 18px; height: 18px; transition: transform .25s var(--dgs-ease); }
.dgf-sec .dgs-more:hover .dgs-ic { transform: translateX(-4px); }

/* آمدن هنگام پیمایش؛ فقط وقتی assets/sections.js بار شده و کلاس را گذاشته (بی آن همه چیز از اول پیداست). */
.dgs-rv-on .dgs-anim [data-dgs-rv]:not(.is-in) { opacity: 0; transform: translateY(28px); }
.dgs-rv-on .dgs-anim [data-dgs-rv]:not(.is-done) { transition: opacity .8s var(--dgs-ease), transform .8s var(--dgs-ease); transition-delay: calc(var(--i, 0) * 70ms); }

/* ---------- معرفی ---------- */
.dgf-sec .dgs-hero { position: relative; isolation: isolate; overflow: hidden; padding: calc(var(--dgs-top, 0px) + clamp(30px, 5vw, 70px)) 0 clamp(64px, 8vw, 116px); background: linear-gradient(162deg, var(--s1, #1d3d7a) 0%, var(--s2, #0f2147) 78%); color: #fff; }
.dgf-sec .dgs-hero--img { background: linear-gradient(162deg, color-mix(in srgb, var(--s1) 82%, transparent), color-mix(in srgb, var(--s2) 92%, transparent)), var(--s-img) center / cover no-repeat; }
.dgf-sec .dgs-hero--edge { padding-bottom: clamp(78px, 9vw, 130px); }
.dgf-sec .dgs-hero--edge::after { content: ""; position: absolute; z-index: 1; left: -5%; right: -5%; bottom: -1px; height: clamp(34px, 5vw, 76px); background: var(--dgs-page, var(--dgs-bg)); clip-path: ellipse(58% 100% at 50% 100%); }
.dgf-sec .dgs-hero__fx { position: absolute; z-index: -1; inset: 0; pointer-events: none; }
.dgf-sec .dgs-blob { position: absolute; border-radius: 50%; filter: blur(80px); opacity: .5; }
.dgf-sec .dgs-blob--a { left: -12%; top: -24%; width: min(62vw, 760px); aspect-ratio: 1; background: hsl(calc(var(--s-hue2, var(--s-hue)) + 34) 92% 58%); animation: dgs-drift 19s ease-in-out infinite alternate; }
.dgf-sec .dgs-blob--b { left: 18%; bottom: -46%; width: min(44vw, 560px); aspect-ratio: 1; background: hsl(calc(var(--s-hue2, var(--s-hue)) - 40) 88% 56%); opacity: .38; animation: dgs-drift 23s ease-in-out infinite alternate-reverse; }
.dgf-sec .dgs-hero--flip .dgs-blob--a { left: auto; right: -12%; }
@keyframes dgs-drift { to { transform: translate(8%, 6%) scale(1.08); } }
.dgf-sec .dgs-hero__in { position: relative; z-index: 2; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.06fr); grid-template-areas: "txt stage"; align-items: center; gap: clamp(20px, 4vw, 56px); }
.dgf-sec .dgs-hero--flip .dgs-hero__in { grid-template-areas: "stage txt"; grid-template-columns: minmax(0, 1.06fr) minmax(0, 1fr); }
.dgf-sec .dgs-hero__txt { grid-area: txt; }
.dgf-sec .dgs-stage { grid-area: stage; }
.dgf-sec .dgs-hero--solo .dgs-hero__in { grid-template-columns: minmax(0, 1fr); grid-template-areas: "txt"; max-width: 820px; text-align: center; }
.dgf-sec .dgs-hero--solo :is(.dgs-find, .dgs-hero__lead) { margin-inline: auto; }
.dgf-sec .dgs-hero--solo .dgs-hero__go { justify-content: center; }
.dgf-sec .dgs-pill { display: inline-flex; align-items: center; gap: 9px; margin: 0 0 18px; padding: 6px 16px; border: 1px solid rgba(255, 255, 255, .24); border-radius: 99px; background: rgba(255, 255, 255, .12); font-size: 14px; font-weight: 700; -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); animation: dgs-in .7s var(--dgs-ease) both; }
.dgf-sec .dgs-pill__dot { width: 8px; height: 8px; border-radius: 50%; background: #5ef0a6; animation: dgs-ping 2.2s ease-out infinite; }
@keyframes dgs-ping { 0% { box-shadow: 0 0 0 0 rgba(94, 240, 166, .7); } 80%, 100% { box-shadow: 0 0 0 9px rgba(94, 240, 166, 0); } }
.dgf-sec .dgs-hero__title { margin: 0 0 18px; font-family: var(--dgf-font-head, inherit); font-size: clamp(34px, 5vw, 62px); font-weight: 900; line-height: 1.32; text-wrap: balance; --dgs-h: var(--dgs-title-c, #fff); }
.dgf-sec .dgs-w { display: inline-block; animation: dgs-word .9s var(--dgs-ease) both; animation-delay: calc(.1s + var(--i) * 65ms); }
@keyframes dgs-word { from { opacity: 0; transform: translateY(.42em); filter: blur(8px); } }
.dgf-sec .dgs-mark { color: var(--dgs-gold); font-style: normal; background: linear-gradient(currentColor, currentColor) no-repeat right 0 bottom .02em / 0% .09em; animation: dgs-under .9s cubic-bezier(.6, .1, .2, 1) 1.15s forwards; -webkit-box-decoration-break: clone; box-decoration-break: clone; }
@keyframes dgs-under { to { background-size: 100% .09em; } }
.dgf-sec .dgs-hero__lead { max-width: 34em; margin: 0 0 26px; color: var(--dgs-text-c, rgba(255, 255, 255, .88)); font-size: clamp(16px, 1.45vw, 19px); line-height: 2; animation: dgs-in .9s var(--dgs-ease) .45s both; }
@keyframes dgs-in { from { opacity: 0; transform: translateY(18px); } }
.dgf-sec .dgs-find { position: relative; display: flex; align-items: center; max-width: 560px; margin: 0 0 22px; padding: 6px; border: 1px solid rgba(255, 255, 255, .28); border-radius: 99px; background: rgba(255, 255, 255, .14); -webkit-backdrop-filter: blur(16px) saturate(1.3); backdrop-filter: blur(16px) saturate(1.3); box-shadow: 0 22px 44px -22px rgba(0, 0, 0, .55); transition: background-color .2s, border-color .2s; animation: dgs-in .9s var(--dgs-ease) .6s both; }
.dgf-sec .dgs-find:focus-within { border-color: rgba(255, 255, 255, .6); background: rgba(255, 255, 255, .2); }
.dgf-sec .dgs-find:has(input:focus-visible) { outline: 2px solid #fff; outline-offset: 3px; }
.dgf-sec .dgs-find > .dgs-ic { width: 20px; height: 20px; margin-inline: 14px 6px; color: rgba(255, 255, 255, .86); }
.dgf-sec .dgs-find input[type=search] { flex: 1; min-width: 0; height: 48px; margin: 0; padding: 0; border: 0; outline: 0; box-shadow: none; background: none; color: #fff; font: inherit; font-size: 16px; }
.dgf-sec .dgs-find input::placeholder { color: rgba(255, 255, 255, .72); }
.dgf-sec .dgs-find button { height: 48px; margin: 0; padding: 0 24px; border: 0; border-radius: 99px; background: #fff; color: var(--s2, #14161a); font: inherit; font-weight: 800; cursor: pointer; transition: transform .2s; }
.dgf-sec .dgs-find button:hover { transform: scale(1.03); }
.dgf-sec .dgs-hero__go { display: flex; flex-wrap: wrap; gap: 12px; animation: dgs-in .9s var(--dgs-ease) .75s both; }
.dgf-sec .dgs-stage { position: relative; width: 100%; max-width: 660px; aspect-ratio: 1 / .9; justify-self: center; }
.dgf-sec .dgs-stage__glow { position: absolute; inset: 4% 4% 0; border-radius: 50%; background: radial-gradient(closest-side, rgba(255, 255, 255, .26), rgba(255, 255, 255, .06) 60%, transparent); }
.dgf-sec .dgs-stage__o { position: absolute; display: block; translate: calc(var(--px, 0) * var(--dz) * -16px) calc(var(--py, 0) * var(--dz) * -12px); animation: dgs-rise 1.2s var(--dgs-ease) both; animation-delay: calc(.3s + var(--d) * .16s); }
.dgf-sec .dgs-stage__o--1 { --dz: 1.3; z-index: 3; left: 25%; top: 5%; width: 54%; height: 80%; }
.dgf-sec .dgs-stage__o--2 { --dz: .7; z-index: 2; left: -3%; top: -4%; width: 39%; height: 55%; }
.dgf-sec .dgs-stage__o--3 { --dz: 1.9; z-index: 4; left: 0; top: 49%; width: 39%; height: 53%; }
@keyframes dgs-rise { from { opacity: 0; transform: translateY(16%) scale(.9); filter: blur(6px); } }
.dgf-sec .dgs-stage .dg3d { --tx: -14deg; --ty: 26deg; aspect-ratio: auto; }
.dgf-sec .dgs-chip { position: absolute; z-index: 6; display: flex; align-items: center; gap: 10px; padding: 9px 14px 9px 12px; border: 1px solid rgba(255, 255, 255, .3); border-radius: 18px; background: rgba(255, 255, 255, .14); color: #fff; font-size: 13.5px; line-height: 1.55; white-space: nowrap; -webkit-backdrop-filter: blur(14px) saturate(1.4); backdrop-filter: blur(14px) saturate(1.4); box-shadow: 0 20px 40px -20px rgba(0, 0, 0, .55); translate: calc(var(--px, 0) * -26px) calc(var(--py, 0) * -18px); animation: dgs-in .9s var(--dgs-ease) both, dgs-bob 6.5s ease-in-out infinite; }
.dgf-sec .dgs-chip > .dgs-ic { width: 36px; height: 36px; padding: 8px; border-radius: 11px; background: rgba(255, 255, 255, .18); color: var(--dgs-gold); }
.dgf-sec .dgs-chip b { display: block; font-weight: 800; }
.dgf-sec .dgs-chip small { color: rgba(255, 255, 255, .8); }
.dgf-sec .dgs-chip--dl { right: -4%; top: 5%; animation-delay: 1s, 0s; }
.dgf-sec .dgs-chip--key { right: -3%; top: 63%; animation-delay: 1.2s, -2s; }
.dgf-sec .dgs-chip--read { left: 30%; bottom: -7%; animation-delay: 1.4s, -4s; }
.dgf-sec .dgs-hero--flip .dgs-chip--dl, .dgf-sec .dgs-hero--flip .dgs-chip--key { right: auto; left: -4%; }
@keyframes dgs-bob { 50% { transform: translateY(-9px); } }
.dgf-sec .dgs-chip__bar { display: block; width: 118px; height: 6px; margin-top: 6px; overflow: hidden; border-radius: 9px; background: rgba(255, 255, 255, .22); }
.dgf-sec .dgs-chip__bar i { display: block; width: 0; height: 100%; margin-inline-start: auto; border-radius: inherit; background: #5ef0a6; animation: dgs-fill 3.8s cubic-bezier(.45, 0, .2, 1) infinite; }
@keyframes dgs-fill { 0% { width: 0; } 55%, 92% { width: 100%; } 100% { width: 100%; opacity: 0; } }
.dgf-sec .dgs-chip code { display: block; padding: 0; background: none; color: #fff; font: 700 13px/1.6 ui-monospace, Consolas, monospace; letter-spacing: .04em; }
.dgf-sec .dgs-chip code i { font-style: normal; animation: dgs-key 4s steps(1) infinite; }
.dgf-sec .dgs-chip code i + i { animation-delay: .5s; }
@keyframes dgs-key { 0%, 12% { opacity: .25; } 13%, 100% { opacity: 1; } }
.dgf-sec .dgs-ring { flex: none; width: 36px; height: 36px; border-radius: 50%; background: conic-gradient(#5ef0a6 0 42%, rgba(255, 255, 255, .2) 42% 100%); -webkit-mask: radial-gradient(closest-side, transparent 66%, #000 68%); mask: radial-gradient(closest-side, transparent 66%, #000 68%); }

/* ---------- بنرها ---------- */
.dgf-sec .dgs-banners { padding: clamp(14px, 2.4vw, 30px) 0; }
.dgf-sec .dgs-banners__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(12px, 1.6vw, 20px); }
.dgf-sec .dgs-banners--l3 .dgs-banners__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.dgf-sec .dgs-banners--l1 .dgs-banners__grid { grid-template-columns: minmax(0, 1fr); }
/* یکی بزرگ و دو کوچک: بلندی هر کوچک نیمی از بزرگ (دست‌کم)، و اگر نوشته‌اش بیشتر خواست، بلندتر؛ هرگز روی هم نمی‌افتند. */
.dgf-sec .dgs-banners--l12 .dgs-banners__grid { grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); grid-template-rows: repeat(2, minmax(calc(var(--bh) / 2 + 30px), auto)); }
.dgf-sec .dgs-banners--l12 .dgs-banner { min-height: 0; }
.dgf-sec .dgs-banners--l12 .dgs-banner:first-child { grid-row: span 2; min-height: var(--bh); }
.dgf-sec .dgs-banner { --bc: hsl(var(--bh2, 220) 62% 46%); --bc2: hsl(calc(var(--bh2, 220) + 34) 66% 22%); position: relative; isolation: isolate; display: flex; min-height: var(--bh); overflow: hidden; border-radius: calc(var(--dgs-r) + 6px); background: linear-gradient(140deg, var(--bc), var(--bc2)); color: #fff; transition: transform .35s var(--dgs-ease), box-shadow .35s; }
.dgf-sec .dgs-banner:hover { transform: translateY(-4px); box-shadow: 0 28px 50px -26px rgba(10, 14, 30, .55); color: #fff; }
.dgf-sec .dgs-banner--dark { color: #14161a; }
.dgf-sec .dgs-banner--dark.has-color { --bc2: color-mix(in srgb, var(--bc) 62%, #fff); }
.dgf-sec .dgs-banner--dark:hover { color: #14161a; }
.dgf-sec .dgs-banner::before { content: ""; position: absolute; z-index: -1; inset: 0; background: radial-gradient(70% 90% at 15% 20%, rgba(255, 255, 255, .18), transparent 60%), repeating-linear-gradient(125deg, transparent 0 34px, rgba(255, 255, 255, .05) 34px 68px); }
.dgf-sec .dgs-banner.has-img::before { background: linear-gradient(90deg, transparent 25%, rgba(8, 11, 24, .62)); }
.dgf-sec .dgs-banner--dark.has-img::before { background: linear-gradient(90deg, transparent 25%, rgba(255, 255, 255, .7)); }
.dgf-sec .dgs-banner__img { position: absolute; z-index: -2; inset: 0; width: 100%; height: 100%; max-width: none; object-fit: cover; transition: transform .8s var(--dgs-ease); }
.dgf-sec .dgs-banner:hover .dgs-banner__img { transform: scale(1.05); }
.dgf-sec .dgs-banner__obj { position: absolute; z-index: -1; inset-block: 6% 4%; inset-inline-end: 2%; width: 46%; }
.dgf-sec .dgs-banner__obj .dg3d { aspect-ratio: auto; }
.dgf-sec .dgs-banner__txt { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 8px; max-width: 58%; padding: clamp(18px, 3vw, 34px); }
.dgf-sec .dgs-banner__title { font-family: var(--dgf-font-head, inherit); font-size: clamp(19px, 2.1vw, 27px); font-weight: 900; line-height: 1.45; text-wrap: balance; }
.dgf-sec .dgs-banner__text { font-size: 15px; opacity: .88; }
.dgf-sec .dgs-banner__btn { display: inline-flex; align-items: center; gap: 8px; margin-top: 8px; padding: 9px 18px; border-radius: 99px; background: rgba(255, 255, 255, .18); font-size: 14.5px; font-weight: 800; -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); transition: background-color .2s; }
.dgf-sec .dgs-banner--dark .dgs-banner__btn { background: rgba(10, 14, 30, .1); }
.dgf-sec .dgs-banner:hover .dgs-banner__btn { background: rgba(255, 255, 255, .3); }
.dgf-sec .dgs-banner__btn .dgs-ic { width: 16px; height: 16px; transition: transform .25s var(--dgs-ease); }
.dgf-sec .dgs-banner:hover .dgs-banner__btn .dgs-ic { transform: translateX(-4px); }

/* ---------- فروش ویژه ---------- */
.dgf-sec .dgs-sale { position: relative; isolation: isolate; overflow: hidden; padding: clamp(34px, 5vw, 60px) 0 clamp(26px, 4vw, 44px); background: linear-gradient(128deg, var(--s1, #a3262a), var(--s2, #5a1416)); color: #fff; }
.dgf-sec--sale { margin-block: clamp(20px, 3vw, 40px); }
.dgf-sec .dgs-sale__fx { position: absolute; z-index: -1; inset: 0; background: repeating-linear-gradient(115deg, transparent 0 46px, rgba(255, 255, 255, .045) 46px 92px), radial-gradient(50% 90% at 88% 10%, rgba(255, 255, 255, .2), transparent 70%); }
.dgf-sec .dgs-sale__in { display: grid; grid-template-columns: minmax(220px, 260px) minmax(0, 1fr); align-items: start; gap: clamp(20px, 3vw, 36px); }
.dgf-sec .dgs-sale__lead { position: sticky; top: calc(var(--dgs-top, 0px) + 20px); display: flex; flex-direction: column; align-items: flex-start; gap: 12px; padding-top: 10px; }
.dgf-sec .dgs-sale__bolt .dgs-ic { width: 56px; height: 56px; padding: 13px; border-radius: 18px; background: rgba(255, 255, 255, .16); color: var(--dgs-gold); animation: dgs-zap 2.6s ease-in-out infinite; }
@keyframes dgs-zap { 0%, 70%, 100% { transform: none; } 75% { transform: rotate(-10deg) scale(1.08); } 82% { transform: rotate(8deg) scale(1.08); } }
.dgf-sec .dgs-sale .dgs-title { margin: 0; font-family: var(--dgf-font-head, inherit); font-size: clamp(30px, 3.4vw, 44px); font-weight: 900; line-height: 1.2; --dgs-h: var(--dgs-title-c, #fff); }
.dgf-sec .dgs-sale__sum { margin: 0; color: rgba(255, 255, 255, .92); font-size: 16px; }
.dgf-sec .dgs-sale__sum b { color: var(--dgs-gold); font-size: 1.35em; font-weight: 900; }
.dgf-sec .dgs-sale .dgs-btn--light { min-height: 48px; }
.dgf-sec .dgs-clock__cap { display: block; margin-bottom: 8px; color: rgba(255, 255, 255, .84); font-size: 13px; }
.dgf-sec .dgs-clock__row { display: flex; gap: 10px; }
.dgf-sec .dgs-clock__u { display: flex; flex-direction: column; align-items: center; gap: 5px; }
.dgf-sec .dgs-clock__n { display: flex; gap: 3px; }
.dgf-sec .dgs-clock__n b { display: grid; place-items: center; width: 27px; height: 40px; border-radius: 9px; background: #fff linear-gradient(transparent 50%, rgba(0, 0, 0, .05) 50%); color: var(--s2, #5a1416); font-size: 22px; font-weight: 900; line-height: 1; box-shadow: 0 8px 16px -8px rgba(0, 0, 0, .5); transform-origin: 50% 0; }
.dgf-sec .dgs-clock__n b.is-flip { animation: dgs-flip .5s var(--dgs-ease); }
@keyframes dgs-flip { from { opacity: .25; transform: perspective(180px) rotateX(-80deg); } }
.dgf-sec .dgs-clock__u small { color: rgba(255, 255, 255, .86); font-size: 12px; }
.dgf-sec .dgs-rail { position: relative; min-width: 0; }
.dgf-sec .dgs-rail__track { display: grid; grid-auto-flow: column; grid-auto-columns: clamp(208px, 21vw, 248px); gap: 16px; overflow-x: auto; overscroll-behavior-x: contain; padding: 8px 4px 20px; scroll-snap-type: x mandatory; scroll-padding-inline: 4px; scrollbar-width: none; cursor: grab; }
.dgf-sec .dgs-rail__track::-webkit-scrollbar { display: none; }
.dgf-sec .dgs-rail__track.is-drag { scroll-snap-type: none; cursor: grabbing; }
.dgf-sec .dgs-rail__track.is-drag * { pointer-events: none; }
.dgf-sec .dgs-rail__item { display: flex; scroll-snap-align: start; }
.dgf-sec .dgs-rail__item .dgf-pc { flex: 1 1 auto; }
.dgf-sec .dgs-rail__nav { display: flex; align-items: center; gap: 14px; }
.dgf-sec .dgs-rail__btn { display: grid; flex: none; place-items: center; width: 44px; height: 44px; margin: 0; padding: 0; border: 1px solid rgba(255, 255, 255, .42); border-radius: 50%; background: rgba(255, 255, 255, .1); color: #fff; cursor: pointer; transition: background-color .2s; }
.dgf-sec .dgs-rail__btn:hover { background: rgba(255, 255, 255, .22); }
.dgf-sec .dgs-rail__btn[data-dgs-go="-1"] .dgs-ic { transform: scaleX(-1); }
.dgf-sec .dgs-rail__bar { position: relative; flex: 1; height: 4px; overflow: hidden; border-radius: 9px; background: rgba(255, 255, 255, .22); }
.dgf-sec .dgs-rail__bar i { position: absolute; inset: 0; border-radius: inherit; background: #fff; transform-origin: 100% 50%; transform: translateX(calc(var(--x, 0) * -100%)) scaleX(var(--w, .25)); transition: transform .35s var(--dgs-ease); }
@media (min-width: 861px) {
	/* ریل تا لبه صفحه ادامه دارد (سوی پایان)؛ کارت آخر هم تا جای خودش می‌آید. */
	.dgf-sec .dgs-rail__track { margin-inline-end: calc((100vw - min(100vw - 40px, var(--dgs-wide, 1200px))) / -2); padding-inline-end: calc((100vw - min(100vw - 40px, var(--dgs-wide, 1200px))) / 2); }
}

@media (max-width: 1080px) {
	.dgf-sec .dgs-stage { max-width: 520px; }
	.dgf-sec .dgs-chip--key { display: none; }
}
@media (max-width: 860px) {
	.dgf-sec .dgs-hero__in, .dgf-sec .dgs-hero--flip .dgs-hero__in { grid-template-columns: minmax(0, 1fr); grid-template-areas: "txt" "stage"; text-align: center; }
	.dgf-sec .dgs-hero__txt { display: flex; flex-direction: column; align-items: center; }
	.dgf-sec .dgs-find { width: 100%; }
	.dgf-sec .dgs-hero__go { justify-content: center; }
	.dgf-sec .dgs-stage { max-width: 440px; margin-top: 4px; }
	.dgf-sec .dgs-chip { padding: 7px 11px 7px 9px; font-size: 12.5px; }
	.dgf-sec .dgs-chip > .dgs-ic { width: 30px; height: 30px; padding: 6px; }
	.dgf-sec .dgs-chip--dl { right: -2%; top: 2%; }
	.dgf-sec .dgs-chip--read { left: auto; right: 4%; bottom: 2%; }
	.dgf-sec .dgs-banners__grid, .dgf-sec .dgs-banners--l3 .dgs-banners__grid, .dgf-sec .dgs-banners--l12 .dgs-banners__grid { grid-template-columns: minmax(0, 1fr); grid-template-rows: none; }
	.dgf-sec .dgs-banners--l12 .dgs-banner:first-child { grid-row: auto; }
	.dgf-sec .dgs-banner { min-height: max(180px, calc(var(--bh) * .75)); }
	.dgf-sec .dgs-sale__in { grid-template-columns: minmax(0, 1fr); }
	.dgf-sec .dgs-sale__lead { position: static; display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; column-gap: 14px; padding-top: 0; }
	.dgf-sec .dgs-sale__bolt { grid-row: span 2; }
	.dgf-sec .dgs-sale__lead > :is(.dgs-clock, .dgs-btn) { grid-column: 1 / -1; }
	.dgf-sec .dgs-sale .dgs-btn--light { justify-self: start; }
	.dgf-sec .dgs-rail__track { grid-auto-columns: min(72vw, 260px); margin-inline: calc((100vw - 100%) / -2); padding-inline: calc((100vw - 100%) / 2); scroll-padding-inline: calc((100vw - 100%) / 2); }
}
@media (max-width: 520px) {
	.dgf-sec .dgs-hero__title { font-size: 31px; }
	.dgf-sec .dgs-find button { padding: 0 16px; }
	.dgf-sec .dgs-hero__go .dgs-btn { flex: 1 1 100%; }
	.dgf-sec .dgs-clock__n b { width: 23px; height: 34px; font-size: 19px; }
	.dgf-sec .dgs-chip--read { display: none; }
	.dgf-sec .dgs-banner__txt { max-width: 66%; }
}
@media (prefers-reduced-motion: reduce) {
	.dgf-sec *, .dgf-sec *::before, .dgf-sec *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; animation-delay: 0s !important; transition-duration: .01ms !important; }
	.dgf-sec .dgs-mark { background-size: 100% .09em; }
	.dgf-sec .dgs-chip__bar i { width: 100%; opacity: 1; }
}
