/* ============================================================
   Digital MQR — Website Mockup  ·  Brand Stylesheet
   Brand: violet #50208F · indigo #363996 · periwinkle #7090E0
   ============================================================ */
:root{
  --violet:#50208F; --indigo:#363996; --peri:#7090E0; --blue-light:#70A0D0;
  --ink:#1C1230; --slate:#5B5670; --bg:#FFFFFF; --soft:#F5F4FB; --line:#E6E3F2;
  --success:#2BB673;
  --grad:linear-gradient(135deg,#50208F 0%,#363996 55%,#7090E0 100%);
  --grad-soft:linear-gradient(135deg,rgba(80,32,143,.92),rgba(54,57,150,.86));
  --shadow:0 8px 24px rgba(80,32,143,.08);
  --shadow-lg:0 16px 40px rgba(80,32,143,.16);
  --radius:16px; --radius-sm:12px; --container:1240px;
  --ff:'Poppins','Inter',system-ui,Arial,sans-serif;
  --ff-ar:'Tajawal','Cairo',system-ui,Arial,sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--ff);color:var(--ink);background:var(--bg);line-height:1.6;font-size:16px;overflow-x:hidden}
[dir="rtl"] body,[dir="rtl"]{font-family:var(--ff-ar)}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4{font-weight:700;line-height:1.18;color:var(--ink);letter-spacing:-.01em}
h2.section-title{font-size:clamp(1.7rem,3.4vw,2.6rem)}
.container{max-width:var(--container);margin-inline:auto;padding-inline:24px}
section{padding:84px 0}
.eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:.78rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--violet);background:var(--soft);border:1px solid var(--line);padding:7px 14px;border-radius:999px}
.lead{color:var(--slate);font-size:1.06rem;max-width:62ch}
.center{text-align:center}
.center .lead{margin-inline:auto}
.text-grad{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:9px;font-weight:600;font-size:.96rem;padding:13px 26px;border-radius:999px;cursor:pointer;border:2px solid transparent;transition:.25s;font-family:inherit}
.btn-primary{background:var(--grad);color:#fff;box-shadow:var(--shadow)}
.btn-primary:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}
.btn-outline{border-color:var(--violet);color:var(--violet);background:#fff}
.btn-outline:hover{background:var(--violet);color:#fff}
.btn-light{background:#fff;color:var(--violet)}
.btn-light:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}
.btn-ghost{color:#fff;border-color:rgba(255,255,255,.6)}
.btn-ghost:hover{background:#fff;color:var(--violet)}
.btn .arr{transition:.25s}
[dir="rtl"] .btn .arr{transform:scaleX(-1)}
.btn:hover .arr{transform:translateX(3px)}
[dir="rtl"] .btn:hover .arr{transform:scaleX(-1) translateX(3px)}

/* ---------- top promo bar ---------- */
.promo{background:var(--ink);color:#fff;font-size:.85rem;text-align:center;padding:9px 16px}
.promo a{color:#fff;font-weight:600;border-bottom:1px solid rgba(255,255,255,.5);margin-inline-start:6px}

/* ---------- header (solid white, sticky) ---------- */
.header{position:sticky;top:0;z-index:50;background:#fff;border-bottom:1px solid var(--line);transition:box-shadow .3s}
.header.scrolled{box-shadow:0 4px 20px rgba(80,32,143,.07)}
.nav{display:flex;align-items:center;gap:28px;height:72px}
.logo img{height:52px;width:auto;display:block}
.nav-links{display:flex;gap:26px;margin-inline-start:auto;align-items:center}
.nav-links a{font-weight:500;font-size:.95rem;color:var(--ink);position:relative;padding:4px 0;transition:.2s}
.nav-links a:hover{color:var(--violet)}
.nav-links a.active{color:var(--violet)}
.nav-links a.active::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:2px;background:var(--grad);border-radius:2px}
.nav-actions{display:flex;align-items:center;gap:12px}
.lang-toggle{display:flex;align-items:center;gap:6px;border:1px solid var(--line);border-radius:999px;padding:6px 12px;font-weight:600;font-size:.85rem;color:var(--violet);background:#fff;cursor:pointer;font-family:inherit;transition:.2s}
.lang-toggle:hover{background:var(--soft)}
.shop-btn{background:var(--grad);color:#fff;padding:10px 22px;border-radius:999px;font-weight:600;font-size:.9rem;box-shadow:var(--shadow);display:inline-flex;gap:7px;align-items:center}
.shop-btn:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}
.burger{display:none;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer;padding:6px}
.burger span{width:24px;height:2px;background:var(--ink);border-radius:2px;transition:.25s}

/* ---------- hero ---------- */
.hero{position:relative;color:#fff;min-height:640px;display:flex;align-items:center;overflow:hidden}
.hero-bg{position:absolute;inset:0;z-index:0}
.hero-bg img{width:100%;height:100%;object-fit:cover}
.hero-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,rgba(28,18,48,.92) 0%,rgba(54,57,150,.82) 45%,rgba(80,32,143,.55) 100%)}
[dir="rtl"] .hero-bg::after{background:linear-gradient(250deg,rgba(28,18,48,.92) 0%,rgba(54,57,150,.82) 45%,rgba(80,32,143,.55) 100%)}
.hero .container{position:relative;z-index:1;padding-top:60px;padding-bottom:60px}
.hero-badge{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.3);backdrop-filter:blur(6px);padding:8px 16px;border-radius:999px;font-size:.82rem;font-weight:600;letter-spacing:.04em}
.hero h1{color:#fff;font-size:clamp(2.3rem,5.4vw,4rem);margin:22px 0 18px;max-width:16ch}
.hero p.sub{font-size:1.12rem;color:rgba(255,255,255,.92);max-width:54ch;margin-bottom:30px}
.hero-cta{display:flex;gap:14px;flex-wrap:wrap}
.hero-stats{display:flex;gap:38px;flex-wrap:wrap;margin-top:54px;padding-top:30px;border-top:1px solid rgba(255,255,255,.22)}
.hero-stats .num{font-size:2rem;font-weight:700}
.hero-stats .lbl{font-size:.82rem;color:rgba(255,255,255,.8)}

/* ---------- stats band ---------- */
.statband{background:var(--soft);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.statband .grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;text-align:center}
.statband .num{font-size:2.4rem;font-weight:800}
.statband .lbl{color:var(--slate);font-size:.92rem}

/* ---------- segment selector ---------- */
.seg-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:46px}
.seg-card{position:relative;border-radius:var(--radius);overflow:hidden;min-height:360px;display:flex;align-items:flex-end;color:#fff;box-shadow:var(--shadow);transition:.3s}
.seg-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg)}
.seg-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.seg-card::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(28,18,48,.05) 0%,rgba(28,18,48,.4) 45%,rgba(54,57,150,.92) 100%);z-index:1}
.seg-card .inner{position:relative;z-index:2;padding:28px}
.seg-card .tag{font-size:.74rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;opacity:.9}
.seg-card h3{color:#fff;font-size:1.5rem;margin:8px 0 10px}
.seg-card p{font-size:.92rem;color:rgba(255,255,255,.9);margin-bottom:14px}
.seg-card .more{font-weight:600;font-size:.9rem;display:inline-flex;gap:6px;align-items:center}

/* ---------- solutions grid ---------- */
.filter-bar{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin:34px 0 8px}
.filter-bar button{font-family:inherit;border:1px solid var(--line);background:#fff;color:var(--slate);padding:9px 20px;border-radius:999px;font-weight:600;font-size:.88rem;cursor:pointer;transition:.2s}
.filter-bar button.active,.filter-bar button:hover{background:var(--grad);color:#fff;border-color:transparent}
.sol-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;margin-top:34px}
.sol-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);transition:.3s;display:flex;flex-direction:column}
.sol-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg)}
.sol-card .thumb{position:relative;aspect-ratio:4/3;overflow:hidden}
.sol-card .thumb img{width:100%;height:100%;object-fit:cover;transition:.5s}
.sol-card:hover .thumb img{transform:scale(1.07)}
.sol-card .thumb::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(80,32,143,0) 40%,rgba(80,32,143,.55))}
.sol-card .icon{position:absolute;top:14px;inset-inline-start:14px;z-index:2;width:44px;height:44px;border-radius:12px;background:rgba(255,255,255,.92);display:grid;place-items:center;font-size:1.3rem;box-shadow:var(--shadow)}
.badge{position:absolute;bottom:12px;inset-inline-start:14px;z-index:2;font-size:.68rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:#fff;background:rgba(255,255,255,.2);border:1px solid rgba(255,255,255,.45);backdrop-filter:blur(4px);padding:4px 10px;border-radius:999px}
.sol-card .body{padding:18px;display:flex;flex-direction:column;gap:8px;flex:1}
.sol-card h3{font-size:1.06rem}
.sol-card p{font-size:.86rem;color:var(--slate);flex:1}
.sol-card .read{font-weight:600;font-size:.85rem;color:var(--violet);display:inline-flex;gap:6px;align-items:center}

/* segment badge colors */
.b-edu{background:rgba(80,32,143,.12);color:var(--violet);border:1px solid rgba(80,32,143,.25)}
.b-hot{background:rgba(112,144,224,.16);color:#3a57b0;border:1px solid rgba(112,144,224,.4)}
.b-cor{background:rgba(54,57,150,.12);color:var(--indigo);border:1px solid rgba(54,57,150,.3)}
.chip{display:inline-flex;font-size:.72rem;font-weight:600;padding:5px 12px;border-radius:999px;background:#fff;border:1px solid var(--line);color:var(--slate)}

/* ---------- testimonials ---------- */
.tst-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:42px}
.tst{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:28px;box-shadow:var(--shadow);position:relative}
.tst .q{font-size:3rem;line-height:1;color:var(--peri);font-family:Georgia,serif;height:30px}
.tst p{color:var(--ink);font-size:.96rem;margin:6px 0 18px}
.tst .who{display:flex;align-items:center;gap:12px}
.tst .av{width:46px;height:46px;border-radius:50%;background:var(--grad);color:#fff;display:grid;place-items:center;font-weight:700}
.tst .who b{display:block;font-size:.92rem}
.tst .who span{font-size:.8rem;color:var(--slate)}

/* ---------- logo wall / marquee ---------- */
.wall{background:var(--soft);border-block:1px solid var(--line)}
.marquee{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.marquee-track{display:flex;gap:60px;align-items:center;width:max-content;animation:scroll 38s linear infinite}
.marquee:hover .marquee-track{animation-play-state:paused}
.marquee-track .logo-item{font-weight:700;color:var(--slate);font-size:1.05rem;white-space:nowrap;opacity:.7;display:flex;align-items:center;gap:8px}
.marquee-track .logo-item::before{content:"";width:9px;height:9px;border-radius:50%;background:var(--peri)}
@keyframes scroll{to{transform:translateX(-50%)}}
[dir="rtl"] .marquee-track{animation-direction:reverse}

/* ---------- events ---------- */
.ev-feature{display:grid;grid-template-columns:1.15fr 1fr;gap:0;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);border:1px solid var(--line);background:#fff}
.ev-feature .pic{position:relative;min-height:380px}
.ev-feature .pic img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ev-feature .pic .latest{position:absolute;top:18px;inset-inline-start:18px;background:var(--success);color:#fff;font-size:.74rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:6px 14px;border-radius:999px}
.ev-feature .txt{padding:40px}
.ev-feature .txt .date{color:var(--violet);font-weight:600;font-size:.88rem}
.ev-feature .txt h3{font-size:1.7rem;margin:8px 0 14px}
.ev-list{display:grid;gap:30px;margin-top:30px}
.ev-row{display:grid;grid-template-columns:1fr 1.2fr;gap:30px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}
.ev-row .pic{position:relative;min-height:300px}
.ev-row .pic img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ev-row .txt{padding:34px}
.ev-row .txt h3{font-size:1.5rem;margin:10px 0 12px}
.gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:22px}
.gallery a{position:relative;aspect-ratio:7/5;overflow:hidden;border-radius:12px;cursor:pointer}
.gallery img{width:100%;height:100%;object-fit:cover;transition:.4s}
.gallery a:hover img{transform:scale(1.08)}

/* page hero (sub-pages) */
.page-hero{position:relative;color:#fff;padding:120px 0 60px;overflow:hidden}
.page-hero .bg{position:absolute;inset:0;z-index:0}
.page-hero .bg img{width:100%;height:100%;object-fit:cover}
.page-hero .bg::after{content:"";position:absolute;inset:0;background:var(--grad-soft)}
.page-hero .container{position:relative;z-index:1}
.page-hero h1{color:#fff;font-size:clamp(2rem,4.5vw,3.2rem);margin:14px 0 10px}
.page-hero .crumb{font-size:.86rem;color:rgba(255,255,255,.85)}
.page-hero .crumb a:hover{color:#fff;text-decoration:underline}

/* ---------- article ---------- */
.article{max-width:860px;margin-inline:auto}
.article .meta{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin:18px 0 26px}
.article h2{font-size:1.5rem;margin:34px 0 14px}
.article p{margin-bottom:16px;color:#33294a}
.article ul.feat{list-style:none;display:grid;gap:12px;margin:18px 0}
.article ul.feat li{display:flex;gap:12px;align-items:flex-start;background:var(--soft);border:1px solid var(--line);border-radius:12px;padding:14px 16px}
.article ul.feat li::before{content:"✓";flex:none;width:26px;height:26px;border-radius:50%;background:var(--grad);color:#fff;display:grid;place-items:center;font-size:.8rem;font-weight:700}
.article .figure{margin:26px 0;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}
.video-embed{aspect-ratio:16/9;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);margin:24px 0}
.video-embed iframe{width:100%;height:100%;border:0}
.models{display:flex;gap:10px;flex-wrap:wrap;margin:14px 0}
.model{border:2px solid var(--violet);color:var(--violet);font-weight:700;border-radius:12px;padding:10px 18px}

/* ---------- CTA band ---------- */
.cta{position:relative;color:#fff;overflow:hidden}
.cta .bg{position:absolute;inset:0;z-index:0}
.cta .bg img{width:100%;height:100%;object-fit:cover}
.cta .bg::after{content:"";position:absolute;inset:0;background:var(--grad-soft)}
.cta .container{position:relative;z-index:1;text-align:center;padding:30px 0}
.cta h2{color:#fff;font-size:clamp(1.8rem,3.6vw,2.6rem);max-width:20ch;margin-inline:auto}
.cta p{color:rgba(255,255,255,.9);max-width:60ch;margin:16px auto 26px}
.cta-stats{display:flex;justify-content:center;gap:40px;flex-wrap:wrap;margin:26px 0}
.cta-stats .num{font-size:1.8rem;font-weight:800}
.cta-stats .lbl{font-size:.82rem;color:rgba(255,255,255,.82)}

/* ---------- contact ---------- */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px}
.field{margin-bottom:16px}
.field label{display:block;font-weight:600;font-size:.86rem;margin-bottom:6px}
.field input,.field select,.field textarea{width:100%;border:1px solid var(--line);border-radius:12px;padding:13px 15px;font-family:inherit;font-size:.95rem;background:#fff}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--violet);box-shadow:0 0 0 3px rgba(80,32,143,.12)}
.info-item{display:flex;gap:14px;align-items:flex-start;margin-bottom:20px}
.info-item .ic{flex:none;width:46px;height:46px;border-radius:12px;background:var(--soft);border:1px solid var(--line);display:grid;place-items:center;font-size:1.2rem}
.info-item b{display:block;font-size:.95rem}
.info-item span{color:var(--slate);font-size:.92rem}
.map{border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);margin-top:8px;border:1px solid var(--line)}
.map iframe{width:100%;height:260px;border:0;display:block}

/* ---------- footer ---------- */
.footer{background:var(--ink);color:#cfc9e0;padding:64px 0 28px}
.footer .grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.3fr;gap:36px}
.footer img.flogo{height:58px;margin-bottom:18px}
.footer p.tag{font-size:.92rem;color:#a79fc4;max-width:34ch}
.footer h4{color:#fff;font-size:.95rem;letter-spacing:.04em;margin-bottom:16px;text-transform:uppercase}
.footer ul{list-style:none;display:grid;gap:10px}
.footer ul a{color:#cfc9e0;font-size:.92rem}
.footer ul a:hover{color:#fff}
.footer .socials{display:flex;gap:10px;margin-top:18px}
.footer .socials a{width:38px;height:38px;border-radius:10px;background:rgba(255,255,255,.08);display:grid;place-items:center;transition:.25s}
.footer .socials a:hover{background:var(--grad)}
.footer .socials svg{width:18px;height:18px;fill:#fff}
.foot-bottom{border-top:1px solid rgba(255,255,255,.1);margin-top:44px;padding-top:22px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;font-size:.85rem;color:#8e87a8}

/* ---------- lightbox ---------- */
.lb{position:fixed;inset:0;background:rgba(20,14,34,.94);z-index:200;display:none;align-items:center;justify-content:center;padding:30px}
.lb.open{display:flex}
.lb img{max-width:92vw;max-height:86vh;border-radius:12px;box-shadow:var(--shadow-lg)}
.lb .close{position:absolute;top:22px;inset-inline-end:26px;color:#fff;font-size:2rem;cursor:pointer;background:none;border:0}
.lb .nav-arrow{position:absolute;top:50%;transform:translateY(-50%);color:#fff;font-size:2.4rem;cursor:pointer;background:rgba(255,255,255,.12);border:0;width:54px;height:54px;border-radius:50%}
.lb .prev{inset-inline-start:24px}.lb .next{inset-inline-end:24px}

/* reveal animation */
.reveal{opacity:0;transform:translateY(26px);transition:.7s cubic-bezier(.2,.7,.2,1)}
.reveal.in{opacity:1;transform:none}

/* ---------- responsive ---------- */
@media(max-width:1024px){
  .sol-grid{grid-template-columns:repeat(2,1fr)}
  .footer .grid{grid-template-columns:1fr 1fr}
  .gallery{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:860px){
  .about-split{grid-template-columns:1fr !important;gap:30px !important}
  .mv-grid{grid-template-columns:1fr !important}
  form .field+ .field,form>div{grid-template-columns:1fr !important}
  .nav-links{position:fixed;inset:74px 0 auto 0;background:#fff;flex-direction:column;padding:20px 24px;gap:16px;border-bottom:1px solid var(--line);box-shadow:var(--shadow-lg);display:none}
  .nav-links.open{display:flex}
  .nav-links a,.header:not(.scrolled) .nav-links a{color:var(--ink)}
  .nav-links a{margin:0}
  .burger{display:flex}
  .seg-grid,.tst-grid,.statband .grid{grid-template-columns:1fr 1fr}
  .ev-feature,.ev-row{grid-template-columns:1fr}
  .ev-feature .pic,.ev-row .pic{min-height:260px}
  .contact-grid{grid-template-columns:1fr}
  .hero{min-height:560px}
}
@media(max-width:560px){
  section{padding:60px 0}
  .sol-grid,.gallery,.statband .grid,.seg-grid,.tst-grid{grid-template-columns:1fr}
  .nav-actions .shop-btn{padding:9px 16px}
  .hero-stats{gap:24px}
}
/* ============================================================
   ROUND 2 ADDITIONS — animated hero, book-a-meeting, logo walls,
   events page, gallery page, solution blog pages
   ============================================================ */

/* ---------- Animated hero (photo + brand motion) ---------- */
.hero-x{position:relative;min-height:660px;display:flex;align-items:center;overflow:hidden;background:#0f0a1f;color:#fff}
.hero-x .photo{position:absolute;inset:0;z-index:0}
.hero-x .photo img{width:100%;height:100%;object-fit:cover;opacity:.5}
.hero-x .wash{position:absolute;inset:0;z-index:1;background:
  radial-gradient(ellipse 80% 60% at 72% 38%,rgba(112,144,224,.40) 0%,transparent 62%),
  radial-gradient(ellipse 55% 55% at 18% 72%,rgba(80,32,143,.55) 0%,transparent 60%),
  linear-gradient(115deg,rgba(15,10,31,.94) 0%,rgba(54,57,150,.66) 55%,rgba(80,32,143,.40) 100%)}
[dir="rtl"] .hero-x .wash{background:
  radial-gradient(ellipse 80% 60% at 28% 38%,rgba(112,144,224,.40) 0%,transparent 62%),
  radial-gradient(ellipse 55% 55% at 82% 72%,rgba(80,32,143,.55) 0%,transparent 60%),
  linear-gradient(245deg,rgba(15,10,31,.94) 0%,rgba(54,57,150,.66) 55%,rgba(80,32,143,.40) 100%)}
.hero-x .grid-fx{position:absolute;inset:0;z-index:1;background-image:linear-gradient(rgba(112,144,224,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(112,144,224,.08) 1px,transparent 1px);background-size:58px 58px;mask-image:radial-gradient(ellipse 70% 70% at 60% 50%,#000,transparent)}
.hero-x .ring{position:absolute;z-index:1;border-radius:50%;border:1px solid rgba(112,144,224,.22);animation:ringPulse 6s ease-in-out infinite}
.hero-x .ring.r1{width:520px;height:520px;top:-130px;inset-inline-end:-110px}
.hero-x .ring.r2{width:340px;height:340px;top:30px;inset-inline-end:70px;animation-delay:1.5s;border-color:rgba(80,32,143,.3)}
.hero-x .ring.r3{width:180px;height:180px;top:130px;inset-inline-end:210px;animation-delay:3s}
@keyframes ringPulse{0%,100%{transform:scale(1);opacity:.55}50%{transform:scale(1.06);opacity:1}}
.hero-x .orb{position:absolute;z-index:1;inset-inline-end:14%;top:50%;width:380px;height:380px;transform:translateY(-50%);border-radius:50%;background:radial-gradient(circle,rgba(112,144,224,.45) 0%,rgba(80,32,143,.2) 42%,transparent 70%);animation:orbFloat 7s ease-in-out infinite;pointer-events:none}
@keyframes orbFloat{0%,100%{transform:translateY(-50%) scale(1)}50%{transform:translateY(-54%) scale(1.05)}}
.hero-x .particles{position:absolute;inset:0;z-index:1;overflow:hidden;pointer-events:none}
.hero-x .pt{position:absolute;border-radius:50%;opacity:0;animation:floatUp linear infinite}
@keyframes floatUp{0%{transform:translateY(105%) scale(0);opacity:0}10%{opacity:.6}90%{opacity:.4}100%{transform:translateY(-12%) scale(1);opacity:0}}
.hero-x .container{position:relative;z-index:3;padding-top:60px;padding-bottom:70px}
.hero-x .eyebrow-x{display:inline-flex;align-items:center;gap:10px;margin-bottom:22px}
.hero-x .eyebrow-x .ln{width:34px;height:2px;background:linear-gradient(90deg,var(--peri),var(--violet));border-radius:2px}
.hero-x .eyebrow-x span{font-size:.72rem;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:#c8b6ff}
.hero-x h1{color:#fff;font-size:clamp(2.3rem,5.4vw,4.1rem);line-height:1.08;font-weight:800;max-width:17ch;margin-bottom:14px}
.hero-x h1 .hl{background:linear-gradient(135deg,#a98bff,#7090E0);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.hero-x .divider-x{width:64px;height:3px;background:linear-gradient(90deg,var(--peri),var(--violet));border-radius:2px;margin:18px 0 22px}
.hero-x p.sub{font-size:1.1rem;color:rgba(255,255,255,.82);max-width:56ch;margin-bottom:30px;line-height:1.75}
.hero-x .hero-cta{display:flex;gap:14px;flex-wrap:wrap}
.hero-x .hero-stats{display:flex;gap:38px;flex-wrap:wrap;margin-top:50px;padding-top:28px;border-top:1px solid rgba(255,255,255,.18)}
.hero-x .hero-stats .num{font-size:1.9rem;font-weight:800;background:linear-gradient(135deg,#c8b6ff,#7090E0);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.hero-x .hero-stats .lbl{font-size:.8rem;color:rgba(255,255,255,.6)}
.hero-x .scrollhint{position:absolute;bottom:24px;left:50%;transform:translateX(-50%);z-index:3;display:flex;flex-direction:column;align-items:center;gap:7px;color:rgba(255,255,255,.4);font-size:.66rem;letter-spacing:.2em;text-transform:uppercase}
.hero-x .mouse{width:21px;height:33px;border:1.5px solid rgba(255,255,255,.3);border-radius:11px;position:relative}
.hero-x .mouse::after{content:"";position:absolute;top:6px;left:50%;transform:translateX(-50%);width:3px;height:6px;background:var(--peri);border-radius:2px;animation:scrollDot 1.7s ease-in-out infinite}
@keyframes scrollDot{0%{top:6px;opacity:1}100%{top:17px;opacity:0}}
@media(max-width:860px){.hero-x .ring,.hero-x .orb{display:none}.hero-x{min-height:580px}.hero-x .hero-stats{gap:24px}}

/* ---------- Book a Meeting (rebranded) ---------- */
.bam{background:var(--soft)}
.bam-card{position:relative;overflow:hidden;border-radius:28px;background:linear-gradient(135deg,#1a1040 0%,#2d1b69 58%,#363996 100%);color:#fff;padding:64px;display:flex;align-items:center;justify-content:space-between;gap:48px}
.bam-card::before{content:"";position:absolute;top:-90px;inset-inline-end:-90px;width:360px;height:360px;background:radial-gradient(circle,rgba(112,144,224,.4) 0%,transparent 70%)}
.bam-card::after{content:"";position:absolute;bottom:-70px;inset-inline-start:28%;width:300px;height:300px;background:radial-gradient(circle,rgba(80,32,143,.45) 0%,transparent 70%)}
.bam-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);background-size:46px 46px}
.bam-left{position:relative;z-index:2;flex:1;max-width:580px}
.bam .badge-live{display:inline-flex;align-items:center;gap:8px;background:rgba(112,144,224,.2);border:1px solid rgba(112,144,224,.4);border-radius:999px;padding:6px 16px;margin-bottom:20px;font-size:.72rem;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:#c8b6ff}
.bam .badge-live .dot{width:7px;height:7px;border-radius:50%;background:#a98bff;animation:blink 2s infinite}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.3}}
.bam-left h2{color:#fff;font-size:clamp(1.7rem,3.4vw,2.5rem);line-height:1.18;margin-bottom:16px}
.bam-left h2 .hl{color:#a98bff;position:relative}
.bam-left p{color:rgba(255,255,255,.65);max-width:480px;line-height:1.75}
.bam-stats{display:flex;gap:30px;margin-top:32px;flex-wrap:wrap}
.bam-stats .num{font-size:1.5rem;font-weight:800;color:#fff}
.bam-stats .lbl{font-size:.76rem;color:rgba(255,255,255,.5)}
.bam-right{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;gap:16px;flex-shrink:0}
.bam-note{font-size:.78rem;color:rgba(255,255,255,.45)}
@media(max-width:860px){.bam-card{flex-direction:column;text-align:center;padding:40px 28px}.bam-stats{justify-content:center}.bam .badge-live{margin-inline:auto}.bam-right{width:100%}.bam-right .btn{width:100%;justify-content:center}}

/* ---------- Logo wall block (upload-ready: clients & partners) ---------- */
.logos-block{padding:64px 0}
.logo-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:16px;margin-top:34px}
.logo-cell{aspect-ratio:3/2;background:#fff;border:1px solid var(--line);border-radius:14px;display:grid;place-items:center;padding:16px;box-shadow:var(--shadow);transition:.25s;text-align:center}
.logo-cell:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);border-color:#d9d2f0}
.logo-cell img{max-width:100%;max-height:100%;object-fit:contain;filter:grayscale(1);opacity:.72;transition:.25s}
.logo-cell:hover img{filter:none;opacity:1}
.logo-cell .ph{display:flex;flex-direction:column;gap:6px;align-items:center;color:var(--slate)}
.logo-cell .ph .mk{width:34px;height:34px;border-radius:9px;background:var(--soft);border:1px solid var(--line);display:grid;place-items:center;color:var(--violet);font-weight:800}
.logo-cell .ph small{font-size:.7rem;font-weight:600;line-height:1.2}
@media(max-width:1024px){.logo-grid{grid-template-columns:repeat(4,1fr)}}
@media(max-width:560px){.logo-grid{grid-template-columns:repeat(2,1fr)}}

/* ---------- Events page ---------- */
.evx-hero{position:relative;overflow:hidden;background:#fff;padding:64px 0 44px;text-align:center;border-bottom:1px solid var(--line)}
.evx-hero .blob{position:absolute;top:-90px;left:50%;transform:translateX(-50%);width:620px;height:400px;background:radial-gradient(ellipse at center,rgba(80,32,143,.08) 0%,transparent 70%)}
.evx-hero .container{position:relative;z-index:2}
.evx-hero h1{font-size:clamp(1.8rem,4.4vw,3rem);margin:14px 0 10px}
.evx-hero h1 .hl{background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.strip-wrap{overflow:hidden;background:var(--soft);border-bottom:1px solid var(--line);padding:30px 0}
.strip-lbl{text-align:center;font-size:.7rem;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--violet);margin-bottom:18px}
.strip-track{display:flex;gap:12px;width:max-content;animation:scroll 40s linear infinite;padding:0 12px}
.strip-wrap:hover .strip-track{animation-play-state:paused}
.strip-track img{width:200px;height:130px;object-fit:cover;border-radius:12px;border:2px solid #fff;box-shadow:0 2px 12px rgba(80,32,143,.1);flex-shrink:0;cursor:pointer;transition:.25s}
.strip-track img:hover{transform:scale(1.05) translateY(-3px);box-shadow:var(--shadow-lg)}
[dir="rtl"] .strip-track{animation-direction:reverse}
.evfilter{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;padding:30px 20px 0}
.evfilter button{font-family:inherit;font-size:.8rem;font-weight:600;padding:7px 16px;border-radius:999px;border:1px solid var(--line);background:#fff;color:var(--slate);cursor:pointer;transition:.18s}
.evfilter button:hover{border-color:var(--violet);color:var(--violet);background:var(--soft)}
.evfilter button.active{background:var(--grad);color:#fff;border-color:transparent}
.upcoming{background:linear-gradient(135deg,#F5F3FF 0%,#EDE9FE 100%);border:1px solid #DDD6FE;border-radius:20px;padding:32px 36px;margin:28px 0 8px;display:flex;gap:32px;align-items:center;position:relative;overflow:hidden}
.upcoming::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--grad);border-radius:20px 20px 0 0}
.upcoming .u-left{flex:1}
.up-badge{display:inline-flex;align-items:center;gap:7px;background:rgba(80,32,143,.08);border:1px solid rgba(80,32,143,.2);border-radius:999px;padding:4px 12px;margin-bottom:12px;font-size:.66rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--violet)}
.up-badge .dot{width:6px;height:6px;border-radius:50%;background:var(--violet);animation:blink 2s infinite}
.upcoming h3{font-size:clamp(1.05rem,2vw,1.4rem);margin-bottom:8px}
.upcoming p{font-size:.9rem;color:var(--slate);line-height:1.7;max-width:560px}
.up-meta{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.up-meta .pill{font-size:.74rem;color:var(--slate);background:#fff;border:1px solid var(--line);padding:5px 12px;border-radius:999px}
.evgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px;margin-top:18px}
.evx-card{background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden;display:flex;flex-direction:column;transition:.25s;box-shadow:var(--shadow)}
.evx-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);border-color:#DDD6FE}
.evx-card .ph{position:relative;aspect-ratio:16/10;overflow:hidden}
.evx-card .ph img{width:100%;height:100%;object-fit:cover;transition:.4s}
.evx-card:hover .ph img{transform:scale(1.06)}
.evx-card .st{position:absolute;top:12px;inset-inline-start:12px;font-size:.64rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:4px 11px;border-radius:999px;color:#fff}
.st.done{background:rgba(43,182,115,.92)}
.st.up{background:rgba(80,32,143,.92)}
.evx-card .num{position:absolute;top:12px;inset-inline-end:12px;width:34px;height:34px;border-radius:9px;background:rgba(255,255,255,.9);display:grid;place-items:center;font-weight:800;color:var(--violet);font-size:.82rem}
.evx-card .bd{padding:18px;display:flex;flex-direction:column;gap:10px;flex:1}
.evx-card .meta{display:flex;gap:6px;flex-wrap:wrap}
.evx-card .meta .pill{font-size:.7rem;color:var(--slate);background:var(--soft);border:1px solid var(--line);padding:3px 9px;border-radius:999px}
.evx-card h3{font-size:1rem;line-height:1.35}
.evx-card p{font-size:.84rem;color:var(--slate);line-height:1.65}
.evx-card .foot{margin-top:auto;padding-top:12px;border-top:1px solid var(--line);font-size:.72rem;color:var(--slate);display:flex;justify-content:space-between;align-items:center}
@media(max-width:860px){.upcoming{flex-direction:column;text-align:start}.upcoming .btn{width:100%;justify-content:center}}

/* ---------- Gallery page ---------- */
.gal-group{margin-top:46px}
.gal-group .gh{display:flex;align-items:center;gap:14px;margin-bottom:18px}
.gal-group .gh h3{font-size:1.3rem}
.gal-group .gh .cnt{font-size:.76rem;color:var(--slate);background:var(--soft);border:1px solid var(--line);padding:4px 12px;border-radius:999px}
.gal-group .gh::after{content:"";flex:1;height:1px;background:var(--line)}
.mosaic{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.mosaic a{position:relative;overflow:hidden;border-radius:14px;cursor:pointer;aspect-ratio:4/3}
.mosaic a.tall{grid-row:span 2;aspect-ratio:auto}
.mosaic a.wide{grid-column:span 2}
.mosaic img{width:100%;height:100%;object-fit:cover;transition:.4s}
.mosaic a:hover img{transform:scale(1.06)}
.mosaic a::after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,transparent 60%,rgba(80,32,143,.2));opacity:0;transition:.25s}
.mosaic a:hover::after{opacity:1}
@media(max-width:900px){.mosaic{grid-template-columns:repeat(3,1fr)}}
@media(max-width:560px){.mosaic{grid-template-columns:repeat(2,1fr)}.mosaic a.tall{grid-row:span 1}}

/* ---------- Solution blog page ---------- */
.sol-hero{position:relative;overflow:hidden;color:#fff;min-height:520px;display:flex;align-items:flex-end}
.sol-hero .photo{position:absolute;inset:0;z-index:0}
.sol-hero .photo img{width:100%;height:100%;object-fit:cover}
.sol-hero .photo::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(15,10,31,.35) 0%,rgba(15,10,31,.55) 50%,rgba(28,18,48,.94) 100%)}
.sol-hero .container{position:relative;z-index:2;padding-bottom:48px;padding-top:120px}
.sol-hero .crumb{font-size:.84rem;color:rgba(255,255,255,.8);margin-bottom:14px}
.sol-hero .crumb a:hover{color:#fff;text-decoration:underline}
.sol-hero h1{color:#fff;font-size:clamp(2rem,4.6vw,3.4rem);max-width:18ch;margin-bottom:14px}
.sol-hero .brandchips{display:flex;gap:8px;flex-wrap:wrap}
.sol-hero .brandchips .chip{background:rgba(255,255,255,.14);color:#fff;border-color:rgba(255,255,255,.35)}
.sol-body{max-width:880px;margin-inline:auto}
.sol-body .lead-x{font-size:1.18rem;line-height:1.8;color:var(--ink);margin-bottom:8px}
.sol-feats{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:24px 0}
.sol-feats .f{display:flex;gap:12px;align-items:flex-start;background:var(--soft);border:1px solid var(--line);border-radius:14px;padding:16px}
.sol-feats .f .ic{flex:none;width:30px;height:30px;border-radius:8px;background:var(--grad);color:#fff;display:grid;place-items:center;font-size:.85rem;font-weight:700}
.sol-feats .f p{font-size:.9rem;color:var(--text-2,#374151)}
.sol-split{display:grid;grid-template-columns:1fr 1fr;gap:30px;align-items:center;margin:36px 0}
.sol-split .figure{margin:0;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}
.sol-models{display:flex;gap:10px;flex-wrap:wrap;margin:14px 0}
.seg-relevance{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:26px 0}
.seg-relevance .r{background:#fff;border:1px solid var(--line);border-radius:14px;padding:20px;box-shadow:var(--shadow)}
.seg-relevance .r b{display:block;color:var(--violet);margin-bottom:8px;font-size:.95rem}

/* ============================================================
   ROUND 3 — more motion, compact segments (Gemini-prompt art),
   gradient solution covers (no event photos)
   ============================================================ */
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
@keyframes floatySlow{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-12px) rotate(3deg)}}
@keyframes gradPan{0%{background-position:0% 50%}100%{background-position:100% 50%}}
@keyframes sheen{0%{transform:translateX(-120%)}60%,100%{transform:translateX(220%)}}
@keyframes pulseRing{0%{box-shadow:0 0 0 0 rgba(112,144,224,.5)}70%{box-shadow:0 0 0 14px rgba(112,144,224,0)}100%{box-shadow:0 0 0 0 rgba(112,144,224,0)}}

/* richer reveal: slight scale + stagger via nth */
.reveal{opacity:0;transform:translateY(28px) scale(.985)}
.reveal.in{opacity:1;transform:none}
.seg-grid .reveal:nth-child(2){transition-delay:.08s}
.seg-grid .reveal:nth-child(3){transition-delay:.16s}
.sol-grid .sol-card:nth-child(3n+2){transition-delay:.06s}
.sol-grid .sol-card:nth-child(3n+3){transition-delay:.12s}

/* button sheen */
.btn-primary,.btn-light,.shop-btn{position:relative;overflow:hidden}
.btn-primary::after,.btn-light::after,.shop-btn::after{content:"";position:absolute;top:0;bottom:0;width:40%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.45),transparent);transform:translateX(-120%);pointer-events:none}
.btn-primary:hover::after,.btn-light:hover::after,.shop-btn:hover::after{animation:sheen .9s ease}

/* animated hero washes pan slowly; add 2nd orb */
.hero-x .wash{background-size:160% 160%;animation:gradPan 16s ease-in-out infinite alternate}
.hero-x .orb.orb2{inset-inline-end:auto;inset-inline-start:8%;top:30%;width:240px;height:240px;background:radial-gradient(circle,rgba(80,32,143,.4),transparent 70%);animation:orbFloat 9s ease-in-out infinite reverse}

/* floating solution-card icon + hover image zoom already present */
.sol-card .icon{animation:floaty 4.5s ease-in-out infinite}
.logo-cell:hover{animation:none}

/* ---- compact one-line segment cards w/ Gemini-prompt art ---- */
.seg-3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:40px}
.seg-c{position:relative;overflow:hidden;border-radius:18px;min-height:250px;display:flex;flex-direction:column;justify-content:flex-end;padding:24px;color:#fff;box-shadow:var(--shadow);transition:transform .3s,box-shadow .3s}
.seg-c:hover{transform:translateY(-7px);box-shadow:var(--shadow-lg)}
.seg-c .art{position:absolute;inset:0;z-index:0;background:linear-gradient(135deg,#50208F,#363996 55%,#7090E0);background-size:180% 180%;animation:gradPan 9s ease-in-out infinite alternate}
.seg-c.s2 .art{background:linear-gradient(135deg,#3a2a7a,#5b6fd6 60%,#70A0D0)}
.seg-c.s3 .art{background:linear-gradient(135deg,#2d1b69,#50208F 60%,#8a6fe8)}
.seg-c .art::before{content:"";position:absolute;inset:0;background-image:radial-gradient(circle at 80% 20%,rgba(255,255,255,.18),transparent 45%),linear-gradient(rgba(255,255,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.06) 1px,transparent 1px);background-size:auto,30px 30px,30px 30px}
.seg-c .ic{position:absolute;top:20px;inset-inline-start:22px;z-index:2;font-size:2rem;animation:floatySlow 6s ease-in-out infinite}
.seg-c .gp{position:absolute;top:16px;inset-inline-end:16px;z-index:3;display:inline-flex;align-items:center;gap:6px;font-size:.6rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;background:rgba(0,0,0,.28);border:1px solid rgba(255,255,255,.3);padding:4px 9px;border-radius:999px}
.seg-c .ov{position:relative;z-index:2}
.seg-c .tag{font-size:.66rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;opacity:.9}
.seg-c h3{color:#fff;font-size:1.4rem;margin:6px 0 6px}
.seg-c p{font-size:.9rem;color:rgba(255,255,255,.88);margin-bottom:10px}
.seg-c .more{font-weight:600;font-size:.88rem;display:inline-flex;gap:6px;align-items:center}
.seg-c .prompt{position:relative;z-index:2;margin-top:12px;font-size:.68rem;font-style:italic;color:rgba(255,255,255,.62);border-top:1px dashed rgba(255,255,255,.25);padding-top:8px}
@media(max-width:760px){.seg-3{grid-template-columns:1fr}}

/* ---- gradient solution cover (cards + hub, no event photos) ---- */
.sol-card .thumb.grad{background:linear-gradient(135deg,#50208F,#363996 55%,#7090E0);background-size:180% 180%;animation:gradPan 10s ease-in-out infinite alternate}
.sol-card .thumb.grad::before{content:"";position:absolute;inset:0;background-image:radial-gradient(circle at 78% 22%,rgba(255,255,255,.16),transparent 46%),linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:auto,26px 26px,26px 26px}
.sol-card .thumb.grad .bigicon{position:absolute;inset:0;z-index:1;display:grid;place-items:center;font-size:3rem;filter:drop-shadow(0 6px 12px rgba(0,0,0,.25));animation:floaty 5s ease-in-out infinite}
.sol-card .thumb.grad::after{display:none}

/* solution hero: gradient version + floating product device */
.sol-hero.grad{background:linear-gradient(135deg,#1a1040,#2d1b69 55%,#363996)}
.sol-hero.grad .photo{display:none}
.sol-hero .deco{position:absolute;inset:0;z-index:1;overflow:hidden;pointer-events:none}
.sol-hero .deco .ring{position:absolute;border:1px solid rgba(255,255,255,.12);border-radius:50%}
.sol-hero .deco .r1{width:420px;height:420px;top:-120px;inset-inline-end:-80px;animation:pulseRing 5s ease-in-out infinite}
.sol-hero .deco .r2{width:240px;height:240px;bottom:-90px;inset-inline-start:10%;border-color:rgba(112,144,224,.25)}
.sol-hero .device{position:absolute;z-index:1;inset-inline-end:6%;top:50%;transform:translateY(-50%);width:300px;max-width:34%;border-radius:18px;overflow:hidden;box-shadow:0 20px 50px rgba(0,0,0,.4);border:3px solid rgba(255,255,255,.12);animation:floatySlow 7s ease-in-out infinite}
.sol-hero .device img{width:100%;height:100%;object-fit:cover}
@media(max-width:860px){.sol-hero .device{display:none}}

/* mp4 video block */
.video-native{border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);margin:24px 0;background:#000}
.video-native video{width:100%;display:block}

/* narrative challenge/solution blocks */
.narr{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:26px 0}
.narr .col{border-radius:16px;padding:24px;border:1px solid var(--line)}
.narr .col.chal{background:#fff5f7;border-color:#f6d6df}
.narr .col.sol{background:var(--soft)}
.narr .col h3{font-size:1.15rem;margin-bottom:12px}
.narr .col.chal h3{color:#c2185b}
.narr .col.sol h3{color:var(--violet)}
.narr ul{list-style:none;display:grid;gap:10px}
.narr li{display:flex;gap:10px;font-size:.9rem;color:var(--text-2,#374151);line-height:1.55}
.narr li::before{content:"";flex:none;width:8px;height:8px;border-radius:50%;margin-top:7px}
.narr .chal li::before{background:#c2185b}
.narr .sol li::before{background:var(--violet)}
@media(max-width:760px){.narr{grid-template-columns:1fr}}

/* ============================================================
   ROUND 3b — SVG icons, compact one-row segments, menu right
   ============================================================ */
[data-icon] svg{display:block}
/* solution card gradient icon */
.sol-card .thumb.grad .bigicon{width:66px;height:66px;color:#fff}
.sol-card .thumb.grad .bigicon svg{width:100%;height:100%}
/* segment compact one-row, icon inline (no emoji) */
.seg-c{justify-content:flex-start;min-height:auto;padding:22px 20px}
.seg-c .ic{position:static;width:34px;height:34px;margin-bottom:12px;color:#fff;animation:floatySlow 6s ease-in-out infinite}
.seg-c .ic svg{width:100%;height:100%}
.seg-c .ov{margin-top:0}
.seg-c h3{font-size:1.22rem;margin:4px 0 5px}
.seg-c p{font-size:.86rem;margin-bottom:8px}
.seg-c .prompt{font-size:.64rem;margin-top:10px;padding-top:7px}
.seg-c .gpic{display:inline-flex;width:12px;height:12px;color:#fff;vertical-align:-1px}
.seg-c .gpic svg{width:100%;height:100%}
.seg-3{grid-template-columns:repeat(3,1fr);gap:18px}
@media(max-width:680px){.seg-3{grid-template-columns:1fr}}
/* contact info icons */
.ci-row .ic{color:#fff}
.ci-row .ic svg{width:20px;height:20px}
/* ---- header: menu pinned to the far edge, tighter ---- */
.nav{gap:20px}
.nav-links{gap:22px;margin-inline-start:auto}
.nav-actions{margin-inline-start:8px}
@media(max-width:820px){
  .nav-links{position:fixed;inset:72px 0 auto 0;background:#fff;flex-direction:column;padding:20px 24px;gap:16px;border-bottom:1px solid var(--line);box-shadow:var(--shadow-lg);display:none}
  .nav-links.open{display:flex}
  .burger{display:flex}
}

/* header: actions pinned far end (works when menu hidden) */
.nav-actions{margin-inline-start:auto}
@media(max-width:820px){.nav-actions{margin-inline-start:auto}}

/* reliability: never hide content even if reveal JS is delayed */
.reveal{opacity:1 !important;transform:none !important}

/* ============================================================
   HOME CATEGORY CARDS — white card + circular SVG avatar.
   Ported from the approved index.html inline overrides so the
   3 sector cards render exactly as approved (overrides the
   gradient .seg-c art version above for these home cards).
   ============================================================ */
.seg-3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:42px}
.seg-c{position:relative;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;background:#fff;border:1px solid var(--line);border-radius:18px;padding:26px 24px;box-shadow:var(--shadow);overflow:hidden;min-height:auto;color:var(--ink);transition:transform .3s,box-shadow .3s}
.seg-c::after{content:none !important}
.seg-c::before{content:"";position:absolute;top:0;left:0;right:0;height:5px}
.seg-c.c-edu::before{background:linear-gradient(90deg,#50208F,#7b4fc7)}
.seg-c.c-hot::before{background:linear-gradient(90deg,#5b6fd6,#70A0D0)}
.seg-c.c-cor::before{background:linear-gradient(90deg,#363996,#8a6fe8)}
.seg-c:hover{transform:translateY(-7px);box-shadow:var(--shadow-lg)}
.seg-ava{display:grid;place-items:center;border-radius:50%;color:#fff;margin-bottom:16px;box-shadow:0 8px 20px rgba(80,32,143,.28);animation:floaty 5s ease-in-out infinite}
.seg-c.c-edu .seg-ava{background:linear-gradient(135deg,#50208F,#7b4fc7)}
.seg-c.c-hot .seg-ava{background:linear-gradient(135deg,#5b6fd6,#70A0D0)}
.seg-c.c-cor .seg-ava{background:linear-gradient(135deg,#363996,#8a6fe8)}
.seg-ava svg{width:100%;height:100%}
.seg-c .seg-tag{font-size:.68rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--slate)}
.seg-c h3{color:var(--ink);font-size:1.3rem;margin:6px 0 8px}
.seg-c p{color:var(--slate);font-size:.9rem;margin-bottom:14px}
.seg-c .more{color:var(--violet);font-weight:600;font-size:.9rem;margin-top:auto}
@media(max-width:760px){.seg-3{grid-template-columns:1fr}}

/* ---- Home solutions cards (.sol-cardx) used by [mqr_solutions_grid] ---- */
.sol-cardx{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);transition:.3s;display:flex;flex-direction:column}
.sol-cardx:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg)}
.sol-cardx .cov{position:relative;aspect-ratio:4/3;overflow:hidden;background:linear-gradient(135deg,#50208F,#363996 55%,#7090E0);background-size:180% 180%;animation:gradPan 10s ease-in-out infinite alternate}
.sol-cardx .cov::before{content:"";position:absolute;inset:0;background-image:radial-gradient(circle at 78% 22%,rgba(255,255,255,.16),transparent 46%),linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:auto,26px 26px,26px 26px}
.sol-cardx .cov img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:.5s}
.sol-cardx:hover .cov img{transform:scale(1.07)}
.sol-cardx .cov .bigicon{position:absolute;inset:0;z-index:1;display:grid;place-items:center;color:#fff;animation:floaty 5s ease-in-out infinite}
.sol-cardx .cov .bigicon svg{width:64px;height:64px;filter:drop-shadow(0 6px 12px rgba(0,0,0,.25))}
.sol-cardx .ava{position:absolute;top:14px;inset-inline-start:14px;z-index:2;width:44px;height:44px;border-radius:12px;background:rgba(255,255,255,.92);color:var(--violet);display:grid;place-items:center;box-shadow:var(--shadow);animation:floaty 4.5s ease-in-out infinite}
.sol-cardx .ava svg{width:26px;height:26px}
.sol-cardx .bd{padding:18px;display:flex;flex-direction:column;gap:8px;flex:1}
.sol-cardx h3{font-size:1.06rem}
.sol-cardx p{font-size:.86rem;color:var(--slate);flex:1}
.sol-cardx .badge2{align-self:flex-start;font-size:.68rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;padding:4px 10px;border-radius:999px}
.sol-cardx .read{font-weight:600;font-size:.85rem;color:var(--violet);display:inline-flex;gap:6px;align-items:center}


/* ---------- Elementor-editable pages: theme sections keep full control ---------- */
.elementor-page .elementor-section > .elementor-container{max-width:100%;padding:0}
.elementor-page .elementor-section{padding-top:0;padding-bottom:0}
.elementor-page .elementor-column-gap-default > .elementor-column > .elementor-element-populated{padding:0}
.elementor-page .elementor-widget-wrap{padding:0}
.elementor-page .elementor-widget:not(:last-child){margin-block-end:0}
.elementor-page .elementor-widget-html,.elementor-page .elementor-widget-shortcode{margin:0}

/* WP nav menu: no list bullets */
ul.nav-links,ul.nav-links li{list-style:none;margin:0}
ul.nav-links{padding:0}
.footer ul{list-style:none;margin:0;padding:0}

/* header already has the switcher: hide TP floating one */
.trp-floating-switcher{display:none!important}

/* logo squeeze fix + mobile size */
.nav .logo{flex:0 0 auto}
.logo img{max-width:none}
@media(max-width:560px){.logo img{height:44px}}

/* ================= Meeting booking calendar ================= */
.bookwrap{--bk-line:var(--line)}
.book-ok{display:flex;flex-direction:column;gap:4px;background:linear-gradient(135deg,#0f7a4d,#12a065);color:#fff;border-radius:16px;padding:18px 22px;margin-bottom:24px;box-shadow:var(--shadow)}
.book-ok span{opacity:.9;font-size:.92rem}
.book-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:22px;align-items:start}
.book-cal,.book-slots,.book-details{background:#fff;border:1px solid var(--bk-line);border-radius:20px;padding:22px;box-shadow:var(--shadow)}
.book-details{margin-top:22px}
.bc-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.bc-title{font-weight:700;font-size:1.05rem;color:var(--ink)}
.bc-nav{width:36px;height:36px;border-radius:10px;border:1px solid var(--bk-line);background:#fff;color:var(--violet);font-size:1.25rem;line-height:1;cursor:pointer;transition:.2s}
.bc-nav:hover{background:var(--soft);border-color:#d9d2f0}
.bc-dow{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;margin-bottom:6px}
.bc-dow span{text-align:center;font-size:.72rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--slate)}
.bc-days{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}
.bc-empty{display:block;height:44px}
.bc-day{height:44px;border-radius:11px;border:1px solid transparent;background:var(--soft);color:var(--ink);font-weight:600;font-size:.92rem;font-family:inherit;cursor:pointer;transition:.18s}
.bc-day:hover:not(:disabled){background:#fff;border-color:var(--peri);transform:translateY(-1px)}
.bc-day.off{opacity:.32;cursor:not-allowed;background:transparent}
.bc-day.sel{background:var(--grad);color:#fff;box-shadow:0 6px 16px rgba(80,32,143,.32)}
.bc-note{margin-top:14px;font-size:.8rem;color:var(--slate)}
.bs-head{display:flex;align-items:center;gap:10px;margin-bottom:14px;flex-wrap:wrap}
.bs-head .step{font-size:.66rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--violet);background:var(--soft);border:1px solid var(--bk-line);border-radius:999px;padding:4px 10px}
.bs-head h4{font-size:1.02rem;margin:0}
.bs-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.slot{padding:12px 8px;border-radius:11px;border:1px solid var(--bk-line);background:#fff;font-weight:600;font-size:.9rem;font-family:inherit;color:var(--ink);cursor:pointer;transition:.18s}
.slot:hover:not(:disabled){border-color:var(--peri);background:var(--soft)}
.slot:disabled{opacity:.4;cursor:not-allowed}
.slot.sel{background:var(--grad);color:#fff;border-color:transparent;box-shadow:0 6px 16px rgba(80,32,143,.3)}
.bs-dur{display:flex;align-items:center;gap:8px;margin-top:14px;font-size:.83rem;color:var(--slate)}
.bs-dur .dot{width:8px;height:8px;border-radius:50%;background:#12a065;box-shadow:0 0 0 4px rgba(18,160,101,.15)}
.bd-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.bd-grid .full{grid-column:1/-1}
.bookbtn{margin-top:20px}
.bookbtn:disabled{opacity:.45;cursor:not-allowed;transform:none;box-shadow:none}
@media(max-width:900px){.book-grid{grid-template-columns:1fr}.bd-grid{grid-template-columns:1fr}}
[dir="rtl"] .bc-nav{transform:scaleX(-1)}

/* Solution card covers: light backdrop so transparent product cut-outs read well */


/* ============ Round-4 fixes: logos, mobile solutions, calendar, hero ============ */

/* 1) Logo walls — uniform, smaller, tidy */
.logo-grid{grid-template-columns:repeat(6,1fr);gap:14px;align-items:stretch}
.logo-cell{aspect-ratio:3/2;padding:14px;display:grid;place-items:center;overflow:hidden}
.logo-cell img{max-height:56px;max-width:82%;width:auto;height:auto;object-fit:contain}
@media(max-width:1024px){.logo-grid{grid-template-columns:repeat(4,1fr)}.logo-cell img{max-height:46px}}
@media(max-width:640px){.logo-grid{grid-template-columns:repeat(3,1fr);gap:10px}.logo-cell{padding:10px}.logo-cell img{max-height:34px;max-width:88%}}

/* 2) Solutions + segments: swipeable row on mobile */
@media(max-width:760px){
  .sol-grid,.seg-3{display:flex;overflow-x:auto;gap:14px;scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;padding:4px 16px 14px;margin-inline:-16px;scrollbar-width:none}
  .sol-grid::-webkit-scrollbar,.seg-3::-webkit-scrollbar{display:none}
  .sol-grid > *,.seg-3 > *{flex:0 0 78%;scroll-snap-align:center}
  .evgrid{display:flex;overflow-x:auto;gap:14px;scroll-snap-type:x mandatory;padding:4px 16px 14px;margin-inline:-16px;scrollbar-width:none}
  .evgrid::-webkit-scrollbar{display:none}
  .evgrid > *{flex:0 0 82%;scroll-snap-align:center}
}

/* 3) Calendar: selected day must stay readable */
.bc-day.sel,.bc-day.sel:hover{background:linear-gradient(135deg,#50208F,#7090E0)!important;color:#fff!important;border-color:transparent!important}
.slot.sel,.slot.sel:hover{background:linear-gradient(135deg,#50208F,#7090E0)!important;color:#fff!important;border-color:transparent!important}

/* 4) Remove the hero scroll hint */
.scrollhint{display:none!important}

/* selected time slot must be white text (beat theme/Elementor button rules) */
.bookwrap .book-slots .bs-grid button.slot.sel,
.bookwrap .book-slots .bs-grid button.slot.sel:hover,
.bookwrap .book-slots .bs-grid button.slot.sel:focus{color:#fff!important;-webkit-text-fill-color:#fff!important}

/* ==================== SMART CLASSROOM ==================== */
.scx{--scx-ink:#0f0a1f;--scx-e:cubic-bezier(.22,.85,.28,1)}
.scx section{position:relative}

/* ---------- 1. hero ---------- */
.scx-hero{position:relative;min-height:100svh;display:flex;align-items:center;overflow:hidden;background:var(--scx-ink);color:#fff}
.scx-hero-media{position:absolute;inset:-8% 0;will-change:transform}
.scx-hero-media img{width:100%;height:100%;object-fit:cover;opacity:.5}
.scx-hero-veil{position:absolute;inset:0;background:
  radial-gradient(60% 60% at 20% 30%,rgba(80,32,143,.55),transparent 70%),
  radial-gradient(50% 50% at 80% 70%,rgba(112,144,224,.4),transparent 70%),
  linear-gradient(180deg,rgba(15,10,31,.7),rgba(15,10,31,.94))}
.scx-grid-lines{position:absolute;inset:0;display:grid;grid-template-columns:repeat(5,1fr);opacity:.14;pointer-events:none}
.scx-grid-lines span{border-inline-start:1px solid #fff}
.scx-hero-in{position:relative;z-index:3;padding-block:120px}
.scx-kicker{display:flex;align-items:center;gap:12px;font-size:.76rem;font-weight:800;letter-spacing:.18em;text-transform:uppercase;color:#c9bdf2;margin-bottom:22px}
.scx-kicker .ln{width:46px;height:2px;background:linear-gradient(90deg,#7090E0,transparent)}
.scx-title{font-size:clamp(2.6rem,8vw,6.4rem);line-height:.98;letter-spacing:-.03em;color:#fff;margin:0 0 20px;max-width:14ch}
.scx-title em{font-style:normal;background:linear-gradient(100deg,#b9a7ff,#7090E0 55%,#ffffff);-webkit-background-clip:text;background-clip:text;color:transparent}
.scx-title .ltr{display:inline-block;opacity:0;transform:translateY(.75em) rotate(4deg);transition:opacity .6s var(--scx-e),transform .8s var(--scx-e)}
.scx-title.in .ltr{opacity:1;transform:none}
.scx-sub{max-width:56ch;color:rgba(255,255,255,.82);font-size:1.06rem;line-height:1.75;margin-bottom:32px}
.scx-cta{display:flex;gap:14px;flex-wrap:wrap}
.scx-progress{position:absolute;left:0;right:0;bottom:0;height:3px;background:rgba(255,255,255,.12);z-index:4}
.scx-progress i{display:block;height:100%;background:linear-gradient(90deg,#50208F,#7090E0);transform:scaleX(0);transform-origin:0 50%;transition:transform .12s linear}

/* ---------- 2. statement ---------- */
.scx-state{padding:clamp(80px,12vw,160px) 0;background:#fff}
.scx-bigtext{font-family:var(--ff-h,inherit);font-weight:700;font-size:clamp(1.5rem,3.6vw,2.9rem);line-height:1.28;letter-spacing:-.02em;color:var(--ink);max-width:22ch;margin:0 auto;text-align:center}
.scx-bigtext .wd{display:inline-block;overflow:hidden;vertical-align:top}
.scx-bigtext .wd i{display:inline-block;font-style:normal;transform:translateY(105%);opacity:.15;transition:transform .7s var(--scx-e),opacity .7s var(--scx-e)}
.scx-bigtext.in .wd i{transform:none;opacity:1}

/* ---------- 3. pinned build-up ---------- */
.scx-build{height:560vh;background:linear-gradient(180deg,#0f0a1f,#1b1140 45%,#0f0a1f)}
.scx-stick{position:sticky;top:0;height:100svh;display:flex;align-items:center;overflow:hidden;color:#fff}
.scx-stage-wrap{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(24px,5vw,80px);align-items:center;width:100%}

.scx-visual{position:relative;display:flex;flex-direction:column;align-items:center;gap:26px}
.scx-room{position:relative;width:min(46vh,360px);aspect-ratio:1;display:grid;place-items:center}
.scx-room-glow{position:absolute;inset:-18%;border-radius:50%;background:radial-gradient(circle,rgba(112,144,224,.34),transparent 66%);filter:blur(18px);animation:scxPulse 5s ease-in-out infinite}
@keyframes scxPulse{0%,100%{transform:scale(1);opacity:.75}50%{transform:scale(1.12);opacity:1}}
.scx-layer{position:absolute;inset:0;display:grid;place-items:center;opacity:0;transform:scale(.72) rotate(-8deg);transition:opacity .7s var(--scx-e),transform .9s var(--scx-e)}
.scx-layer.on{opacity:.3;transform:scale(1) rotate(0)}
.scx-layer.live{opacity:1;transform:scale(1.06)}
.scx-layer-ic{width:112px;height:112px;border-radius:28px;display:grid;place-items:center;color:#fff;
  background:linear-gradient(150deg,rgba(255,255,255,.14),rgba(255,255,255,.04));
  border:1px solid rgba(255,255,255,.24);backdrop-filter:blur(8px);box-shadow:0 22px 60px rgba(80,32,143,.5)}
.scx-layer.live .scx-layer-ic{background:linear-gradient(150deg,#50208F,#7090E0);border-color:transparent}
.scx-rings{position:absolute;inset:0;pointer-events:none}
.scx-rings i{position:absolute;inset:0;margin:auto;border:1px solid rgba(255,255,255,.16);border-radius:50%;animation:scxRing 4.5s linear infinite}
.scx-rings i:nth-child(1){width:62%;height:62%}
.scx-rings i:nth-child(2){width:86%;height:86%;animation-delay:.9s}
.scx-rings i:nth-child(3){width:110%;height:110%;animation-delay:1.8s}
@keyframes scxRing{0%{transform:scale(.86);opacity:0}35%{opacity:.55}100%{transform:scale(1.16);opacity:0}}

.scx-dots{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;max-width:340px}
.scx-dot{display:inline-flex;align-items:center;gap:7px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16);
  color:rgba(255,255,255,.7);border-radius:999px;padding:6px 12px;font:600 .74rem/1 inherit;cursor:pointer;transition:.25s;font-family:inherit}
.scx-dot span{width:6px;height:6px;border-radius:50%;background:currentColor;opacity:.6}
.scx-dot em{font-style:normal}
.scx-dot:hover{background:rgba(255,255,255,.14);color:#fff}
.scx-dot.on{background:linear-gradient(135deg,#50208F,#7090E0);border-color:transparent;color:#fff}
.scx-dot.on span{opacity:1}

.scx-copy{position:relative;min-height:min(62vh,460px)}
.scx-panel{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;
  opacity:0;transform:translateY(38px);pointer-events:none;transition:opacity .6s var(--scx-e),transform .7s var(--scx-e)}
.scx-panel.on{opacity:1;transform:none;pointer-events:auto}
.scx-panel.past{transform:translateY(-30px)}
.scx-num{font-size:.8rem;font-weight:800;letter-spacing:.2em;color:#7090E0}
.scx-label{font-size:.72rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.6);margin:10px 0 12px}
.scx-panel h2{color:#fff;font-size:clamp(1.7rem,3.6vw,3rem);line-height:1.1;letter-spacing:-.02em;margin:0 0 16px;max-width:18ch}
.scx-panel p{color:rgba(255,255,255,.78);font-size:1.02rem;line-height:1.8;max-width:52ch;margin:0}
.scx-stat{display:flex;align-items:baseline;gap:12px;margin-top:26px;padding-top:20px;border-top:1px solid rgba(255,255,255,.16)}
.scx-stat b{font-size:clamp(1.8rem,4vw,2.8rem);line-height:1;background:linear-gradient(120deg,#fff,#b9a7ff);-webkit-background-clip:text;background-clip:text;color:transparent}
.scx-stat span{color:rgba(255,255,255,.65);font-size:.9rem}

/* ---------- 4. kit rail ---------- */
.scx-rail-sec{padding:clamp(70px,10vw,120px) 0;background:var(--soft);border-block:1px solid var(--line)}
.scx-rail{margin-top:38px;overflow-x:auto;scrollbar-width:none;cursor:grab;scroll-snap-type:x proximity}
.scx-rail::-webkit-scrollbar{display:none}
.scx-rail.drag{cursor:grabbing;scroll-snap-type:none}
.scx-rail-track{display:flex;gap:18px;padding:6px clamp(16px,6vw,80px) 20px}
.scx-kit{flex:0 0 clamp(240px,26vw,300px);scroll-snap-align:center;background:#fff;border:1px solid var(--line);border-radius:20px;
  padding:26px 22px;box-shadow:var(--shadow);opacity:0;transform:translateY(26px);transition:opacity .6s var(--scx-e),transform .6s var(--scx-e),box-shadow .3s}
.scx-kit.vis{opacity:1;transform:none}
.scx-kit:hover{box-shadow:var(--shadow-lg);transform:translateY(-6px)}
.scx-kit-ic{width:56px;height:56px;border-radius:16px;display:grid;place-items:center;color:#fff;
  background:linear-gradient(135deg,#50208F,#7090E0);box-shadow:0 10px 24px rgba(80,32,143,.28);margin-bottom:16px}
.scx-kit h3{font-size:1.02rem;margin:0 0 8px}
.scx-kit p{color:var(--slate);font-size:.9rem;line-height:1.65;margin:0}
.scx-rail-hint{margin-top:6px;color:var(--slate);font-size:.82rem}

/* ---------- 5. outcomes ---------- */
.scx-out{padding:clamp(70px,10vw,120px) 0;background:#fff}
.scx-out-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.scx-out-c{text-align:center;padding:30px 18px;border-radius:20px;background:var(--soft);border:1px solid var(--line);
  opacity:0;transform:translateY(24px);transition:opacity .6s var(--scx-e),transform .6s var(--scx-e)}
.scx-out-c.vis{opacity:1;transform:none}
.scx-out-n{font-size:clamp(2rem,4.6vw,3.1rem);font-weight:800;line-height:1;letter-spacing:-.02em;
  background:linear-gradient(120deg,#50208F,#7090E0);-webkit-background-clip:text;background-clip:text;color:transparent}
.scx-out-n i{font-style:normal}
.scx-out-l{margin-top:10px;color:var(--slate);font-size:.9rem}

/* ---------- 6. process ---------- */
.scx-proc{padding:clamp(70px,10vw,120px) 0;background:var(--soft);border-top:1px solid var(--line)}
.scx-steps{display:grid;grid-template-columns:repeat(5,1fr);gap:18px;margin-top:38px;counter-reset:s}
.scx-step{background:#fff;border:1px solid var(--line);border-radius:18px;padding:24px 20px;box-shadow:var(--shadow);
  opacity:0;transform:translateY(24px);transition:opacity .6s var(--scx-e),transform .6s var(--scx-e)}
.scx-step.vis{opacity:1;transform:none}
.scx-step-n{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;font-weight:800;color:#fff;
  background:linear-gradient(135deg,#50208F,#7090E0);margin-bottom:14px}
.scx-step h3{font-size:1rem;margin:0 0 8px}
.scx-step p{color:var(--slate);font-size:.88rem;line-height:1.65;margin:0}

/* ---------- 7. cta ---------- */
.scx-cta-sec{position:relative;padding:clamp(80px,11vw,140px) 0;background:linear-gradient(135deg,#1a1040,#2d1b69 55%,#363996);color:#fff;overflow:hidden}
.scx-cta-glow{position:absolute;inset:auto -10% -50% auto;width:60vw;height:60vw;border-radius:50%;
  background:radial-gradient(circle,rgba(112,144,224,.4),transparent 66%);filter:blur(30px)}
.scx-cta-sec h2{color:#fff;font-size:clamp(1.8rem,4.4vw,3rem);margin:0 0 12px;position:relative;z-index:2}
.scx-cta-sec p{color:rgba(255,255,255,.8);margin:0 0 26px;position:relative;z-index:2}
.scx-cta-sec .btn{position:relative;z-index:2}

/* ---------- responsive ---------- */
@media(max-width:960px){
  .scx-stage-wrap{grid-template-columns:1fr;gap:26px;text-align:center}
  .scx-copy{min-height:340px}
  .scx-panel{align-items:center}
  .scx-panel h2,.scx-panel p{max-width:100%}
  .scx-stat{justify-content:center}
  .scx-room{width:min(34vh,260px)}
  .scx-layer-ic{width:88px;height:88px;border-radius:24px}
  .scx-out-grid{grid-template-columns:repeat(2,1fr)}
  .scx-steps{grid-template-columns:repeat(2,1fr)}
  .scx-build{height:520vh}
}
@media(max-width:560px){
  .scx-out-grid{grid-template-columns:repeat(2,1fr)}
  .scx-steps{grid-template-columns:1fr}
  .scx-hero-in{padding-block:96px}
  .scx-dots{max-width:100%}
  .scx-dot{padding:5px 10px;font-size:.68rem}
}
@media(prefers-reduced-motion:reduce){
  .scx-title .ltr,.scx-bigtext .wd i,.scx-kit,.scx-step,.scx-out-c{opacity:1!important;transform:none!important}
  .scx-room-glow,.scx-rings i{animation:none}
}
[dir="rtl"] .scx-kicker .ln{background:linear-gradient(270deg,#7090E0,transparent)}

/* fail-safe: text is visible unless JS is running (and forced visible on timeout) */
.scx-title .ltr{opacity:1;transform:none}
.scx-js .scx-title .ltr{opacity:0;transform:translateY(.75em) rotate(4deg)}
.scx-js .scx-title.in .ltr,.scx-show .scx-title .ltr{opacity:1!important;transform:none!important}
.scx-bigtext .wd i{transform:none;opacity:1}
.scx-js .scx-bigtext .wd i{transform:translateY(105%);opacity:.15}
.scx-js .scx-bigtext.in .wd i,.scx-show .scx-bigtext .wd i{transform:none!important;opacity:1!important}
.scx-kit,.scx-step,.scx-out-c{opacity:1;transform:none}
.scx-js .scx-kit,.scx-js .scx-step,.scx-js .scx-out-c{opacity:0;transform:translateY(24px)}
.scx-js .scx-kit.vis,.scx-js .scx-step.vis,.scx-js .scx-out-c.vis,
.scx-show .scx-kit,.scx-show .scx-step,.scx-show .scx-out-c{opacity:1!important;transform:none!important}
/* if the pinned sequence can't run, still show the first panel */
.scx-show .scx-panel:first-child{opacity:1;transform:none;position:relative}

/* ============ Round-5: icons + logo carousel ============ */

/* 1) Segment cards: cleaner squircle icon design */
.seg-c .seg-ava{width:74px!important;height:74px!important;border-radius:22px!important;
	box-shadow:0 14px 30px rgba(80,32,143,.32), inset 0 0 0 3px rgba(255,255,255,.4)!important;
	transform:rotate(-4deg);transition:transform .35s;animation:none!important;margin-bottom:18px}
.seg-c:hover .seg-ava{transform:rotate(0) scale(1.07)}
.seg-c .seg-ava svg{width:32px!important;height:32px!important}

/* 2) Solution cards: remove the circle icon overlays entirely */
.sol-cardx .ava{display:none!important}
.sol-cardx .bd{padding-top:20px!important}
.sol-card .icon{display:none!important}

/* 3) Logo walls: big auto-scrolling carousel */
.logo-marquee{display:flex!important;grid-template-columns:none!important;gap:18px;overflow:hidden;
	-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
	mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.logo-marquee .logo-cell{flex:0 0 220px;height:136px;aspect-ratio:auto}
.logo-marquee .logo-cell img{max-height:88px;max-width:82%}
@media(max-width:640px){
	.logo-marquee .logo-cell{flex:0 0 160px;height:104px}
	.logo-marquee .logo-cell img{max-height:64px}
}

/* ============ Round-6: neat high-res gallery grid ============ */
.mosaic{display:grid!important;grid-template-columns:repeat(4,1fr)!important;gap:12px!important;grid-auto-rows:auto!important;grid-auto-flow:row!important}
.mosaic a{position:relative;display:block;aspect-ratio:4/3!important;overflow:hidden;border-radius:14px;background:var(--soft);
	grid-row:auto!important;grid-column:auto!important;box-shadow:0 4px 14px rgba(28,18,48,.08);transition:transform .25s,box-shadow .25s}
.mosaic a.tall,.mosaic a.wide{grid-row:auto!important;grid-column:auto!important}
.mosaic a:hover{transform:translateY(-3px);box-shadow:0 12px 28px rgba(80,32,143,.18);z-index:2}
.mosaic img{width:100%!important;height:100%!important;object-fit:cover!important;display:block;transition:transform .4s}
.mosaic a:hover img{transform:scale(1.05)}
.gal-group{margin-bottom:56px}
.gal-group .gh{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px;
	padding-bottom:12px;border-bottom:2px solid var(--line)}
.gal-group .gh h3{font-size:1.25rem;margin:0}
.gal-group .gh .cnt{font-size:.8rem;font-weight:700;color:var(--violet);background:var(--soft);
	border:1px solid var(--line);border-radius:999px;padding:5px 13px;white-space:nowrap}
@media(max-width:1024px){.mosaic{grid-template-columns:repeat(3,1fr)!important;gap:10px!important}}
@media(max-width:640px){
	.mosaic{grid-template-columns:repeat(2,1fr)!important;gap:8px!important}
	.mosaic a{border-radius:10px}
	.gal-group{margin-bottom:40px}
	.gal-group .gh h3{font-size:1.05rem}
}

/* ============ Solution full-detail section ============ */
.soldx{padding:10px 0 20px}
.soldx-sub{font-size:1.12rem;line-height:1.7;color:var(--ink);font-weight:600;border-inline-start:4px solid var(--violet);
	padding-inline-start:18px;margin:8px 0 30px}
.soldx-block{margin:34px 0}
.soldx .section-title{font-size:1.5rem;margin-bottom:18px}
.soldx-h3{font-size:1.15rem;margin:0 0 14px;color:var(--ink)}
.soldx-feat{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:12px 26px}
.soldx-feat li{display:flex;gap:11px;align-items:flex-start;font-size:.98rem;line-height:1.6;color:var(--slate)}
.soldx-feat .tick{flex:none;width:24px;height:24px;border-radius:8px;background:var(--soft);border:1px solid var(--line);
	display:grid;place-items:center;color:var(--violet);margin-top:1px}
.soldx-feat .tick svg{width:15px;height:15px}
.soldx-models{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:12px}
.soldx-model{background:#fff;border:1px solid var(--line);border-radius:14px;padding:16px 18px;box-shadow:var(--shadow)}
.soldx-model b{display:block;font-size:1.1rem;color:var(--violet)}
.soldx-model span{font-size:.86rem;color:var(--slate)}
.soldx-brands{display:flex;flex-wrap:wrap;gap:10px}
.soldx-brand{font-weight:700;font-size:.9rem;color:var(--ink);background:var(--soft);border:1px solid var(--line);
	border-radius:999px;padding:9px 18px}
.soldx-videos{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.soldx-video{position:relative;aspect-ratio:16/9;border-radius:14px;overflow:hidden;box-shadow:var(--shadow);background:#000}
.soldx-video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
@media(max-width:760px){
	.soldx-feat{grid-template-columns:1fr}
	.soldx-videos{grid-template-columns:1fr}
}

/* ============ Round-7: RTL polish + uniform solution imagery ============ */

/* ---- RTL: mirror arrows and align rows correctly ---- */
[dir="rtl"] .sol-cardx .read,
[dir="rtl"] .evx-card .foot,
[dir="rtl"] .arx-card,
[dir="rtl"] .soldx-feat li{text-align:right}
[dir="rtl"] .sol-cardx .bd,
[dir="rtl"] .evx-card .bd{text-align:right}
[dir="rtl"] .evx-card .foot{flex-direction:row-reverse}
[dir="rtl"] .btn .arr,
[dir="rtl"] .read,
[dir="rtl"] .more{display:inline-block}
[dir="rtl"] .btn .arr{transform:scaleX(-1)}
[dir="rtl"] .btn:hover .arr{transform:scaleX(-1) translateX(3px)}
[dir="rtl"] .crumb{direction:rtl;text-align:right}
[dir="rtl"] .filter-bar,[dir="rtl"] .evfilter{justify-content:flex-start}
[dir="rtl"] .gal-group .gh{flex-direction:row-reverse}
[dir="rtl"] .soldx-sub{border-inline-start:0;border-inline-end:4px solid var(--violet);
	padding-inline-start:0;padding-inline-end:18px}
[dir="rtl"] .mlive-list li,[dir="rtl"] .arx-chips,[dir="rtl"] .soldx-brands{flex-direction:row-reverse}
[dir="rtl"] .mlive-copy,[dir="rtl"] .soldx,[dir="rtl"] .arx-card{text-align:right}
[dir="rtl"] .contact-info-card,[dir="rtl"] .staff a{text-align:right}
[dir="rtl"] .staff a{flex-direction:row-reverse}
[dir="rtl"] .foot-bottom{flex-direction:row-reverse}
[dir="rtl"] .footer .grid{direction:rtl}
[dir="rtl"] .hero-x .hero-stats,[dir="rtl"] .statband .grid{direction:rtl}
[dir="rtl"] .seg-c .more{direction:rtl}
[dir="rtl"] .bc-days,[dir="rtl"] .bc-dow{direction:rtl}
[dir="rtl"] .book-grid,[dir="rtl"] .bd-grid,[dir="rtl"] .contact-grid{direction:rtl}

/* ---- Uniform solution card imagery ----
   Photos, logos and product cut-outs all get the same frame, so the grid
   reads as one consistent set instead of a mix of styles. */

.sol-cardx .cov img{width:100%!important;height:100%!important;object-fit:cover!important;
	object-position:center;transition:transform .5s ease}
.sol-cardx:hover .cov img{transform:scale(1.06)}
/* soft brand wash unifies wildly different source images */

/* logo-style covers (transparent / mostly white) sit centred and padded instead of cropped */


/* logo carousel: clipping viewport + moving track (works LTR and RTL) */
.logo-marquee{display:block!important;position:relative;overflow:hidden;grid-template-columns:none!important;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.logo-mq-track{display:flex;gap:18px;width:max-content;will-change:transform;direction:ltr}
.logo-marquee .logo-cell{flex:0 0 220px;height:136px;aspect-ratio:auto;margin:0}
.logo-marquee .logo-cell img{max-height:88px;max-width:82%}
@media(max-width:640px){
  .logo-marquee .logo-cell{flex:0 0 160px;height:104px}
  .logo-marquee .logo-cell img{max-height:64px}
}

/* CSS-driven logo marquee */
.logo-mq-track{animation-name:mqrLogoScroll;animation-timing-function:linear;animation-iteration-count:infinite}
@keyframes mqrLogoScroll{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}
.logo-marquee:hover .logo-mq-track{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){.logo-mq-track{animation:none}}

/* no-tint solution covers — show the original image as-is */
.sol-cardx .cov{position:relative;aspect-ratio:16/10;overflow:hidden;background:#f3f1fa}
.sol-cardx .cov img{width:100%;height:100%;object-fit:cover;transition:transform .45s}
.sol-cardx:hover .cov img{transform:scale(1.05)}

/* ---------------------------------------------------------------
   Footer overflow fix (mobile)
   Grid items default to min-width:auto, so a long link could push a
   track wider than its 1fr share and shove the whole footer past the
   viewport — which gave every page a horizontal scrollbar on phones.
   --------------------------------------------------------------- */
.footer .grid>*{min-width:0}
.footer ul a,.footer p.tag{overflow-wrap:anywhere}
@media(max-width:560px){
  .footer .grid{grid-template-columns:1fr;gap:28px}
  .footer{padding:48px 0 24px}
}

/* ---------------------------------------------------------------
   Header overflow fix (small phones, <=400px)
   Logo + language switcher + Shop + burger was 15px wider than a
   360px screen, which gave the whole site a horizontal scrollbar.
   --------------------------------------------------------------- */
@media(max-width:400px){
  .header .container{padding-inline:14px}
  .nav-actions{gap:7px}
  .logo img{height:42px}
  .nav-actions .shop-btn{padding:8px 11px;font-size:.8rem}
  .burger{padding:6px 2px}
}
@media(max-width:340px){
  .nav-actions .shop-btn{display:none}
}

/* ============================================================
   Solution card service icons
   The badge was hidden and the big centred glyph sat under the
   photo, so a card showed no clue what the service was. Now every
   card carries a duotone icon badge; the big glyph is kept only
   for cards that have no photograph.
   ============================================================ */
.sol-cardx .ava{
  display:grid!important;
  top:12px;inset-inline-start:12px;
  width:52px;height:52px;border-radius:14px;
  background:#fff;color:var(--violet);
  border:1px solid rgba(80,32,143,.10);
  box-shadow:0 6px 18px rgba(28,18,48,.20);
  animation:none;
  transition:transform .25s ease;
}
.sol-cardx .ava svg{width:30px;height:30px}
.sol-cardx:hover .ava{transform:translateY(-3px) rotate(-3deg)}
/* a photo already tells the story — drop the giant watermark glyph */
.sol-cardx .cov:has(img) .bigicon{display:none}
.sol-cardx .cov .bigicon svg{width:72px;height:72px}

[dir="rtl"] .sol-cardx .ava{inset-inline-start:12px}
@media (max-width:600px){
  .sol-cardx .ava{width:44px;height:44px;border-radius:12px}
  .sol-cardx .ava svg{width:25px;height:25px}
}

/* ============================================================
   Hero classroom plan  ·  .hero-x additions
   The hero itself is untouched MQR branding — photo, wash, pill
   buttons, stats. This only adds a right-hand column holding a
   line-art top view of the smart classroom, tinted for the dark
   hero, plus two small glass status cards. Copy stays first in
   the DOM, so mobile and screen readers see the message before
   the decoration.
   ============================================================ */
.hero-x .hero-grid{display:grid;grid-template-columns:1.04fr .96fr;gap:44px;align-items:center}
.hero-x .hero-plan{position:relative;min-width:0}
.hero-x .hero-plan svg{width:100%;height:auto;filter:drop-shadow(0 20px 46px rgba(8,3,24,.5))}

.hero-x .plbl{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:9.5px;fill:#DCD6F2;letter-spacing:.04em}
.hero-x .plbl-b{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:9.5px;fill:#AFC2FF;font-weight:700;letter-spacing:.04em}
.hero-x .plbl-s{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:8px;fill:#9C93BF;letter-spacing:.06em}

.hero-x .pwin{
  position:absolute;z-index:3;display:flex;align-items:center;gap:11px;
  padding:11px 15px;border-radius:14px;
  background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.20);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  box-shadow:0 14px 34px rgba(8,3,24,.45);
}
.hero-x .pwin .ic{
  flex:none;width:34px;height:34px;border-radius:10px;display:grid;place-items:center;
  background:var(--grad);color:#fff;font-size:.82rem;
}
.hero-x .pwin b{display:block;color:#fff;font-size:.82rem;font-weight:600;line-height:1.25}
.hero-x .pwin span:not(.ic){display:block;color:#CFC8E8;font-size:.72rem}
.hero-x .pwin.pw1{top:-4%;inset-inline-end:2%}
.hero-x .pwin.pw2{bottom:-2%;inset-inline-start:-2%}

@media (max-width:1080px){
  .hero-x .hero-grid{grid-template-columns:1fr;gap:8px}
  .hero-x .hero-plan{display:none}
}
