/* ═══ الإصدار ٢ من الرئيسية (٢٧ أكتوبر ٢٠٢٦) — صور حقيقية + لوحة منتجات تفاعلية ═══
   ملاحظات المجلس: لا شخصيات كرتونية · المنتجات تُعرض تفاعلياً · الاحترافية سقفٌ يُقاس (القاعدة ٥٫٤٣). */
.hero2{position:relative;padding-block:56px 72px;overflow:hidden}
.hero2:before{content:"";position:absolute;inset-block:0;inset-inline-end:-6%;width:46%;background:linear-gradient(180deg,var(--green-soft),transparent);transform:skewX(-14deg);pointer-events:none}
.hero2 .wrap{position:relative;display:grid;grid-template-columns:1fr 1.05fr;gap:56px;align-items:center}
.hero2 h1{font-size:clamp(34px,5vw,58px);margin-top:14px}
.hero2 h1 em{font-style:normal;color:var(--green-2);background:linear-gradient(transparent 68%,var(--copper-soft) 68%)}
.hero2 .lede{font-size:clamp(17px,1.5vw,19.5px);color:var(--muted);margin-top:18px;max-width:54ch}
.hero2 .ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.h2-proof{list-style:none;padding:0;margin:34px 0 0;display:flex;flex-wrap:wrap;gap:10px 26px;font-size:14.5px;color:var(--muted)}
.h2-proof b{font-family:var(--display);font-size:22px;color:var(--ink);margin-inline-end:4px;font-variant-numeric:tabular-nums}
.h2-visual{position:relative;margin:0;min-width:0}
.h2-visual img{width:100%;height:auto;aspect-ratio:5/4;object-fit:cover;object-position:35% 40%;border-radius:28px;box-shadow:0 30px 60px -20px rgba(19,32,27,.35)}
.h2-visual:after{content:"";position:absolute;width:22px;height:120px;background:var(--copper);inset-inline-start:-11px;top:14%;transform:skewX(-22deg);border-radius:4px}
.feed{position:absolute;inset-inline-start:-56px;bottom:-34px;width:min(330px,78%);display:grid;gap:8px}
.feed .ev:nth-child(4){display:none}
.ev{display:grid;grid-template-columns:auto 1fr auto;gap:10px;align-items:center;padding:10px 12px;border-radius:14px;background:color-mix(in srgb,var(--paper) 90%,transparent);backdrop-filter:blur(12px) saturate(1.3);border:1px solid var(--line);box-shadow:0 10px 30px -12px rgba(19,32,27,.35);animation:evIn .6s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(.5s + var(--d) * .7s)}
.ev b{display:block;font-family:var(--display);font-size:13.5px;line-height:1.4}
.ev span{display:block;font-size:12.5px;color:var(--muted);line-height:1.5}
.ev time{font-size:11.5px;color:var(--muted);align-self:start}
.ic{width:30px;height:30px;border-radius:9px;display:grid;place-items:center}
.ic.g{background:var(--green-2)}.ic.c{background:var(--copper)}
.ic:after{content:"";width:6px;height:11px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg) translateY(-1px)}
@keyframes evIn{from{opacity:0;transform:translateY(14px) scale(.97)}}
.h2-visual figcaption{position:absolute;top:12px;inset-inline-end:14px;font-size:11.5px;color:#fff;background:rgba(0,0,0,.4);padding:3px 10px;border-radius:999px}
@media (max-width:900px){.hero2 .wrap{grid-template-columns:1fr;gap:44px}.hero2:before{width:80%}.feed{inset-inline-start:10px;bottom:-30px;width:calc(100% - 20px)}.feed .ev:nth-child(n+3){display:none}.h2-visual{margin-bottom:24px}}

/* لوحة المنتجات */
.console{display:grid;grid-template-columns:230px 1fr;gap:18px;margin-top:34px;align-items:start}
.c-tabs{display:flex;flex-direction:column;gap:8px}
.c-tabs button{display:flex;flex-direction:column;align-items:flex-start;gap:2px;padding:14px 16px;border-radius:14px;border:1px solid var(--line);background:var(--paper);color:var(--ink);cursor:pointer;text-align:start;font:inherit;transition:background .2s,border-color .2s,transform .2s}
.c-tabs button b{font-family:var(--display);font-size:16.5px}
.c-tabs button span{font-size:13px;color:var(--muted)}
.c-tabs button[aria-selected=true]{background:var(--green);border-color:var(--green);color:var(--on-green);transform:translateX(-6px)}
.c-tabs button[aria-selected=true] span{color:color-mix(in srgb,var(--on-green) 75%,transparent)}
.c-screen{min-width:0;background:var(--paper);border:1px solid var(--line);border-radius:20px;box-shadow:0 24px 60px -24px rgba(19,32,27,.3);overflow:hidden}
.c-bar{display:flex;align-items:center;gap:6px;padding:11px 16px;background:var(--green-soft);border-bottom:1px solid var(--line)}
.c-bar i{width:10px;height:10px;border-radius:50%;background:var(--line)}
.c-bar span{margin-inline-start:12px;font-size:13px;color:var(--muted);background:var(--paper);padding:2px 14px;border-radius:999px}
.c-panel{padding:22px;min-height:360px}
.c-panel[hidden]{display:none}
.c-note{font-size:13.5px;color:var(--muted);margin-top:16px}
.c-note a{color:var(--copper);font-weight:600}
.co-switch{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:18px}
.co-switch button,.chat-q button{font:600 14px var(--body);padding:8px 14px;border-radius:999px;border:1px solid var(--line);background:var(--ivory);color:var(--ink);cursor:pointer}
.co-switch button.on{background:var(--copper);border-color:var(--copper);color:#fff}
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.kpis div{background:var(--ivory);border-radius:14px;padding:12px 14px;min-width:0}
.kpis span{display:block;font-size:12.5px;color:var(--muted)}
.kpis b{font-family:var(--display);font-size:clamp(20px,2.2vw,26px);font-variant-numeric:tabular-nums}
.kpis small{font-size:12px;color:var(--muted);margin-inline-start:4px}
.bars{display:flex;align-items:flex-end;gap:8px;height:120px;margin-top:18px;padding:10px;border-radius:14px;background:linear-gradient(var(--line) 1px,transparent 1px) 0 0/100% 25%}
.bars i{flex:1;height:30%;border-radius:6px 6px 2px 2px;background:linear-gradient(var(--green-2),var(--green));transition:height .6s cubic-bezier(.2,.8,.2,1)}
.bars i:last-child{background:var(--copper)}
.feas{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.f-in{display:flex;flex-direction:column;gap:8px}
.f-in label{font-size:14.5px;font-weight:600}
.f-in output,.sj-l output{color:var(--copper);font-family:var(--display);font-variant-numeric:tabular-nums}
.f-in input[type=range],#sj-b{width:100%;accent-color:var(--green-2)}
.f-in select{width:100%;font:inherit;padding:8px 10px;border-radius:10px;border:1px solid var(--line);background:var(--paper);color:var(--ink)}
.f-two{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:6px}
.f-out{display:grid;grid-template-columns:1fr 1fr;gap:10px;align-content:start}
.plot{grid-column:1/-1;aspect-ratio:16/9;border:2px dashed var(--copper);border-radius:12px;display:grid;place-items:center;background:var(--copper-soft);margin-bottom:22px}
.bld{position:relative;background:var(--green-2);border-radius:6px;display:flex;flex-direction:column;gap:2px;padding:4px;transition:width .4s,height .4s;max-height:100%}
.bld i{flex:1;background:rgba(255,255,255,.2);border-radius:2px}
.bld:after{content:attr(data-fl) " أدوار";position:absolute;inset:auto 0 -24px;text-align:center;font-size:12px;color:var(--copper);font-weight:600}
.f-res{background:var(--ivory);border-radius:14px;padding:12px 14px}
.f-res span{display:block;font-size:12.5px;color:var(--muted)}
.f-res b{font-family:var(--display);font-size:26px;font-variant-numeric:tabular-nums}
.f-res small{font-size:12px;color:var(--muted);margin-inline-start:4px}
.sj-l{display:block;font-weight:600;margin-bottom:6px}
.sj-wrap{overflow-x:auto;margin-top:14px}
.sj-t{width:100%;border-collapse:collapse;font-size:14.5px;font-variant-numeric:tabular-nums}
.sj-t th{text-align:start;font-size:12.5px;color:var(--muted);font-weight:500;padding:8px;border-bottom:1px solid var(--line)}
.sj-t td{padding:9px 8px;border-bottom:1px dashed var(--line)}
.sj-t td b{font-family:var(--display);color:var(--green-2)}
.chat{height:250px;overflow-y:auto;display:flex;flex-direction:column;gap:8px;padding:14px;border-radius:14px;background:var(--green-soft)}
.msg{max-width:82%;padding:9px 13px;border-radius:14px;font-size:14.5px;line-height:1.7;animation:evIn .35s both}
.msg small{display:block;font-size:11.5px;color:var(--copper);font-weight:600}
.msg.in{align-self:flex-start;background:var(--paper);color:var(--ink);border-start-start-radius:4px}
.msg.out{align-self:flex-end;background:#DCF3E4;color:#13201B;border-start-end-radius:4px}
.msg.typing{display:flex;gap:4px;padding:13px}
.msg.typing i{width:7px;height:7px;border-radius:50%;background:var(--green-2);animation:dot 1s infinite}
.msg.typing i:nth-child(2){animation-delay:.15s}.msg.typing i:nth-child(3){animation-delay:.3s}
@keyframes dot{50%{opacity:.25;transform:translateY(-3px)}}
.chat-q{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}
@media (max-width:900px){
  .console{grid-template-columns:1fr}
  .c-tabs{flex-direction:row;overflow-x:auto;scrollbar-width:none;margin-inline:-20px;padding-inline:20px}
  .c-tabs button{flex:none}.c-tabs button[aria-selected=true]{transform:none}
  .kpis{grid-template-columns:1fr 1fr}.feas{grid-template-columns:1fr}.c-panel{padding:16px}
}

/* لمن صُمّمت */
.who3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:30px}
.who-card{display:flex;flex-direction:column;text-decoration:none;background:var(--paper);border:1px solid var(--line);border-radius:20px;overflow:hidden;transition:transform .25s,box-shadow .25s}
.who-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.who-card img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;transition:transform .6s}
.who-card:hover img{transform:scale(1.04)}
.who-card div{padding:18px 20px 20px;display:flex;flex-direction:column;gap:6px}
.who-card b{font-family:var(--display);font-size:18px}
.who-card span{font-size:15px;color:var(--muted)}
.who-card em{font-style:normal;color:var(--copper);font-weight:600;font-size:14.5px;margin-top:4px}
@media (max-width:900px){.who3{grid-template-columns:1fr}}
