/* ============================================================
   FOURIX CSS NOTE — System Showcase
   Gallery / Lightbox / المواصفات الكاملة للأنظمة.
   راجع public/assets/css/README_AR.md قبل التعديل الكبير.
   ============================================================ */

/* FOURIX V32 — real system screenshots + complete specifications */
.v32-showcase-section{padding:88px 0;background:#fff;scroll-margin-top:138px}.v32-showcase-section.soft{background:#f5f8fb}.v32-showcase-head{max-width:820px;margin-bottom:28px}.v32-showcase-head h2{font-size:clamp(2rem,3.8vw,3rem);font-weight:900;color:#0a1d30;margin:.35rem 0}.v32-showcase-head p{color:#718394;line-height:1.9;margin:0}.v32-gallery-shell{border:1px solid #dce7ef;border-radius:30px;background:#fff;padding:18px;box-shadow:0 22px 60px rgba(8,45,78,.08)}
.v32-gallery-toolbar{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:16px;flex-wrap:wrap}.v32-gallery-plan-tabs{display:flex;gap:8px;flex-wrap:wrap}.v32-gallery-plan-tabs button{border:1px solid #d6e2eb;background:#f8fbfd;color:#50687a;border-radius:999px;padding:10px 16px;font-family:inherit;font-weight:900;transition:.2s}.v32-gallery-plan-tabs button:hover{border-color:#9bc5eb;transform:translateY(-1px)}.v32-gallery-plan-tabs button.active{background:#0d73df;border-color:#0d73df;color:#fff;box-shadow:0 8px 22px rgba(13,115,223,.2)}.v32-gallery-meta{display:flex;align-items:center;gap:10px;color:#718394;font-size:.86rem;font-weight:800}.v32-gallery-meta strong{color:#0a1d30}
.v32-gallery-stage{position:relative;overflow:hidden;border-radius:22px;background:#071827;aspect-ratio:16/9;display:grid;place-items:center}.v32-gallery-stage img{width:100%;height:100%;object-fit:contain;background:#071827;cursor:zoom-in}.v32-gallery-stage button{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.18);background:rgba(3,15,26,.68);color:#fff;display:grid;place-items:center;backdrop-filter:blur(8px);z-index:2}.v32-gallery-stage button:hover{background:#1477ee}.v32-gallery-prev{right:14px}.v32-gallery-next{left:14px}.v32-gallery-caption{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 2px 2px;color:#516a7d;font-size:.84rem}.v32-gallery-caption strong{color:#0a1d30}.v32-gallery-thumbs{display:flex;gap:10px;overflow-x:auto;padding:12px 2px 4px;scrollbar-width:thin}.v32-gallery-thumb{flex:0 0 132px;border:2px solid transparent;border-radius:14px;background:#eef4f8;padding:0;overflow:hidden;aspect-ratio:16/9;transition:.18s}.v32-gallery-thumb img{width:100%;height:100%;object-fit:cover}.v32-gallery-thumb:hover{transform:translateY(-2px)}.v32-gallery-thumb.active{border-color:#1477ee;box-shadow:0 0 0 3px rgba(20,119,238,.12)}
.v32-spec-summary{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:20px}.v32-spec-stat{border:1px solid #dce7ef;border-radius:20px;background:#fff;padding:18px}.v32-spec-stat small{display:block;color:#74889a;font-weight:800}.v32-spec-stat strong{display:block;color:#0a1d30;font-size:1.25rem;margin-top:4px}.v32-spec-list{display:grid;gap:12px}.v32-spec-group{border:1px solid #dce7ef;border-radius:22px;background:#fff;overflow:hidden}.v32-spec-group summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:18px;padding:20px 22px;color:#0a1d30;font-weight:900}.v32-spec-group summary::-webkit-details-marker{display:none}.v32-spec-group summary span{display:flex;align-items:center;gap:10px}.v32-spec-group summary span i{width:40px;height:40px;border-radius:12px;background:#edf5ff;color:#1477ee;display:grid;place-items:center}.v32-spec-group summary>i{transition:.2s;color:#73889a}.v32-spec-group[open] summary>i{transform:rotate(45deg)}.v32-spec-body{border-top:1px solid #e7eef3;padding:20px 22px}.v32-spec-body p{color:#657d8f;line-height:1.85}.v32-spec-items{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px 18px}.v32-spec-items div{display:flex;gap:9px;align-items:flex-start;color:#425b70;line-height:1.7;font-size:.9rem}.v32-spec-items i{color:#16a36d;margin-top:5px;flex:none}
.v32-system-hero-shot{position:relative;width:100%;height:100%;min-height:300px;border-radius:28px;overflow:hidden;background:#06131f;border:1px solid rgba(255,255,255,.12);box-shadow:0 24px 70px rgba(0,0,0,.22)}.v32-system-hero-shot:before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 65%,rgba(3,14,24,.82));z-index:1;pointer-events:none}.v32-system-hero-shot img{width:100%;height:100%;min-height:300px;object-fit:contain;background:#06131f}.v32-system-hero-shot .v32-hero-badge{position:absolute;right:16px;bottom:16px;z-index:2;background:rgba(3,20,33,.78);color:#fff;border:1px solid rgba(255,255,255,.15);border-radius:14px;padding:10px 13px;backdrop-filter:blur(10px)}.v32-system-hero-shot .v32-hero-badge strong{display:block;font-size:.9rem}.v32-system-hero-shot .v32-hero-badge small{color:#bcd0df}
.v32-shot-count{display:inline-flex!important;width:auto!important;height:auto!important;background:#edf5ff!important;color:#1477ee!important;border-radius:999px!important;padding:4px 8px!important;font-size:.68rem!important;margin-top:10px!important}
.v32-lightbox{position:fixed;inset:0;background:rgba(2,10,18,.94);z-index:9999;display:none;align-items:center;justify-content:center;padding:24px}.v32-lightbox.open{display:flex}.v32-lightbox-inner{position:relative;width:min(96vw,1500px);max-height:94vh;display:flex;flex-direction:column;gap:12px}.v32-lightbox img{max-width:100%;max-height:82vh;object-fit:contain;border-radius:18px;margin:auto;box-shadow:0 25px 80px rgba(0,0,0,.45)}.v32-lightbox-close,.v32-lightbox-arrow{position:absolute;border:1px solid rgba(255,255,255,.18);background:rgba(10,28,43,.78);color:#fff;border-radius:50%;display:grid;place-items:center;z-index:2}.v32-lightbox-close{left:8px;top:8px;width:44px;height:44px}.v32-lightbox-arrow{top:48%;width:48px;height:48px}.v32-lightbox-arrow.prev{right:8px}.v32-lightbox-arrow.next{left:8px}.v32-lightbox-info{color:#c8d6e0;text-align:center;font-size:.85rem}
@media(max-width:991px){.v32-spec-summary{grid-template-columns:repeat(2,1fr)}.v32-spec-items{grid-template-columns:1fr}.v32-gallery-stage button{width:40px;height:40px}.v32-system-hero-shot{min-height:260px}.v32-system-hero-shot img{min-height:260px}}
@media(max-width:640px){.v32-showcase-section{padding:64px 0}.v32-gallery-shell{padding:10px;border-radius:22px}.v32-gallery-stage{border-radius:16px}.v32-gallery-thumb{flex-basis:94px}.v32-spec-summary{grid-template-columns:1fr 1fr}.v32-spec-stat{padding:14px}.v32-spec-group summary{padding:16px}.v32-spec-body{padding:16px}.v32-lightbox{padding:10px}.v32-lightbox-arrow{width:42px;height:42px}}

/* V32.1 — real FOURIX systems on the homepage */
.v32-home-system-visual{position:relative!important;min-height:330px!important;overflow:hidden;background:radial-gradient(circle at 50% 45%,rgba(20,119,238,.18),transparent 56%),linear-gradient(135deg,#071827,#0b3153)!important;isolation:isolate}
.v32-home-system-visual:before{content:"FOURIX SYSTEMS";position:absolute;inset:auto 22px 18px auto;color:rgba(255,255,255,.08);font-size:1.6rem;font-weight:900;letter-spacing:.12em}
.v32-home-system-shot{position:absolute;width:58%;aspect-ratio:16/9;border-radius:18px;overflow:hidden;border:1px solid rgba(255,255,255,.24);box-shadow:0 20px 46px rgba(0,0,0,.35);background:#071827;transition:transform .45s ease,box-shadow .45s ease;z-index:1}
.v32-home-system-shot img{width:100%;height:100%;object-fit:cover;display:block}.v32-home-system-shot span{position:absolute;right:10px;bottom:10px;display:inline-flex;align-items:center;gap:7px;padding:7px 10px;border-radius:999px;background:rgba(3,18,31,.82);color:#fff;font-size:.72rem;font-weight:900;backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.14)}
.v32-home-system-shot.market{right:7%;top:14%;transform:rotate(3deg)}.v32-home-system-shot.pharmacy{left:6%;top:36%;transform:rotate(-3deg);z-index:3}.v32-home-system-shot.restaurant{right:23%;top:57%;transform:rotate(1deg);z-index:2}
.v32-home-system-shot:hover{z-index:5!important;transform:translateY(-7px) rotate(0)!important;box-shadow:0 28px 64px rgba(0,0,0,.46)}
@media(max-width:991px){.v32-home-system-visual{min-height:300px!important}.v32-home-system-shot{width:62%}}
@media(max-width:640px){.v32-home-system-visual{min-height:250px!important}.v32-home-system-shot{width:67%;border-radius:12px}.v32-home-system-shot.market{right:5%;top:10%}.v32-home-system-shot.pharmacy{left:4%;top:34%}.v32-home-system-shot.restaurant{right:18%;top:59%}.v32-home-system-shot span{font-size:.62rem;padding:5px 8px}}