/* AutoMinds Africa — project-specific animated previews */

/* ---------- shared project-card rhythm ---------- */
.projects-grid2{align-items:stretch!important;gap:14px!important}
.project-card2{display:flex!important;flex-direction:column!important;overflow:hidden!important;background:#fff!important;min-width:0!important}
.project-card2 .project-card-visual{flex:0 0 278px!important;height:278px!important;min-height:278px!important;position:relative!important;overflow:hidden!important;border-bottom:1px solid #173858!important}
.project-card2 .project-card-body{position:relative!important;z-index:4!important;flex:1 1 auto!important;background:#fff!important;padding:28px!important;min-height:270px!important;margin:0!important;transform:none!important}
.project-card2 .project-card-body h3{position:relative!important;margin:26px 0 12px!important;line-height:1.08!important;z-index:2!important}
.project-card2 .project-card-body p{margin:0 0 22px!important;line-height:1.7!important}
.project-card2 .project-actions{margin-top:auto!important;display:flex!important;flex-wrap:wrap!important;gap:9px!important}
.project-card2 .project-card-visual::before,.project-card2 .project-card-visual::after{pointer-events:none}

/* base for all synthetic previews */
.project-preview{background:#06182d!important;color:#fff!important;isolation:isolate}
.project-preview::before{content:""!important;position:absolute!important;inset:0!important;background-image:linear-gradient(rgba(102,150,201,.09) 1px,transparent 1px),linear-gradient(90deg,rgba(102,150,201,.09) 1px,transparent 1px)!important;background-size:28px 28px!important;clip-path:none!important;opacity:.78!important}
.project-preview::after{content:attr(data-placeholder)!important;position:absolute!important;left:18px!important;bottom:14px!important;top:auto!important;right:auto!important;width:auto!important;height:auto!important;padding:8px 10px!important;border:1px solid rgba(125,165,207,.22)!important;background:rgba(6,24,45,.9)!important;color:#b8cde3!important;font:600 8px var(--am-mono)!important;letter-spacing:.11em!important;clip-path:none!important;animation:previewStatus 2.2s ease-in-out infinite!important}
.preview-shell{position:absolute;left:10%;right:10%;top:15%;bottom:19%;z-index:2;border:1px solid rgba(94,149,207,.48);background:rgba(9,34,61,.78);box-shadow:18px 22px 0 -10px rgba(20,92,255,.10)}
.preview-topbar{height:26px;border-bottom:1px solid rgba(103,153,205,.22);display:flex;align-items:center;gap:5px;padding:0 10px;font:600 7px var(--am-mono);letter-spacing:.1em;color:#7fa1c5}
.preview-topbar i{width:5px;height:5px;border-radius:50%;background:#ff7900;box-shadow:10px 0 #145cff,20px 0 #6d89a6}
@keyframes previewStatus{50%{opacity:.62}}
@keyframes softPulse{50%{opacity:.55;transform:scale(.985)}}
@keyframes riseBar{0%,100%{transform:scaleY(.4)}50%{transform:scaleY(1)}}
@keyframes slideLead{0%,100%{transform:translateX(0)}45%{transform:translateX(102%)}55%{transform:translateX(102%)}95%{transform:translateX(204%)}}
@keyframes chatIn{0%,18%{opacity:0;transform:translateY(7px)}30%,82%{opacity:1;transform:none}100%{opacity:0;transform:translateY(-5px)}}
@keyframes typing{0%,100%{opacity:.25}50%{opacity:1}}
@keyframes scanRow{0%{top:37%}50%{top:73%}100%{top:37%}}
@keyframes rewardRing{to{transform:rotate(360deg)}}
@keyframes pointPop{0%,100%{transform:scale(1)}50%{transform:scale(1.08)}}
@keyframes cursorMove{0%,100%{left:32%;top:58%}35%{left:65%;top:35%}70%{left:72%;top:70%}}
@keyframes pageScroll{0%,20%{transform:translateY(0)}55%,75%{transform:translateY(-28px)}100%{transform:translateY(0)}}
@keyframes slotGlow{0%,100%{box-shadow:0 0 0 rgba(20,92,255,0)}50%{box-shadow:0 0 18px rgba(20,92,255,.42)}}
@keyframes checkPop{0%,30%{opacity:0;transform:scale(.5)}45%,85%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(.5)}}

/* ---------- AI WhatsApp Assistant ---------- */
.preview-ai{background:radial-gradient(circle at 80% 20%,rgba(37,203,128,.10),transparent 28%),#06182d!important}
.ai-phone{position:absolute;left:12%;top:12%;bottom:14%;width:34%;border:1px solid #42698f;border-radius:16px;background:#0a2442;overflow:hidden;box-shadow:0 16px 35px rgba(0,0,0,.24)}
.ai-phone-head{height:32px;background:#0c3157;border-bottom:1px solid #315579;display:flex;align-items:center;gap:7px;padding:0 10px;font:600 7px var(--am-mono);color:#b6cae0}.ai-phone-head::before{content:"AI";display:grid;place-items:center;width:18px;height:18px;border-radius:50%;background:#25cb80;color:#062338;font-weight:800}
.ai-chat{position:absolute;left:8px;right:8px;padding:7px 9px;border-radius:8px;font:500 7px/1.35 var(--am-mono)}.ai-chat.user{top:46px;left:24%;background:#16416b;color:#d9e8f6;animation:chatIn 5.8s ease-in-out infinite}.ai-chat.bot{top:94px;right:20%;background:#e9f8f2;color:#12382d;animation:chatIn 5.8s .65s ease-in-out infinite}.ai-chat.action{top:148px;background:#fff2e6;color:#723900;animation:chatIn 5.8s 1.3s ease-in-out infinite}
.ai-typing{position:absolute;left:14px;bottom:14px;display:flex;gap:4px}.ai-typing i{width:5px;height:5px;border-radius:50%;background:#25cb80;animation:typing 1s infinite}.ai-typing i:nth-child(2){animation-delay:.2s}.ai-typing i:nth-child(3){animation-delay:.4s}
.ai-routing{position:absolute;left:52%;right:9%;top:18%;bottom:20%;display:grid;grid-template-rows:repeat(4,1fr);gap:7px}.ai-route{border:1px solid rgba(89,139,191,.32);background:rgba(11,43,75,.85);display:flex;align-items:center;justify-content:space-between;padding:0 10px;font:600 7px var(--am-mono);color:#9fbbd7}.ai-route b{color:#fff}.ai-route em{font-style:normal;color:#ff7900}.ai-route:nth-child(2){animation:softPulse 2.1s infinite}.ai-route:nth-child(3){animation:softPulse 2.1s .5s infinite}.ai-route:nth-child(4){border-color:rgba(37,203,128,.5);color:#6ee4ad}

/* ---------- AutoMinds Africa OS dashboard ---------- */
.preview-os{background:radial-gradient(circle at 24% 20%,rgba(20,92,255,.16),transparent 30%),#06182d!important}
.os-dashboard{position:absolute;left:7%;right:7%;top:13%;bottom:19%;z-index:2;display:grid;grid-template-columns:25% 75%;border:1px solid #315c86;background:#081d35}.os-sidebar{border-right:1px solid #284b6e;padding:12px 8px;display:grid;align-content:start;gap:7px}.os-sidebar b{font:700 8px var(--am-mono);color:#fff;margin-bottom:6px}.os-nav{height:18px;border:1px solid rgba(91,139,185,.2);background:#0b2b4d}.os-nav.active{background:#145cff;border-color:#3e78ff}.os-main{padding:10px;display:grid;grid-template-rows:42px 1fr;gap:9px}.os-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.os-kpi{border:1px solid #274d72;background:#0b2948;padding:6px 7px}.os-kpi small{display:block;font:500 6px var(--am-mono);color:#7898b8}.os-kpi strong{font:800 13px var(--am-sans);color:#fff}.os-kpi:nth-child(2) strong{color:#ff8d23}.os-kpi:nth-child(3) strong{color:#54d99a}.os-lower{display:grid;grid-template-columns:1.25fr .75fr;gap:8px}.os-chart,.os-tasks{border:1px solid #274d72;background:#091f38;position:relative;overflow:hidden}.os-bars{position:absolute;inset:20px 10px 10px;display:flex;align-items:end;gap:6px}.os-bars i{flex:1;height:48%;transform-origin:bottom;background:linear-gradient(#145cff,#2b6fff);animation:riseBar 3s ease-in-out infinite}.os-bars i:nth-child(2){height:72%;animation-delay:.3s}.os-bars i:nth-child(3){height:38%;animation-delay:.6s;background:#ff7900}.os-bars i:nth-child(4){height:84%;animation-delay:.9s}.os-bars i:nth-child(5){height:58%;animation-delay:1.2s}.os-tasks{padding:9px;display:grid;align-content:start;gap:7px}.os-task{height:20px;border:1px solid #284d71;background:#0d2c4d;position:relative}.os-task::before{content:"";position:absolute;left:5px;top:6px;width:6px;height:6px;border-radius:50%;background:#25cb80}.os-task::after{content:"";position:absolute;left:16px;right:8px;top:8px;height:3px;background:#406483}

/* ---------- CRM operations ---------- */
.preview-crm{background:radial-gradient(circle at 75% 15%,rgba(255,121,0,.10),transparent 28%),#06182d!important}
.crm-board{position:absolute;left:7%;right:7%;top:16%;bottom:20%;z-index:2;display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.crm-col{border:1px solid #2b5378;background:#081f39;padding:8px;position:relative;overflow:hidden}.crm-col h5{margin:0 0 8px;font:600 7px var(--am-mono);letter-spacing:.08em;color:#8eacca}.crm-card{height:30px;margin:6px 0;border:1px solid rgba(81,129,176,.3);background:#0d2b4b;position:relative}.crm-card::before{content:"";position:absolute;left:6px;right:28%;top:8px;height:3px;background:#54789b;box-shadow:0 8px #315575}.crm-card.hot{border-color:#ff7900;background:rgba(255,121,0,.08)}.crm-lead{position:absolute;left:9%;top:49%;width:22%;height:35px;z-index:5;border:1px solid #ff7900;background:#102f50;box-shadow:0 8px 20px rgba(0,0,0,.2);animation:slideLead 7s ease-in-out infinite}.crm-lead::before{content:"NEW LEAD";position:absolute;left:7px;top:7px;font:700 6px var(--am-mono);color:#ff9b42}.crm-lead::after{content:"→";position:absolute;right:7px;bottom:4px;color:#145cff;font-size:15px}.crm-metric{position:absolute;right:9%;top:8%;z-index:4;padding:7px 9px;border:1px solid #2f5c87;background:#09223e;font:600 7px var(--am-mono);color:#a9c0d8}.crm-metric b{color:#25cb80}

/* ---------- School administration ---------- */
.preview-school{background:radial-gradient(circle at 20% 22%,rgba(255,121,0,.08),transparent 25%),#06182d!important}
.school-ui{position:absolute;left:7%;right:7%;top:14%;bottom:20%;z-index:2;display:grid;grid-template-columns:1.25fr .75fr;gap:8px}.school-table,.school-side{border:1px solid #2a5379;background:#081f39;padding:9px;position:relative;overflow:hidden}.school-table h5,.school-side h5{margin:0 0 9px;font:600 7px var(--am-mono);color:#9bb5d0}.student-row{height:22px;border-bottom:1px solid #213e5c;display:grid;grid-template-columns:16px 1fr 36px;align-items:center;gap:6px;font:500 6px var(--am-mono);color:#8eabc7}.student-row i{width:8px;height:8px;border-radius:50%;background:#145cff}.student-row span:last-child{color:#25cb80}.student-row.absent span:last-child{color:#ff7900}.attendance-scan{position:absolute;left:6px;right:6px;height:24px;top:37%;border:1px solid rgba(20,92,255,.5);background:rgba(20,92,255,.08);animation:scanRow 4s ease-in-out infinite}.school-stat{height:48px;border:1px solid #284e72;background:#0b2948;margin-bottom:7px;padding:7px}.school-stat small{font:500 6px var(--am-mono);color:#7897b6}.school-stat strong{display:block;color:#fff;font-size:15px;margin-top:3px}.school-calendar{display:grid;grid-template-columns:repeat(5,1fr);gap:3px}.school-calendar i{height:15px;background:#0e335a;border:1px solid #294f74}.school-calendar i:nth-child(7),.school-calendar i:nth-child(13){background:#ff7900;border-color:#ff9c45}

/* ---------- Loyalty platform ---------- */
.preview-loyalty{background:radial-gradient(circle at 76% 24%,rgba(255,121,0,.14),transparent 28%),#06182d!important}
.loyalty-card{position:absolute;left:9%;top:21%;width:48%;height:47%;z-index:3;border-radius:13px;background:linear-gradient(135deg,#145cff,#0d3575 65%,#06182d);border:1px solid #3b70ac;box-shadow:0 18px 30px rgba(0,0,0,.25);padding:14px;color:#fff;animation:softPulse 4s ease-in-out infinite}.loyalty-card small{font:600 6px var(--am-mono);letter-spacing:.12em;color:#bed2ea}.loyalty-card strong{display:block;font-size:22px;margin:25px 0 4px;animation:pointPop 2.4s ease-in-out infinite}.loyalty-card span{font:600 7px var(--am-mono);color:#ffad66}.loyalty-ring{position:absolute;right:10%;top:20%;width:86px;height:86px;border-radius:50%;border:8px solid #15395e;border-top-color:#ff7900;border-right-color:#145cff;z-index:3;animation:rewardRing 8s linear infinite}.loyalty-ring::after{content:"78%";position:absolute;inset:0;display:grid;place-items:center;color:#fff;font:800 14px var(--am-sans)}.loyalty-tier{position:absolute;right:8%;bottom:24%;z-index:4;display:grid;gap:5px}.loyalty-tier span{padding:5px 7px;border:1px solid #2d567e;background:#0a2847;color:#8dabca;font:600 6px var(--am-mono)}.loyalty-tier span:nth-child(2){border-color:#ff7900;color:#ffac65}

/* ---------- Live AutoMinds website ---------- */
.preview-website{background:linear-gradient(145deg,#06182d,#0a2848)!important}
.website-browser{position:absolute;left:9%;right:9%;top:14%;bottom:18%;z-index:2;border:1px solid #52769c;background:#fff;overflow:hidden;box-shadow:0 18px 36px rgba(0,0,0,.22)}.website-chrome{height:28px;background:#f4f8fc;border-bottom:1px solid #d7e1ec;display:flex;align-items:center;gap:5px;padding:0 9px}.website-chrome i{width:5px;height:5px;border-radius:50%;background:#ff7900}.website-chrome i:nth-child(2){background:#145cff}.website-chrome i:nth-child(3){background:#25cb80}.website-page{height:calc(100% - 28px);background:#f8fbff;overflow:hidden}.website-scroll{height:150%;animation:pageScroll 5.5s ease-in-out infinite}.website-nav{height:22px;border-bottom:1px solid #dbe5ef;background:#fff}.website-hero{height:62px;background:linear-gradient(90deg,#edf5ff 0 65%,#06182d 65%);position:relative}.website-hero::before{content:"AUTOMINDS AFRICA";position:absolute;left:10px;top:14px;color:#0c1b2e;font:800 7px var(--am-sans)}.website-hero::after{content:"SMART DIGITAL SYSTEMS";position:absolute;left:10px;top:29px;color:#145cff;font:800 11px var(--am-sans)}.website-sections{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;padding:7px}.website-sections i{height:45px;border:1px solid #d5e2ef;background:#fff}.website-sections i:nth-child(2){background:#eef4ff}.website-cursor{position:absolute;z-index:6;width:0;height:0;border-left:7px solid #06182d;border-top:4px solid transparent;border-bottom:4px solid transparent;transform:rotate(45deg);animation:cursorMove 5.5s ease-in-out infinite}

/* ---------- Booking platform ---------- */
.preview-booking{background:radial-gradient(circle at 18% 22%,rgba(20,92,255,.15),transparent 28%),#06182d!important}
.booking-ui{position:absolute;left:7%;right:7%;top:14%;bottom:19%;z-index:2;display:grid;grid-template-columns:1fr .85fr;gap:8px}.booking-calendar,.booking-panel{border:1px solid #2b557d;background:#081f39;padding:9px}.booking-calendar h5,.booking-panel h5{margin:0 0 8px;font:600 7px var(--am-mono);color:#9cb8d4}.booking-days{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}.booking-days i{height:19px;border:1px solid #26496c;background:#0d2a48;position:relative}.booking-days i:nth-child(11),.booking-days i:nth-child(16){background:#145cff;border-color:#5487ff;animation:slotGlow 2.8s infinite}.booking-days i:nth-child(20){background:rgba(255,121,0,.16);border-color:#ff7900}.booking-slot{height:26px;border:1px solid #2c5278;margin:6px 0;padding:6px 7px;font:600 6px var(--am-mono);color:#91afcc;background:#0b2948}.booking-slot.active{border-color:#145cff;color:#dbe8ff;background:rgba(20,92,255,.15);animation:slotGlow 2.8s infinite}.booking-confirm{height:28px;margin-top:9px;background:#ff7900;color:#06182d;display:grid;place-items:center;font:800 7px var(--am-mono);position:relative}.booking-confirm::after{content:"✓";position:absolute;right:8px;font-size:13px;animation:checkPop 4s ease-in-out infinite}

/* live video remains real media */
.project-card-visual.smart-video-preview{background:#06182d!important;padding:0!important}.project-card-visual.smart-video-preview video{width:100%!important;height:100%!important;min-height:278px!important;object-fit:cover!important}

@media(max-width:900px){
  .project-card2 .project-card-visual{flex-basis:250px!important;height:250px!important;min-height:250px!important}.project-card2 .project-card-body{min-height:245px!important;padding:24px!important}
}
@media(max-width:600px){
  .projects-grid2{gap:12px!important}.project-card2 .project-card-visual{flex-basis:225px!important;height:225px!important;min-height:225px!important}.project-card2 .project-card-body{min-height:0!important;padding:22px!important}.project-card2 .project-card-body h3{margin-top:20px!important}.ai-phone{width:40%;left:8%}.ai-routing{left:52%;right:6%}.preview-shell{left:6%;right:6%}.os-dashboard,.school-ui,.booking-ui{left:5%;right:5%}.loyalty-card{left:7%;width:52%}.loyalty-ring{right:6%;width:74px;height:74px}
}
@media(prefers-reduced-motion:reduce){.project-preview *, .project-preview *::before,.project-preview *::after{animation:none!important}}