/* ==========================================================================
   mtemps6 — ABOUT (abo)  صورة "متلزّقة" بشريطين لاصقين + شاحنة 3D طايرة
   قدّامها + ختم "منذ 0000"، وجنبها قيم في ملصقات وعدّادات في كراتين.
   ========================================================================== */
.mtemps6-abo-grid { display: grid; gap: clamp(3rem, 7vw, 5rem); align-items: center; }
.mtemps6-abo-visual { position: relative; padding-block-end: 16%; }
.mtemps6-abo-photo { position: relative; padding: 0.75rem 0.75rem 0; border-radius: var(--mtemps6-r-xs); background: var(--mtemps6-surface); box-shadow: var(--mtemps6-shadow-lift); transform: rotate(2deg); }
html.mtemps6-js .mtemps6-abo-photo:not(.mtemps6-is-in) { transform: translate3d(0, calc(var(--mtemps6-reveal-y) * -1.2), 0) rotate(-6deg); }
.mtemps6-abo-photo .mtemps6-ui-media { --mtemps6-ratio: 9 / 7; border-radius: 2px; }
.mtemps6-abo-caption { padding: var(--mtemps6-sp-2) var(--mtemps6-sp-2) var(--mtemps6-sp-3); color: var(--mtemps6-muted); font-size: var(--mtemps6-fs-sm); font-weight: var(--mtemps6-fw-semibold); text-align: center; }
.mtemps6-abo-tape-a { inset-block-start: -0.8rem; inset-inline-start: 10%; transform: rotate(-8deg); }
.mtemps6-abo-tape-b { inset-block-start: -0.6rem; inset-inline-end: 8%; width: 5.5rem; transform: rotate(10deg); }
.mtemps6-abo-truck { position: absolute; inset-block-end: -2%; inset-inline-end: -6%; width: 62%; --mtemps6-float-r0: -1deg; --mtemps6-float-r1: 1deg; --mtemps6-float-y: 10px; }
.mtemps6-abo-stamp { position: absolute; inset-block-start: 12%; inset-inline-start: -2%; display: grid; gap: 0; padding: 0.6rem 1.1rem; background: var(--mtemps6-surface); font-size: var(--mtemps6-fs-sm); text-align: center; }
.mtemps6-abo-stamp strong { font-size: var(--mtemps6-fs-xl); line-height: 1.1; }
html.mtemps6-js .mtemps6-abo-stamp:not(.mtemps6-is-in) { transform: rotate(-8deg) scale(1.6); }
.mtemps6-abo-stamp.mtemps6-is-in { transform: rotate(-8deg); }

.mtemps6-abo-copy .mtemps6-ui-head { margin-block-end: var(--mtemps6-sp-6); }
.mtemps6-abo-values { display: grid; gap: var(--mtemps6-sp-3); margin: 0 0 var(--mtemps6-sp-6); padding: 0; list-style: none; }
.mtemps6-abo-values li { display: flex; align-items: center; gap: var(--mtemps6-sp-4); padding: var(--mtemps6-sp-3) var(--mtemps6-sp-4); border: var(--mtemps6-hair) dashed var(--mtemps6-line-2); border-radius: var(--mtemps6-r-sm); background: var(--mtemps6-paper); transition: transform var(--mtemps6-dur-3) var(--mtemps6-ease-spring), border-color var(--mtemps6-dur-2); }
.mtemps6-abo-values li:hover { transform: translateX(calc(var(--mtemps6-dir) * 6px)); border-color: var(--mtemps6-deep); }
.mtemps6-abo-values li > span:last-child { display: grid; line-height: 1.45; }
.mtemps6-abo-values small { color: var(--mtemps6-muted); font-size: var(--mtemps6-fs-sm); }
.mtemps6-abo-ico { display: grid; place-items: center; width: 2.75rem; height: 2.75rem; flex-shrink: 0; border-radius: var(--mtemps6-r-sm); background: var(--mtemps6-accent); color: var(--mtemps6-on-accent); }
.mtemps6-abo-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--mtemps6-sp-3); margin: 0; }
.mtemps6-abo-stats > div { position: relative; display: grid; align-content: start; padding: var(--mtemps6-sp-5) var(--mtemps6-sp-3) var(--mtemps6-sp-3); border-radius: var(--mtemps6-r-sm); background: var(--mtemps6-cardboard-soft); text-align: center; overflow: hidden; }
.mtemps6-abo-stats > div::before { content: ""; position: absolute; inset-block-start: 0; inset-inline-start: 50%; width: 1.6rem; height: 100%; margin-inline-start: -0.8rem; background: var(--mtemps6-accent-soft); opacity: 0.7; }
.mtemps6-abo-stats dd { position: relative; order: -1; margin: 0; color: var(--mtemps6-deep); font-size: var(--mtemps6-fs-2xl); font-weight: var(--mtemps6-fw-bold); line-height: 1.1; font-variant-numeric: tabular-nums; }
.mtemps6-abo-stats dt { position: relative; color: var(--mtemps6-text); font-size: var(--mtemps6-fs-xs); font-weight: var(--mtemps6-fw-semibold); }
@media (min-width: 1024px) { .mtemps6-abo-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } .mtemps6-abo-visual { margin-inline-end: 2rem; } }

/* كروت "لماذا تختارنا" (H3 + فقرة) — rahanaql */
/* الأيقونة جنب العنوان بس، والفقرة تحتهم بعرض الكارت كله */
.mtemps6-abo-values li:has(> span > .mtemps6-abo-vt) { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: var(--mtemps6-sp-2) var(--mtemps6-sp-4); }
.mtemps6-abo-values li > span:has(> .mtemps6-abo-vt) { display: contents; }
.mtemps6-abo-vt { margin: 0; font-size: var(--mtemps6-fs-md); line-height: 1.4; }
.mtemps6-abo-vp { grid-column: 1 / -1; margin: 0; color: var(--mtemps6-muted); font-size: var(--mtemps6-fs-sm); line-height: 1.7; }
