:root{
  --accent:#baff00;--accent-2:#83b900;--dark-bg:#030706;--dark-surface:#0a100d;--dark-text:#f4f7f5;--dark-muted:#9ca8a0;--bg:var(--dark-bg);--bg-2:#07100b;--surface:var(--dark-surface);--surface-2:#0e1712;
  --text:var(--dark-text);--muted:var(--dark-muted);--line:rgba(186,255,0,.18);--line-strong:rgba(186,255,0,.46);
  --glass:rgba(7,13,10,.78);--glass-strong:rgba(8,14,11,.94);--shadow:0 28px 90px rgba(0,0,0,.5);
  --radius:20px;--max:1400px;--header-h:74px;--font:'Cairo','Segoe UI',Tahoma,Arial,sans-serif;
}
html[data-theme="light"]{
  --bg:#f4f7f2;--bg-2:#eaf1e5;--surface:#ffffff;--surface-2:#eef4ea;--text:#121b15;--muted:#59665d;
  --line:rgba(63,93,21,.18);--line-strong:rgba(91,143,12,.48);--glass:rgba(255,255,255,.82);--glass-strong:rgba(255,255,255,.96);
  --shadow:0 25px 75px rgba(25,48,31,.13);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--bg);color-scheme:dark}
html[data-theme="light"]{color-scheme:light}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font);min-height:100vh;overflow-x:hidden;line-height:1.7}
body::before{content:"";position:fixed;inset:0;z-index:-5;pointer-events:none;background:
 radial-gradient(circle at 14% 12%,color-mix(in srgb,var(--accent) 10%,transparent),transparent 29%),
 radial-gradient(circle at 82% 42%,color-mix(in srgb,var(--accent) 7%,transparent),transparent 24%),
 linear-gradient(color-mix(in srgb,var(--accent) 3%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--accent) 3%,transparent) 1px,transparent 1px);background-size:auto,auto,66px 66px,66px 66px}
button,input,textarea,select{font:inherit;color:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}img{max-width:100%;display:block}h1,h2,h3,p{margin-top:0}.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
::selection{background:var(--accent);color:#071006}.container{width:min(calc(100% - 40px),var(--max));margin-inline:auto}.muted{color:var(--muted)}

.app-loader{min-height:100vh;display:grid;place-content:center;text-align:center;gap:8px}.app-loader span{width:52px;height:52px;border-radius:50%;border:2px solid var(--line);border-top-color:var(--accent);margin:auto;animation:spin .8s linear infinite}.app-loader strong{letter-spacing:.18em}.app-loader small{color:var(--muted)}@keyframes spin{to{transform:rotate(360deg)}}

.site-header{position:sticky;top:12px;z-index:100;margin:12px auto 0;width:min(calc(100% - 36px),var(--max));height:var(--header-h);display:flex;align-items:center;justify-content:space-between;padding:0 16px 0 12px;border:1px solid var(--line);border-radius:18px;background:var(--glass);backdrop-filter:blur(22px) saturate(140%);box-shadow:0 12px 50px rgba(0,0,0,.22)}
.brand{display:flex;align-items:center;gap:12px;min-width:185px}.brand img{width:var(--logo-size,48px);height:var(--logo-size,48px);object-fit:contain;filter:drop-shadow(0 0 16px color-mix(in srgb,var(--accent) 35%,transparent))}.brand-copy{display:grid;line-height:1}.brand-copy strong{font-size:18px;letter-spacing:.12em}.brand-copy small{font-size:9px;color:var(--accent);letter-spacing:.22em;margin-top:5px}.site-nav{display:flex;align-items:center;gap:28px;font-weight:700;font-size:14px}.site-nav a{color:var(--muted);position:relative;white-space:nowrap}.site-nav a:hover,.site-nav a.active{color:var(--text)}.site-nav a.active::after{content:"";position:absolute;right:50%;translate:50% 0;bottom:-15px;width:5px;height:5px;background:var(--accent);border-radius:50%;box-shadow:0 0 10px var(--accent)}
.header-actions{display:flex;align-items:center;gap:8px;min-width:260px;justify-content:flex-end}.icon-btn,.header-actions button{height:44px;min-width:44px;border-radius:12px;border:1px solid var(--line);background:color-mix(in srgb,var(--surface) 78%,transparent);display:grid;place-items:center}.icon-btn:hover{border-color:var(--line-strong);background:var(--surface-2)}.primary-btn,.secondary-btn,.ghost-btn{border:0;min-height:48px;padding:0 24px;border-radius:12px;font-weight:800;display:inline-flex;align-items:center;justify-content:center;gap:10px;transition:.25s ease}.primary-btn{background:linear-gradient(135deg,var(--accent),#8ed800);color:#071006;box-shadow:0 10px 34px color-mix(in srgb,var(--accent) 24%,transparent)}.primary-btn:hover{transform:translateY(-2px);box-shadow:0 15px 45px color-mix(in srgb,var(--accent) 34%,transparent)}.secondary-btn{background:color-mix(in srgb,var(--surface) 80%,transparent);border:1px solid color-mix(in srgb,var(--text) 20%,transparent);color:var(--text)}.secondary-btn:hover{border-color:var(--accent)}.ghost-btn{background:transparent;border:1px solid var(--line);color:var(--text)}.small-btn{min-height:38px;padding:0 15px;font-size:13px}.mobile-menu-btn{display:none}

.hero{min-height:790px;padding:52px 0 24px;position:relative;overflow:hidden}.hero::after{content:"";position:absolute;inset:0;z-index:-2;background:radial-gradient(ellipse at 28% 48%,color-mix(in srgb,var(--accent) 9%,transparent),transparent 42%)}.hero-grid{display:grid;grid-template-columns:minmax(480px,1fr) minmax(540px,.97fr);align-items:center;gap:24px;direction:ltr}.hero-copy{direction:rtl;position:relative;z-index:4;padding-right:24px}.eyebrow{display:flex;align-items:center;gap:10px;color:var(--accent);font-weight:800;font-size:14px;margin-bottom:20px}.eyebrow::before{content:"";width:7px;height:7px;background:var(--accent);box-shadow:0 0 14px var(--accent)}.hero h1{font-size:clamp(48px,4.4vw,78px);line-height:1.16;letter-spacing:-.045em;margin:0 0 18px;max-width:740px}.hero h1 span{display:block;color:var(--accent);text-shadow:0 0 30px color-mix(in srgb,var(--accent) 22%,transparent)}.hero-description{max-width:660px;color:var(--muted);font-size:17px;margin-bottom:28px}.hero-actions{display:flex;gap:12px;flex-wrap:wrap}.watch-link{margin-top:20px;display:inline-flex;align-items:center;gap:10px;color:var(--muted);font-weight:700}.play-dot{width:26px;height:26px;border-radius:50%;border:1px solid var(--accent);display:grid;place-items:center;color:var(--accent)}.hero-kpis{position:absolute;left:calc(100% + 18px);top:18px;display:grid;gap:10px}.hero-kpi{width:110px;padding:14px 10px;border:1px solid var(--line);border-radius:14px;background:var(--glass);text-align:center}.hero-kpi strong{display:block;color:var(--accent);font-size:24px;line-height:1.2}.hero-kpi small{color:var(--muted)}

.hero-visual{height:620px;position:relative;direction:ltr;isolation:isolate;--mx:50%;--my:45%;--rx:0deg;--ry:0deg;--effect-opacity:0}.hero-visual::before{content:"";position:absolute;inset:5% 4% 8% 2%;background:repeating-radial-gradient(ellipse at 45% 50%,transparent 0 19px,color-mix(in srgb,var(--accent) 16%,transparent) 20px 21px,transparent 22px 38px);opacity:.5;mask-image:linear-gradient(90deg,#000,transparent 83%);transform:perspective(900px) rotateY(var(--ry)) rotateX(var(--rx));transition:transform .12s ease-out}.visual-orbit{position:absolute;left:45%;top:51%;translate:-50% -50%;width:530px;height:530px;border:1px solid var(--line);border-radius:50%;box-shadow:inset 0 0 60px color-mix(in srgb,var(--accent) 4%,transparent),0 0 70px color-mix(in srgb,var(--accent) 6%,transparent)}.visual-orbit::before,.visual-orbit::after{content:"";position:absolute;border-radius:50%;border:1px dashed color-mix(in srgb,var(--accent) 25%,transparent);inset:54px;animation:orbit 20s linear infinite}.visual-orbit::after{inset:118px;animation-direction:reverse;animation-duration:13s}@keyframes orbit{to{transform:rotate(360deg)}}
.person-stage{position:absolute;inset:0;transform:perspective(900px) rotateY(var(--ry)) rotateX(var(--rx)) translate3d(calc((var(--mx) - 50%) * .035),calc((var(--my) - 50%) * .025),0);transform-origin:50% 65%;transition:transform .12s ease-out}.person-glow{position:absolute;left:9%;right:17%;bottom:5%;height:62%;border-radius:50%;background:radial-gradient(ellipse,color-mix(in srgb,var(--accent) 30%,transparent),transparent 68%);filter:blur(28px);opacity:.42}.person-base,.person-digital{position:absolute;left:7%;bottom:0;width:78%;height:98%;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 24px 50px rgba(0,0,0,.55))}.person-digital{z-index:3;filter:grayscale(1) contrast(1.8) brightness(.42) sepia(1) saturate(6) hue-rotate(36deg) drop-shadow(0 0 14px var(--accent));opacity:calc(var(--effect-opacity) * .42);mix-blend-mode:screen;mask-image:radial-gradient(circle 118px at var(--mx) var(--my),#000 0 60%,rgba(0,0,0,.85) 72%,transparent 100%);transition:opacity .25s ease}.person-wire{position:absolute;left:7%;bottom:0;width:78%;height:98%;z-index:5;opacity:var(--effect-opacity);mask-image:radial-gradient(circle 142px at var(--mx) var(--my),#000 0 55%,transparent 100%);filter:drop-shadow(0 0 8px var(--accent));pointer-events:none;transition:opacity .2s}.person-wire path,.person-wire ellipse,.person-wire line{fill:none;stroke:var(--accent);stroke-width:1.35;vector-effect:non-scaling-stroke;opacity:.8}.person-wire .fine{stroke-width:.55;opacity:.62}.person-wire circle{fill:var(--accent);filter:drop-shadow(0 0 3px var(--accent))}.scanner{position:absolute;z-index:8;width:190px;height:190px;left:var(--mx);top:var(--my);translate:-50% -50%;border-radius:50%;border:1px solid color-mix(in srgb,var(--accent) 65%,transparent);opacity:var(--effect-opacity);box-shadow:0 0 20px color-mix(in srgb,var(--accent) 24%,transparent),inset 0 0 24px color-mix(in srgb,var(--accent) 10%,transparent);pointer-events:none;transition:opacity .2s}.scanner::before{content:"";position:absolute;inset:12px;border-radius:50%;border:1px dashed color-mix(in srgb,var(--accent) 42%,transparent);animation:orbit 6s linear infinite}.scanner::after{content:"";position:absolute;left:50%;top:-14px;width:1px;height:218px;background:linear-gradient(transparent,var(--accent),transparent);box-shadow:0 0 11px var(--accent);animation:scanRotate 3.8s linear infinite;transform-origin:center 109px}@keyframes scanRotate{to{transform:rotate(360deg)}}
.particle-canvas{position:absolute;inset:0;z-index:7;width:100%;height:100%;pointer-events:none}.hud-core{position:absolute;left:15%;top:43%;z-index:10;width:70px;height:70px;border-radius:50%;border:1px solid var(--accent);display:grid;place-items:center;color:var(--accent);font-size:25px;font-weight:900;background:rgba(4,8,6,.72);box-shadow:0 0 28px color-mix(in srgb,var(--accent) 24%,transparent)}.hud-labels{position:absolute;left:0;top:22%;display:grid;gap:30px;z-index:9}.hud-label{font-size:10px;text-transform:uppercase;letter-spacing:.08em;border:1px solid var(--line-strong);border-radius:6px;padding:6px 13px;background:var(--glass);position:relative}.hud-label::after{content:"";position:absolute;left:100%;top:50%;width:88px;border-top:1px dashed color-mix(in srgb,var(--accent) 50%,transparent)}.hud-label::before{content:"";position:absolute;left:calc(100% + 88px);top:50%;translate:-50% -50%;width:7px;height:7px;border:1px solid var(--accent);border-radius:50%;background:var(--bg);box-shadow:0 0 8px var(--accent)}

.service-strip{position:relative;z-index:12;margin-top:-105px}.service-cards{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}.service-mini{min-height:132px;padding:20px;border:1px solid var(--line);border-radius:15px;background:linear-gradient(145deg,var(--glass-strong),color-mix(in srgb,var(--surface) 84%,transparent));backdrop-filter:blur(18px);position:relative;overflow:hidden;transition:.25s}.service-mini::after{content:"";position:absolute;inset:auto 0 0;height:2px;background:linear-gradient(90deg,transparent,var(--accent),transparent);opacity:.35}.service-mini:hover{translate:0 -6px;border-color:var(--line-strong);box-shadow:0 18px 44px rgba(0,0,0,.26)}.service-mini-icon{font-size:28px;color:var(--accent);margin-bottom:11px}.service-mini h3{font-size:15px;margin-bottom:4px}.service-mini p{font-size:12px;color:var(--muted);margin:0}.service-mini a{font-size:12px;color:var(--accent);font-weight:800;display:inline-block;margin-top:10px}

.stats-band{margin:18px auto 0;border:1px solid var(--line);border-radius:18px;background:linear-gradient(180deg,color-mix(in srgb,var(--accent) 5%,var(--glass)),var(--glass));display:grid;grid-template-columns:repeat(5,1fr);padding:24px 18px}.stat-item{text-align:center;position:relative}.stat-item:not(:last-child)::after{content:"";position:absolute;top:15%;bottom:15%;left:0;width:1px;background:color-mix(in srgb,var(--text) 13%,transparent)}.stat-item strong{display:block;color:var(--accent);font-size:25px}.stat-item span{color:var(--muted);font-size:13px}.stat-icon{font-size:24px;color:var(--accent)}

.section{position:relative;padding-block:var(--section-pad,84px)}.section[data-bg="surface"]{background:linear-gradient(180deg,transparent,color-mix(in srgb,var(--surface) 65%,transparent) 12%,color-mix(in srgb,var(--surface) 65%,transparent) 88%,transparent)}.section[data-bg="accent"]{background:linear-gradient(130deg,color-mix(in srgb,var(--accent) 13%,var(--surface)),var(--surface))}.section-head{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:32px}.section-head h2{font-size:clamp(31px,3vw,50px);line-height:1.25;margin-bottom:5px}.section-head p{color:var(--muted);max-width:650px;margin:0}.section-badge{font-size:12px;color:var(--accent);font-weight:800;display:flex;align-items:center;gap:8px}.section-badge::before{content:"";width:6px;height:6px;background:var(--accent)}
.services-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.service-card,.project-card,.why-card,.testimonial,.faq-item,.contact-card,.info-card{border:1px solid var(--line);border-radius:var(--radius);background:linear-gradient(145deg,var(--glass-strong),color-mix(in srgb,var(--surface-2) 76%,transparent));box-shadow:0 15px 50px rgba(0,0,0,.12)}.service-card{padding:22px;min-height:300px;position:relative;overflow:hidden;transition:.3s}.service-card:hover{transform:translateY(-7px);border-color:var(--line-strong)}.service-card-media{height:120px;border-radius:14px;overflow:hidden;background:var(--surface-2);margin-bottom:18px}.service-card-media img{width:100%;height:100%;object-fit:cover;opacity:.75;transition:.4s}.service-card:hover img{scale:1.08;opacity:1}.service-card h3{font-size:18px;margin-bottom:8px}.service-card p{font-size:13px;color:var(--muted)}.card-link{color:var(--accent);font-weight:800;font-size:13px}
.portfolio-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:22px}.tab-pill{border:1px solid var(--line);background:var(--surface);padding:9px 17px;border-radius:10px;color:var(--muted);font-weight:700}.tab-pill.active,.tab-pill:hover{color:#071006;background:var(--accent);border-color:var(--accent)}.projects-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}.project-card{min-height:340px;overflow:hidden;position:relative}.project-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.46;transition:.45s}.project-card::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 18%,rgba(2,7,4,.9) 88%)}.project-card:hover img{scale:1.06;opacity:.58}.project-content{position:absolute;z-index:2;right:24px;left:24px;bottom:22px}.project-content small{color:var(--accent);font-weight:800}.project-content h3{font-size:25px;margin:6px 0}.project-content p{color:#c5cec8;margin:0}.why-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:22px;align-items:stretch}.why-visual{min-height:510px;border:1px solid var(--line);border-radius:var(--radius);background:radial-gradient(circle at 50% 50%,color-mix(in srgb,var(--accent) 16%,transparent),transparent 38%),repeating-radial-gradient(circle at center,transparent 0 34px,var(--line) 35px 36px);display:grid;place-items:center;position:relative;overflow:hidden}.why-core{width:160px;height:160px;border-radius:50%;border:1px solid var(--accent);display:grid;place-items:center;text-align:center;background:var(--glass);box-shadow:0 0 70px color-mix(in srgb,var(--accent) 20%,transparent);font-weight:900;font-size:28px}.why-list{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.why-card{padding:24px}.why-card b{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:color-mix(in srgb,var(--accent) 12%,transparent);color:var(--accent);margin-bottom:17px}.why-card h3{margin-bottom:8px}.why-card p{color:var(--muted);font-size:13px;margin:0}.tools-cloud{display:flex;flex-wrap:wrap;justify-content:center;gap:12px}.tool-chip{padding:14px 22px;border:1px solid var(--line);border-radius:999px;background:var(--glass);font-weight:800;transition:.25s}.tool-chip:hover{border-color:var(--accent);color:var(--accent);transform:translateY(-3px)}.testimonials-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.testimonial{padding:24px}.stars{color:var(--accent);letter-spacing:3px;margin-bottom:14px}.testimonial blockquote{margin:0 0 20px;font-size:15px;color:var(--text)}.reviewer{display:flex;align-items:center;gap:12px}.avatar{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:color-mix(in srgb,var(--accent) 15%,var(--surface));color:var(--accent);font-weight:900}.reviewer small{display:block;color:var(--muted)}.faq-list{display:grid;gap:10px;max-width:1000px;margin:auto}.faq-item{overflow:hidden}.faq-question{width:100%;border:0;background:transparent;padding:20px 22px;text-align:right;display:flex;align-items:center;justify-content:space-between;font-weight:800}.faq-question span:last-child{color:var(--accent);font-size:22px}.faq-answer{max-height:0;overflow:hidden;color:var(--muted);padding:0 22px;transition:.32s ease}.faq-item.open .faq-answer{max-height:220px;padding-bottom:20px}.faq-item.open .faq-question span:last-child{transform:rotate(45deg)}
.consultation-grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:20px}.contact-card{padding:28px}.contact-card h3{font-size:26px}.contact-points{display:grid;gap:14px;margin:26px 0}.contact-point{display:flex;gap:14px}.contact-point b{width:42px;height:42px;border-radius:11px;background:color-mix(in srgb,var(--accent) 13%,transparent);color:var(--accent);display:grid;place-items:center}.contact-point span{color:var(--muted);font-size:13px;display:block}.form-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px}.field{display:grid;gap:7px}.field.full{grid-column:1/-1}.field label{font-size:13px;color:var(--muted);font-weight:700}.field input,.field textarea,.field select{width:100%;border:1px solid var(--line);background:color-mix(in srgb,var(--bg) 65%,transparent);border-radius:12px;padding:13px 14px;outline:none}.field input:focus,.field textarea:focus,.field select:focus{border-color:var(--accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 10%,transparent)}.field textarea{min-height:120px;resize:vertical}.form-message{padding:12px 14px;border-radius:10px;margin-top:12px;display:none}.form-message.show{display:block}.form-message.success{background:rgba(57,205,110,.12);border:1px solid rgba(57,205,110,.35)}.form-message.error{background:rgba(255,77,77,.12);border:1px solid rgba(255,77,77,.35)}.cta-panel{border:1px solid var(--line-strong);border-radius:28px;padding:50px;text-align:center;background:radial-gradient(circle at 50% 0,color-mix(in srgb,var(--accent) 18%,transparent),transparent 55%),var(--surface);box-shadow:0 25px 80px color-mix(in srgb,var(--accent) 7%,transparent)}.cta-panel h2{font-size:clamp(30px,3.4vw,54px);margin-bottom:10px}.cta-panel p{color:var(--muted);margin-bottom:24px}
.site-footer{border-top:1px solid var(--line);padding:48px 0 24px;background:color-mix(in srgb,var(--surface) 75%,transparent)}.footer-grid{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:35px}.footer-brand p{color:var(--muted);max-width:430px}.footer-col h4{color:var(--accent)}.footer-col a{display:block;color:var(--muted);margin:9px 0}.footer-bottom{margin-top:34px;padding-top:18px;border-top:1px solid var(--line);display:flex;justify-content:space-between;color:var(--muted);font-size:12px}.float-whatsapp{position:fixed;z-index:99;left:20px;bottom:20px;width:58px;height:58px;border-radius:50%;background:#20d366;color:#fff;display:grid;place-items:center;font-size:25px;font-weight:900;box-shadow:0 10px 32px rgba(32,211,102,.35);border:5px solid color-mix(in srgb,var(--bg) 70%,transparent)}

.page-hero{padding:100px 0 50px;text-align:center}.page-hero h1{font-size:clamp(42px,5vw,72px);line-height:1.2}.page-hero p{color:var(--muted);max-width:760px;margin:auto}.inner-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.info-card{padding:24px}.info-card h3{color:var(--accent)}.info-card p{color:var(--muted)}.price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.price-card{padding:28px;border:1px solid var(--line);border-radius:var(--radius);background:var(--glass)}.price-card.featured{border-color:var(--accent);box-shadow:0 0 50px color-mix(in srgb,var(--accent) 12%,transparent);transform:translateY(-10px)}.price{font-size:38px;color:var(--accent);font-weight:900}.feature-list{list-style:none;padding:0}.feature-list li{padding:9px 0;border-bottom:1px solid var(--line)}.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.blog-card{border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:var(--glass)}.blog-cover{height:180px;background:radial-gradient(circle,var(--accent),transparent 15%),repeating-linear-gradient(45deg,transparent 0 15px,var(--line) 16px 17px)}.blog-content{padding:22px}.blog-content p{color:var(--muted)}
.track-shell{max-width:1180px;margin:30px auto 80px;padding:0 20px}.track-search,.track-result{border:1px solid var(--line);border-radius:var(--radius);background:var(--glass);padding:28px}.track-search-grid{display:grid;grid-template-columns:1fr 1fr auto;gap:14px;align-items:end}.track-result{margin-top:20px}.tracking-head{display:grid;grid-template-columns:1.2fr repeat(3,1fr);gap:0;border:1px solid var(--line);border-radius:16px;overflow:hidden}.tracking-cell{padding:20px;border-left:1px solid var(--line)}.tracking-cell:last-child{border:0}.tracking-cell strong{display:block;color:var(--accent);font-size:22px}.tracking-cell span{color:var(--muted);font-size:12px}.timeline{display:grid;grid-template-columns:repeat(5,1fr);margin:36px 0 18px;position:relative}.timeline::before{content:"";position:absolute;top:20px;right:10%;left:10%;height:2px;background:var(--line)}.timeline-step{text-align:center;position:relative;z-index:2}.step-dot{width:42px;height:42px;border-radius:50%;border:2px solid var(--line-strong);background:var(--surface);display:grid;place-items:center;margin:0 auto 8px;font-weight:900}.timeline-step.done .step-dot,.timeline-step.active .step-dot{background:var(--accent);color:#061005;border-color:var(--accent);box-shadow:0 0 22px color-mix(in srgb,var(--accent) 35%,transparent)}.timeline-step small{display:block;color:var(--muted)}.track-details{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.track-detail{padding:18px;border:1px solid var(--line);border-radius:13px}.track-detail span{display:block;color:var(--muted);font-size:12px}.empty-state{text-align:center;padding:50px;color:var(--muted)}

/* Admin */
.admin-body{background:var(--bg);overflow-x:hidden}.login-shell{min-height:100vh;display:grid;place-items:center;padding:25px}.login-card{width:min(460px,100%);padding:34px;border:1px solid var(--line);border-radius:26px;background:var(--glass-strong);box-shadow:var(--shadow)}.login-logo{display:flex;align-items:center;gap:14px;margin-bottom:24px}.login-logo img{width:58px}.login-logo h1{font-size:24px;margin:0}.login-logo small{color:var(--accent)}.login-card .field{margin-bottom:13px}.login-note{font-size:12px;color:var(--muted);margin-top:16px;padding:12px;border:1px dashed var(--line);border-radius:10px}
.admin-shell{display:grid;grid-template-columns:280px 1fr;min-height:100vh}.admin-sidebar{position:fixed;right:0;top:0;bottom:0;width:280px;padding:20px 16px;border-left:1px solid var(--line);background:var(--glass-strong);backdrop-filter:blur(22px);z-index:60;display:flex;flex-direction:column}.admin-brand{display:flex;align-items:center;gap:12px;padding:4px 8px 22px;border-bottom:1px solid var(--line)}.admin-brand img{width:48px}.admin-brand strong{letter-spacing:.11em}.admin-brand small{display:block;color:var(--accent);font-size:9px}.admin-nav{display:grid;gap:4px;margin-top:18px;overflow:auto}.admin-nav button{border:0;background:transparent;color:var(--muted);border-radius:11px;padding:12px 14px;display:flex;align-items:center;gap:12px;text-align:right;font-weight:700}.admin-nav button:hover,.admin-nav button.active{background:color-mix(in srgb,var(--accent) 10%,transparent);color:var(--accent)}.admin-nav .nav-icon{width:24px;text-align:center}.admin-user{margin-top:auto;padding:15px;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between}.admin-avatar{width:42px;height:42px;border-radius:50%;background:linear-gradient(145deg,var(--accent),var(--accent-2));color:#061005;display:grid;place-items:center;font-weight:900}.admin-main{grid-column:2;padding:20px 24px 60px;min-width:0}.admin-topbar{height:66px;display:flex;align-items:center;justify-content:space-between;margin-bottom:24px}.admin-topbar h1{font-size:30px;margin:0}.admin-topbar p{color:var(--muted);margin:0;font-size:12px}.top-actions{display:flex;gap:8px}.dashboard-metrics{display:grid;grid-template-columns:repeat(6,1fr);gap:12px}.metric-card{padding:18px;border:1px solid var(--line);border-radius:16px;background:linear-gradient(145deg,var(--glass-strong),var(--surface));min-height:135px}.metric-card span{color:var(--muted);font-size:12px}.metric-card strong{display:block;color:var(--accent);font-size:30px;margin-top:8px}.sparkline{width:100%;height:32px;margin-top:8px}.dashboard-grid{display:grid;grid-template-columns:1.65fr .75fr;gap:14px;margin-top:14px}.panel{border:1px solid var(--line);border-radius:18px;background:var(--glass);padding:20px;min-width:0}.panel-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.panel-head h2,.panel-head h3{margin:0}.charts-row{display:grid;grid-template-columns:1.6fr .8fr;gap:14px}.chart-box{height:300px}.chart-canvas{width:100%;height:245px;display:block}.donut-wrap{display:grid;place-items:center;height:245px;position:relative}.donut{width:165px;height:165px;border-radius:50%;background:conic-gradient(var(--accent) 0 45%,var(--accent-2) 45% 73%,#4a5c4d 73% 100%);position:relative}.donut::after{content:"";position:absolute;inset:34px;border-radius:50%;background:var(--surface)}.donut-center{position:absolute;z-index:2;text-align:center}.donut-center strong{font-size:30px;display:block}.quick-actions{display:grid;gap:8px}.quick-actions button{border:1px solid var(--line);background:var(--surface);border-radius:10px;padding:12px;text-align:right}.quick-actions button:hover{border-color:var(--accent);color:var(--accent)}
.data-table-wrap{overflow:auto;border:1px solid var(--line);border-radius:15px}.data-table{width:100%;border-collapse:collapse;min-width:850px}.data-table th,.data-table td{padding:13px 14px;text-align:right;border-bottom:1px solid var(--line);font-size:13px}.data-table th{color:var(--muted);background:color-mix(in srgb,var(--surface) 85%,transparent);position:sticky;top:0}.data-table tbody tr:hover{background:color-mix(in srgb,var(--accent) 4%,transparent)}.status{display:inline-flex;padding:5px 10px;border-radius:999px;font-size:11px;font-weight:800;background:var(--surface-2);border:1px solid var(--line)}.status.received{color:#d9ff72}.status.review{color:#6eb6ff}.status.contacted{color:#d698ff}.status.in_progress{color:#ffd568}.status.completed{color:#63e98c}.status.cancelled{color:#ff7777}.table-actions{display:flex;gap:5px}.table-actions button{border:1px solid var(--line);background:var(--surface);border-radius:8px;padding:6px 9px}.toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:16px;flex-wrap:wrap}.toolbar-group{display:flex;gap:8px;flex-wrap:wrap}.search-input{min-width:280px;border:1px solid var(--line);background:var(--surface);border-radius:10px;padding:10px 13px}.modal-backdrop{position:fixed;inset:0;z-index:200;background:rgba(0,0,0,.7);display:grid;place-items:center;padding:20px}.modal{width:min(720px,100%);max-height:90vh;overflow:auto;border:1px solid var(--line);border-radius:22px;background:var(--glass-strong);box-shadow:var(--shadow);padding:24px}.modal-head{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);padding-bottom:14px;margin-bottom:16px}.modal-head h2{margin:0}.close-btn{border:1px solid var(--line);background:var(--surface);width:38px;height:38px;border-radius:10px}.form-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:18px}.collection-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.collection-card{border:1px solid var(--line);border-radius:16px;background:var(--glass);padding:16px}.collection-card img{height:120px;width:100%;object-fit:cover;border-radius:10px;margin-bottom:12px}.collection-card h3{font-size:16px;margin:0 0 7px}.collection-card p{font-size:12px;color:var(--muted);min-height:42px}.collection-actions{display:flex;gap:6px}.collection-actions button{flex:1;border:1px solid var(--line);background:var(--surface);border-radius:8px;padding:7px}.empty-panel{padding:60px;text-align:center;color:var(--muted)}

/* Site Builder */
.builder-page{position:fixed;inset:0;background:#050806;z-index:500;display:grid;grid-template-rows:64px 1fr;color:#edf4ee}.builder-top{display:flex;align-items:center;justify-content:space-between;padding:0 14px;border-bottom:1px solid #263128;background:#0b100d}.builder-brand{display:flex;align-items:center;gap:10px}.builder-brand img{width:36px}.builder-brand strong{letter-spacing:.1em}.builder-tools{display:flex;align-items:center;gap:6px}.builder-tools button,.builder-device button{height:38px;border:1px solid #28352c;border-radius:8px;background:#111813;color:#cbd6ce;padding:0 12px}.builder-tools button:hover,.builder-device button.active{border-color:var(--accent);color:var(--accent);background:#14200f}.builder-publish{background:var(--accent)!important;color:#061005!important;border-color:var(--accent)!important;font-weight:900}.builder-body{display:grid;grid-template-columns:280px minmax(440px,1fr) 330px;direction:ltr;min-height:0}.builder-nav,.builder-inspector{background:#0b100d;overflow:auto;direction:rtl}.builder-nav{border-right:1px solid #263128}.builder-inspector{border-left:1px solid #263128}.builder-pane-head{position:sticky;top:0;z-index:2;background:#0b100d;padding:15px;border-bottom:1px solid #263128}.builder-pane-head h3{margin:0;font-size:14px}.builder-pane-head small{color:#849087}.builder-tree{padding:12px}.tree-item{border:1px solid transparent;border-radius:9px;padding:9px 10px;margin-bottom:4px;display:flex;align-items:center;gap:8px;color:#aab6ad;cursor:pointer;user-select:none}.tree-item:hover{background:#111913}.tree-item.active{background:#14200f;border-color:#4c671f;color:var(--accent)}.tree-item.dragging{opacity:.4}.tree-handle{color:#657069;cursor:grab}.tree-toggle{margin-right:auto;width:30px;height:22px;border-radius:999px;border:1px solid #314035;background:#18201a;position:relative}.tree-toggle::after{content:"";position:absolute;width:14px;height:14px;border-radius:50%;top:3px;right:3px;background:#657069;transition:.2s}.tree-toggle.on{background:#283b13;border-color:#638c1d}.tree-toggle.on::after{right:11px;background:var(--accent)}.builder-canvas-area{background:#171c19;display:grid;grid-template-rows:44px 1fr;min-width:0}.canvas-bar{display:flex;align-items:center;justify-content:center;padding:6px;border-bottom:1px solid #28312b}.canvas-label{font-size:11px;color:#859087}.canvas-viewport{padding:20px;overflow:auto;display:flex;justify-content:center;align-items:flex-start}.preview-frame-wrap{height:100%;width:100%;background:white;box-shadow:0 20px 70px rgba(0,0,0,.5);transition:.3s;border-radius:8px;overflow:hidden}.preview-frame-wrap.tablet{width:768px}.preview-frame-wrap.mobile{width:390px}.preview-frame{width:100%;height:100%;border:0;background:white}.inspector-tabs{display:grid;grid-template-columns:repeat(3,1fr);border-bottom:1px solid #263128;position:sticky;top:73px;background:#0b100d;z-index:2}.inspector-tabs button{border:0;background:transparent;color:#8c9890;padding:12px 5px}.inspector-tabs button.active{color:var(--accent);box-shadow:inset 0 -2px var(--accent)}.inspector-content{padding:14px}.control-group{padding:12px 0;border-bottom:1px solid #222d25}.control-group h4{font-size:12px;margin:0 0 10px;color:#dce5de}.builder-field{display:grid;gap:6px;margin-bottom:11px}.builder-field label{font-size:11px;color:#8e9a91}.builder-field input,.builder-field textarea,.builder-field select{width:100%;border:1px solid #2c3930;background:#111813;color:#e9f0eb;border-radius:7px;padding:9px 10px;outline:none}.builder-field input:focus,.builder-field textarea:focus,.builder-field select:focus{border-color:var(--accent)}.builder-field textarea{min-height:82px;resize:vertical}.color-control{display:grid;grid-template-columns:42px 1fr;gap:7px}.color-control input[type=color]{padding:2px;height:40px}.range-row{display:grid;grid-template-columns:1fr 48px;gap:8px;align-items:center}.range-row input[type=range]{padding:0}.segment{display:grid;grid-template-columns:repeat(3,1fr);gap:4px}.segment button{border:1px solid #2d3931;background:#111813;color:#8d9990;border-radius:6px;padding:7px}.segment button.active{color:var(--accent);border-color:#5b791f}.media-current{height:128px;border:1px solid #2d3931;border-radius:9px;overflow:hidden;background:#131a15;margin-bottom:8px}.media-current img{width:100%;height:100%;object-fit:cover}.media-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;max-height:220px;overflow:auto}.media-thumb{aspect-ratio:1;border:1px solid #2e3932;border-radius:7px;overflow:hidden;padding:0;background:#131a15}.media-thumb img{width:100%;height:100%;object-fit:cover}.media-thumb.active{border-color:var(--accent);box-shadow:0 0 0 2px rgba(186,255,0,.2)}.upload-label{display:flex;align-items:center;justify-content:center;border:1px dashed #4c5a50;border-radius:8px;padding:10px;cursor:pointer;color:#aab5ad}.upload-label:hover{border-color:var(--accent);color:var(--accent)}.revision-item{border:1px solid #2b362e;border-radius:8px;padding:9px;margin-bottom:7px}.revision-item strong{display:block;font-size:11px}.revision-item small{color:#849087}.revision-item button{margin-top:7px;border:1px solid #3d4a40;border-radius:5px;background:#141c16;color:#c9d2cb;font-size:10px;padding:5px 8px}.builder-toast{position:fixed;left:50%;bottom:24px;translate:-50% 0;z-index:600;padding:11px 18px;border:1px solid #587e1c;background:#14200f;color:#ddfca6;border-radius:10px;box-shadow:0 14px 40px rgba(0,0,0,.5)}
.builder-section-outline{outline:2px dashed transparent;outline-offset:-4px;position:relative}.builder-preview-mode .builder-section-outline:hover{outline-color:rgba(186,255,0,.55)}.builder-preview-mode .builder-section-outline.selected{outline-color:var(--accent)}.builder-preview-mode .builder-section-outline.selected::before{content:attr(data-builder-label);position:absolute;z-index:1000;right:8px;top:8px;background:var(--accent);color:#071006;padding:3px 8px;border-radius:5px;font-size:10px;font-weight:900}

@media(max-width:1250px){.site-nav{gap:16px}.hero-grid{grid-template-columns:1fr 1fr}.hero-kpis{display:none}.service-cards{grid-template-columns:repeat(5,1fr)}.dashboard-metrics{grid-template-columns:repeat(3,1fr)}.builder-body{grid-template-columns:240px minmax(400px,1fr) 300px}}
@media(max-width:1024px){.site-nav{display:none}.mobile-menu-btn{display:grid}.header-actions{min-width:auto}.header-actions .primary-btn{display:none}.site-header.menu-open{height:auto;min-height:74px;align-items:flex-start;padding-top:13px;padding-bottom:13px;flex-wrap:wrap}.site-header.menu-open .site-nav{order:3;flex-basis:100%;display:grid;gap:4px;padding:10px 0}.site-header.menu-open .site-nav a{padding:10px}.hero{min-height:auto;padding-top:30px}.hero-grid{grid-template-columns:1fr;direction:rtl}.hero-copy{padding:20px 0 0;text-align:center}.eyebrow{justify-content:center}.hero h1{margin-inline:auto}.hero-description{margin-inline:auto}.hero-actions{justify-content:center}.hero-visual{height:550px;order:-1}.service-strip{margin-top:-25px}.service-cards{grid-template-columns:repeat(3,1fr)}.stats-band{grid-template-columns:repeat(3,1fr)}.stat-item:nth-child(3)::after{display:none}.services-grid{grid-template-columns:repeat(2,1fr)}.why-grid{grid-template-columns:1fr}.testimonials-grid{grid-template-columns:1fr 1fr}.footer-grid{grid-template-columns:1.4fr 1fr 1fr}.footer-col:last-child{grid-column:2}.consultation-grid{grid-template-columns:1fr}.price-grid,.blog-grid{grid-template-columns:1fr 1fr}.admin-shell{grid-template-columns:82px 1fr}.admin-sidebar{width:82px;padding:14px 8px}.admin-brand{justify-content:center}.admin-brand div,.admin-nav button span:not(.nav-icon),.admin-user>div:not(.admin-avatar){display:none}.admin-nav button{justify-content:center}.admin-main{grid-column:2}.dashboard-grid,.charts-row{grid-template-columns:1fr}.collection-grid{grid-template-columns:repeat(2,1fr)}.builder-body{grid-template-columns:220px 1fr}.builder-inspector{position:fixed;left:0;top:64px;bottom:0;width:330px;z-index:20;box-shadow:10px 0 40px rgba(0,0,0,.4)}.builder-canvas-area{grid-column:2}.builder-tools .hide-tablet{display:none}}
@media(max-width:768px){.container{width:min(calc(100% - 24px),var(--max))}.site-header{width:calc(100% - 20px);top:6px;margin-top:6px}.brand{min-width:auto}.brand-copy{display:none}.header-actions .icon-btn:nth-child(2){display:none}.hero h1{font-size:42px}.hero-description{font-size:14px}.hero-visual{height:480px}.visual-orbit{width:410px;height:410px}.person-base,.person-digital,.person-wire{left:5%;width:90%}.hud-labels{display:none}.hud-core{left:6%;top:48%;width:58px;height:58px}.service-cards{grid-template-columns:1fr 1fr}.service-mini{min-height:120px;padding:16px}.stats-band{grid-template-columns:1fr 1fr;padding:12px}.stat-item{padding:12px}.stat-item::after{display:none!important}.services-grid,.projects-grid,.why-list,.testimonials-grid,.inner-grid,.price-grid,.blog-grid{grid-template-columns:1fr}.section-head{display:block}.why-visual{min-height:380px}.tools-cloud{justify-content:flex-start}.form-grid{grid-template-columns:1fr}.field.full{grid-column:auto}.cta-panel{padding:34px 20px}.footer-grid{grid-template-columns:1fr 1fr}.footer-brand{grid-column:1/-1}.footer-col:last-child{grid-column:auto}.track-search-grid,.tracking-head,.track-details{grid-template-columns:1fr}.tracking-cell{border-left:0;border-bottom:1px solid var(--line)}.timeline{grid-template-columns:1fr;gap:14px}.timeline::before{top:0;bottom:0;right:20px;left:auto;width:2px;height:auto}.timeline-step{text-align:right;padding-right:58px;min-height:50px}.step-dot{position:absolute;right:0;margin:0}.admin-shell{display:block}.admin-sidebar{position:fixed;top:auto;bottom:0;left:0;right:0;width:100%;height:68px;display:block;padding:7px;z-index:100;border:0;border-top:1px solid var(--line)}.admin-brand,.admin-user{display:none}.admin-nav{display:flex;margin:0;overflow-x:auto}.admin-nav button{min-width:68px;padding:9px}.admin-nav button:nth-child(n+7){display:none}.admin-main{padding:12px 12px 88px}.admin-topbar h1{font-size:22px}.dashboard-metrics{grid-template-columns:1fr 1fr}.collection-grid{grid-template-columns:1fr}.builder-page{grid-template-rows:58px 1fr}.builder-top{overflow-x:auto}.builder-brand strong{display:none}.builder-body{display:block}.builder-nav{position:fixed;right:0;top:58px;bottom:0;width:230px;z-index:20;box-shadow:-10px 0 30px rgba(0,0,0,.4)}.builder-inspector{top:58px;width:290px}.builder-canvas-area{height:calc(100vh - 58px);margin:0 0 0 0}.canvas-viewport{padding:8px}.builder-tools button{padding:0 8px}.builder-tools .optional{display:none}}
@media(max-width:480px){.hero h1{font-size:34px}.hero-visual{height:410px}.visual-orbit{width:330px;height:330px}.service-cards{grid-template-columns:1fr}.service-mini{display:grid;grid-template-columns:40px 1fr;column-gap:10px;min-height:88px}.service-mini-icon{grid-row:1/4}.service-mini h3{margin:0}.stats-band{grid-template-columns:1fr 1fr}.stat-item strong{font-size:21px}.section{--section-pad:56px}.footer-grid{grid-template-columns:1fr}.footer-bottom{display:block}.dashboard-metrics{grid-template-columns:1fr}.metric-card{min-height:105px}.track-shell{padding:0 10px}.track-search,.track-result{padding:17px}.builder-nav{display:none}.builder-inspector{width:100%;display:none}.builder-canvas-area{width:100%}}

@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}.particle-canvas{display:none}}


/* WAHAJ 5.0 visual fixes */
.app-loader{position:fixed;inset:0;z-index:9999;min-height:100vh;background:var(--bg);display:flex;align-items:center;justify-content:center;flex-direction:column;gap:22px;overflow:hidden}.app-loader::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at center,color-mix(in srgb,var(--accent) 9%,transparent),transparent 34%),linear-gradient(color-mix(in srgb,var(--accent) 4%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--accent) 4%,transparent) 1px,transparent 1px);background-size:auto,70px 70px,70px 70px}.loader-word{position:relative;font-size:clamp(54px,10vw,150px);line-height:1;font-weight:950;letter-spacing:.16em;color:var(--text);text-shadow:0 0 45px color-mix(in srgb,var(--accent) 18%,transparent);animation:loaderBreath 1.8s ease-in-out infinite}.loader-scroll{position:relative;display:flex;align-items:center;gap:12px;color:var(--muted);letter-spacing:.2em;font-size:10px}.loader-scroll span{width:22px;height:38px;border:1px solid var(--line);border-radius:14px;position:relative}.loader-scroll span::after{content:"";position:absolute;left:50%;top:7px;width:3px;height:7px;border-radius:4px;background:var(--accent);transform:translateX(-50%);animation:scrollDot 1.4s infinite}.admin-loader small{position:relative;color:var(--accent);letter-spacing:.22em}@keyframes loaderBreath{50%{opacity:.45;filter:blur(.5px);transform:scale(.985)}}@keyframes scrollDot{0%{opacity:0;translate:0 0}30%{opacity:1}100%{opacity:0;translate:0 15px}}
.person-digital{display:none!important}.person-wire{mix-blend-mode:screen!important;filter:drop-shadow(0 0 4px color-mix(in srgb,var(--accent) 70%,transparent))!important}.person-wire line{fill:none;stroke:var(--accent);stroke-width:.72;vector-effect:non-scaling-stroke;opacity:.76}.person-wire .mesh-contour{fill:none;stroke:var(--accent);stroke-width:1.15;opacity:.95}.person-wire .mesh-feature{fill:none;stroke:color-mix(in srgb,var(--accent) 75%,white);stroke-width:.85;opacity:.9}.person-wire circle{fill:color-mix(in srgb,var(--accent) 70%,white);opacity:.95}.scanner{width:152px;height:190px;border-radius:46% 54% 48% 52%;border-color:color-mix(in srgb,var(--accent) 48%,transparent);box-shadow:0 0 18px color-mix(in srgb,var(--accent) 16%,transparent),inset 0 0 18px color-mix(in srgb,var(--accent) 7%,transparent)}.scanner::before{border-style:solid;opacity:.4}.hero-visual::after{opacity:calc(.06 + var(--hero-digital)*.22)!important}
html[data-theme="light"] .person-base{filter:drop-shadow(0 24px 45px rgba(32,47,36,.18))!important}html[data-theme="light"] .person-wire{mix-blend-mode:multiply!important;opacity:calc(var(--effect-opacity)*.55)!important;filter:none!important}html[data-theme="light"] .scanner{opacity:calc(var(--effect-opacity)*.5)!important}html[data-theme="light"] .particle-canvas{mix-blend-mode:multiply!important;opacity:.32!important}html[data-theme="light"] .hero-visual::after{display:none!important}html[data-theme="light"] .person-glow{opacity:.15!important}html[data-theme="light"] .project-card::after{background:linear-gradient(180deg,rgba(255,255,255,.02),rgba(19,31,22,.86) 90%)}html[data-theme="light"] .project-card img{opacity:.62}html[data-theme="light"] .project-content h3,html[data-theme="light"] .project-content p{color:white!important}
.why-process{display:grid;grid-template-columns:.9fr 1.1fr;gap:22px}.process-map{min-height:510px;border:1px solid var(--line);border-radius:var(--radius);position:relative;display:grid;place-items:center;background:radial-gradient(circle,color-mix(in srgb,var(--accent) 15%,transparent),transparent 34%),repeating-radial-gradient(circle,transparent 0 54px,color-mix(in srgb,var(--accent) 14%,transparent) 55px 56px);overflow:hidden}.process-center{width:210px;height:210px;border-radius:50%;border:1px solid color-mix(in srgb,var(--accent) 55%,transparent);background:var(--glass);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;box-shadow:0 0 60px color-mix(in srgb,var(--accent) 14%,transparent)}.process-center img{width:62px;height:62px;object-fit:contain;margin-bottom:10px}.process-center small{max-width:150px;color:var(--muted);font-size:10px;margin-top:6px}.process-map>i{--a:calc(var(--i)*90deg);position:absolute;left:50%;top:50%;translate:-50% -50%;transform:rotate(var(--a)) translateX(205px) rotate(calc(var(--a)*-1));font-style:normal;padding:9px 15px;border:1px solid var(--line);border-radius:999px;background:var(--surface);color:var(--accent);font-size:12px;font-weight:800}
@media(max-width:900px){.why-process{grid-template-columns:1fr}.process-map{min-height:400px;order:-1}.process-map>i{transform:rotate(var(--a)) translateX(150px) rotate(calc(var(--a)*-1))}}

.theme-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.theme-card{padding:16px;border:1px solid var(--line);border-radius:16px;background:var(--surface)}.theme-card.active{border-color:var(--accent);box-shadow:0 0 0 1px color-mix(in srgb,var(--accent) 28%,transparent)}.theme-preview{height:150px;border-radius:12px;background:radial-gradient(circle at 70% 30%,color-mix(in srgb,var(--accent) 25%,transparent),transparent 34%),#08100b;display:flex;align-items:center;justify-content:center;flex-direction:column;margin-bottom:14px}.theme-preview strong{font-size:24px}.theme-actions{display:flex;align-items:center;gap:8px;margin-top:14px}.plugin-list,.backup-list{display:grid;gap:10px}.plugin-row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:17px;border:1px solid var(--line);border-radius:13px;background:var(--surface)}.plugin-row h3,.plugin-row p{margin:0 0 5px}.compat-box,.role-help{margin-top:18px;padding:18px;border:1px dashed color-mix(in srgb,var(--accent) 42%,var(--line));border-radius:13px;background:color-mix(in srgb,var(--accent) 4%,var(--surface))}.compat-box code{display:block;direction:ltr;text-align:left;padding:12px;background:#050806;border-radius:9px;color:#baff00;overflow:auto}.switch-row{display:flex;gap:9px;align-items:center;padding:12px;border:1px solid var(--line);border-radius:10px}.modal-card{max-height:90vh;overflow:auto}@media(max-width:900px){.theme-grid{grid-template-columns:1fr}.plugin-row{align-items:flex-start;flex-direction:column}}


/* WAHAJ CMS 6.0 */
.admin-nav-group{display:grid;gap:4px;margin-bottom:12px}.admin-nav-group>small{padding:8px 14px 4px;color:var(--muted);font-size:10px;font-weight:800;letter-spacing:.08em}.admin-nav{overflow:auto;padding-bottom:16px}.block{display:block}.toolbar.compact{margin:14px 0}.editor-textarea{min-height:260px!important;line-height:1.9}.modal-wide{width:min(980px,94vw)}.media-inline{display:inline-flex;margin-top:8px}.media-modal-preview,.editor-image-preview{width:100%;height:220px;object-fit:cover;border-radius:12px;margin-bottom:12px}.media-input-row{display:flex;gap:8px}.media-input-row input{flex:1}.menu-editor{display:grid;gap:10px;margin-top:18px}.menu-item-row{display:grid;grid-template-columns:32px 1fr 1.2fr 140px 90px 38px 38px 60px;gap:8px;align-items:center;padding:10px;border:1px solid var(--line);border-radius:12px;background:var(--surface)}.menu-item-row input,.menu-item-row select{min-width:0}.drag-handle{color:var(--accent);font-weight:900}.tabs{display:flex;gap:8px;margin-top:14px}.tabs button,.settings-tabs button{border:1px solid var(--line);background:var(--surface);color:var(--text);padding:10px 14px;border-radius:10px}.tabs button.active,.settings-tabs button.active{border-color:var(--accent);color:var(--accent);background:color-mix(in srgb,var(--accent) 8%,var(--surface))}.update-core{display:flex;justify-content:space-between;align-items:center;padding:18px;border:1px solid var(--line);border-radius:14px;margin:15px 0;background:var(--surface)}.health-summary{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:14px}.health-list{display:grid;gap:10px}.health-row{display:grid;grid-template-columns:16px 1fr auto;align-items:center;gap:12px;padding:14px;border:1px solid var(--line);border-radius:12px;background:var(--surface)}.health-row h3,.health-row p{margin:0}.health-dot{width:10px;height:10px;border-radius:50%;background:#879087}.health-row.good .health-dot{background:#69d56f;box-shadow:0 0 12px #69d56f}.health-row.recommended .health-dot{background:#e2b64a}.health-row.critical .health-dot{background:#e15757}.status.good{color:#69d56f}.status.recommended{color:#e2b64a}.status.critical{color:#e15757}.tools-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.tools-grid .panel{min-height:260px}.quick-actions a{display:block;padding:12px;border:1px solid var(--line);border-radius:10px;color:var(--text);text-decoration:none}.activity-list{display:grid;gap:10px}.activity-row{display:grid;grid-template-columns:44px 1fr;gap:12px;padding:14px;border-bottom:1px solid var(--line)}.activity-row h3,.activity-row p{margin:0 0 4px}.activity-icon{width:40px;height:40px;border-radius:10px;display:grid;place-items:center;background:color-mix(in srgb,var(--accent) 10%,var(--surface));color:var(--accent)}.activity-mini{padding:10px 0;border-bottom:1px solid var(--line)}.activity-mini small{display:block;color:var(--muted)}.settings-layout{display:grid;grid-template-columns:190px 1fr;gap:24px}.settings-tabs{display:grid;align-content:start;gap:7px}.settings-tabs button{text-align:right}.settings-form h2{margin-top:0}.warning-box{padding:14px;border:1px solid #9a7832;border-radius:12px;background:rgba(226,182,74,.08);margin:14px 0}.article-page{max-width:950px}.article-cover{width:100%;max-height:520px;object-fit:cover;border-radius:calc(var(--radius) - 4px);margin-bottom:22px}.article-meta{color:var(--accent);font-size:13px;margin-bottom:18px}.article-body{font-size:18px;line-height:2}.article-body p{margin-bottom:18px}.comments-section .container{max-width:950px}.comments-list{display:grid;gap:10px;margin:18px 0}.comment-card{padding:16px;border:1px solid var(--line);border-radius:12px;background:var(--surface)}.comment-card small{display:block;color:var(--muted);margin:3px 0 10px}.comment-card p{margin:0}.maintenance-page{min-height:100vh;display:grid;place-items:center;text-align:center;padding:30px}.maintenance-page strong{font-size:clamp(60px,12vw,160px);letter-spacing:.18em;color:var(--accent)}.maintenance-page h1{font-size:42px;margin:20px 0 8px}.blog-cover{background-size:cover;background-position:center}.blog-cover[style*="background-image"]{min-height:220px}.status.published{color:#69d56f}.status.draft{color:#aab2ab}.status.scheduled{color:#e2b64a}.status.trash,.status.spam{color:#e15757}
@media(max-width:1100px){.menu-item-row{grid-template-columns:30px 1fr 1fr 110px}.menu-item-row>*:nth-child(n+5){grid-column:auto}.health-summary{grid-template-columns:repeat(2,1fr)}.tools-grid{grid-template-columns:1fr}.settings-layout{grid-template-columns:1fr}.settings-tabs{display:flex;overflow:auto}}
@media(max-width:768px){.menu-item-row{grid-template-columns:1fr 1fr}.drag-handle{display:none}.health-summary{grid-template-columns:1fr 1fr}.health-row{grid-template-columns:14px 1fr}.health-row>.status{grid-column:2}.admin-nav-group>small{display:none}.modal-wide{width:96vw}.article-body{font-size:16px}}


/* WAHAJ CMS 6.1 — stable splash, branding and hero fixes */
.wahaj-splash{position:fixed;inset:0;z-index:10000;display:grid;place-items:center;background:
 radial-gradient(circle at 50% 42%,color-mix(in srgb,var(--accent) 9%,transparent),transparent 34%),var(--bg);overflow:hidden;pointer-events:auto}
.wahaj-splash::before,.wahaj-splash::after{content:"";position:absolute;inset:0;pointer-events:none}
.wahaj-splash::before{background:linear-gradient(color-mix(in srgb,var(--accent) 4%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--accent) 4%,transparent) 1px,transparent 1px);background-size:64px 64px;mask-image:radial-gradient(circle,#000,transparent 70%)}
.wahaj-splash::after{inset:auto 0 0;height:1px;background:linear-gradient(90deg,transparent,var(--accent),transparent);box-shadow:0 0 24px var(--accent)}
.wahaj-splash__content{position:relative;display:grid;justify-items:center;gap:18px;text-align:center;direction:rtl}
.wahaj-splash__word{font-family:var(--font);font-size:clamp(68px,12vw,190px);font-weight:900;line-height:.88;letter-spacing:.06em;color:var(--text);text-shadow:0 0 55px color-mix(in srgb,var(--accent) 18%,transparent)}
.wahaj-splash__line{width:min(330px,54vw);height:2px;border-radius:99px;background:color-mix(in srgb,var(--text) 9%,transparent);overflow:hidden}
.wahaj-splash__line::after{content:"";display:block;width:100%;height:100%;background:var(--accent);transform-origin:right;animation:wahajSplashLine 1.1s cubic-bezier(.16,1,.3,1) both}
.wahaj-splash__scroll{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:12px;font-weight:700;letter-spacing:.02em}
.wahaj-splash__mouse{width:25px;height:40px;border:1px solid color-mix(in srgb,var(--text) 28%,transparent);border-radius:16px;position:relative;display:block}
.wahaj-splash__mouse i{position:absolute;left:50%;top:7px;width:3px;height:8px;border-radius:4px;background:var(--accent);translate:-50% 0;animation:wahajScrollCue 1.35s ease-in-out infinite}
body.is-loading{overflow:hidden}
html[data-preview="1"] .wahaj-splash{display:none!important}
html[data-preview="1"] body{overflow:auto!important}
@keyframes wahajSplashLine{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes wahajScrollCue{0%{opacity:0;translate:-50% 0}28%{opacity:1}100%{opacity:0;translate:-50% 16px}}

.brand{min-width:0;max-width:310px}.brand img{flex:0 0 auto}.brand-copy{min-width:0}.brand-copy strong{max-width:190px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;letter-spacing:.045em}.brand-copy small{max-width:190px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.person-base{opacity:1!important;visibility:visible!important;filter:drop-shadow(0 24px 50px rgba(0,0,0,.55));transform:translateZ(0)}
.person-wire{stroke-linecap:round;stroke-linejoin:round}.person-wire line{stroke-width:.48!important;opacity:.56!important}.person-wire .mesh-contour{stroke-width:.82!important;opacity:.88!important}.person-wire .mesh-feature{stroke-width:.62!important;opacity:.82!important}.person-wire circle{opacity:.72!important}
.hero-visual[data-pointer-active="false"] .person-wire,.hero-visual:not([data-pointer-active="true"]) .person-wire{opacity:0!important}
.hero-visual[data-pointer-active="false"] .scanner,.hero-visual:not([data-pointer-active="true"]) .scanner{opacity:0!important}
.hero-visual[data-pointer-active="false"] .face-data-trails,.hero-visual:not([data-pointer-active="true"]) .face-data-trails{opacity:0!important}
html[data-theme="light"] .person-base{opacity:1!important;filter:drop-shadow(0 24px 38px rgba(31,48,36,.16))!important}
html[data-theme="light"] .person-wire{mix-blend-mode:multiply!important;filter:none!important}
html[data-theme="light"] .particle-canvas{opacity:.2!important}
html[data-theme="light"] .hero-visual::after{opacity:.08!important;mix-blend-mode:multiply!important}

.builder-preview-mode [data-motion-type],.builder-preview-mode .hero-copy,.builder-preview-mode .hero-visual,.builder-preview-mode .service-mini,.builder-preview-mode .service-card,.builder-preview-mode .project-card,.builder-preview-mode .why-card,.builder-preview-mode .testimonial,.builder-preview-mode .stat-item,.builder-preview-mode .tool-chip{opacity:1!important;transform:none!important;visibility:visible!important}
.builder-preview-mode .wahaj-splash,.builder-preview-mode .motion-preload{display:none!important}
.builder-preview-mode .hero{min-height:auto}
.builder-preview-mode .person-base{opacity:1!important}
.builder-preview-mode .hero-copy .motion-line>span{transform:none!important}

.font-preview{padding:12px;border:1px solid var(--line);border-radius:10px;background:var(--surface);font-size:19px;font-weight:700;text-align:center}
.identity-preview{display:flex;align-items:center;gap:12px;padding:12px;border:1px solid var(--line);border-radius:12px;background:var(--surface)}
.identity-preview img{width:54px;height:54px;object-fit:contain}.identity-preview strong,.identity-preview small{display:block}.identity-preview small{color:var(--accent)}
@media(max-width:780px){.wahaj-splash__word{font-size:clamp(58px,20vw,110px)}.brand-copy strong,.brand-copy small{max-width:105px}.brand{gap:7px}.brand img{width:42px;height:42px}}
.hero-visual:not([data-pointer-active="true"]) .particle-canvas{opacity:0!important}
.hero-visual[data-pointer-active="true"] .particle-canvas{opacity:.42!important}
html[data-theme="light"] .hero-visual[data-pointer-active="true"] .particle-canvas{opacity:.18!important}
.wahaj-splash{transition:transform .82s cubic-bezier(.76,0,.24,1),opacity .55s ease;will-change:transform,opacity}
.wahaj-splash.is-leaving{transform:translateY(-100%);opacity:.98;pointer-events:none}
/* WAHAJ 6.1.1 — scroll-led splash refinements */
.wahaj-splash__scroll{appearance:none;background:transparent;border:0;padding:5px 8px;margin:0;font-family:inherit;cursor:pointer;transition:color .25s ease,transform .25s ease}
.wahaj-splash__scroll:hover,.wahaj-splash__scroll:focus-visible{color:var(--text);transform:translateY(2px);outline:none}
.wahaj-splash:not(.is-ready) .wahaj-splash__scroll{opacity:.55;pointer-events:none}
.wahaj-splash.is-ready .wahaj-splash__scroll{animation:wahajCueReady .55s ease both}
@keyframes wahajCueReady{from{opacity:.25;transform:translateY(-6px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.wahaj-splash,.wahaj-splash__scroll,.wahaj-splash__mouse i{animation:none!important;transition-duration:.01ms!important}}
/* Make the first face hover frame deterministic across real GSAP and offline fallback. */
.hero-visual[data-pointer-active="true"] .person-wire{opacity:.82!important}
.hero-visual[data-pointer-active="true"] .scanner{opacity:.72!important}
html[data-theme="light"] .hero-visual[data-pointer-active="true"] .person-wire{opacity:.46!important}
html[data-theme="light"] .hero-visual[data-pointer-active="true"] .scanner{opacity:.34!important}

/* WAHAJ CMS 6.3 — segmented cinematic identity assembly
   The white portrait never fades. Only real costume fragments assemble around it. */
.hero-visual{
  --assembly-progress:0;
  --pointer-x:45%;
  --pointer-y:43%;
  --spot-size:150px;
  height:660px;
  border-radius:34px;
  background:
    radial-gradient(circle at 44% 43%,rgba(186,255,0,.09),transparent 34%),
    radial-gradient(ellipse at 44% 60%,rgba(0,0,0,.2),transparent 67%);
  cursor:default;
}
.hero-visual::after{
  content:"";
  position:absolute;
  z-index:1;
  inset:7% 3% 3%;
  pointer-events:none;
  background:radial-gradient(circle var(--spot-size) at var(--pointer-x) var(--pointer-y),rgba(186,255,0,.14),rgba(186,255,0,.035) 42%,transparent 73%);
  opacity:calc(.04 + var(--assembly-progress)*.72);
  mix-blend-mode:screen;
}
.person-stage{
  position:absolute;
  inset:0;
  perspective:1200px;
  transform-style:preserve-3d;
  pointer-events:none;
}
.portrait-surface{
  position:absolute;
  z-index:2;
  width:min(620px,100%);
  height:min(620px,100%);
  left:44.5%;
  top:50%;
  translate:-50% -50%;
  transform-style:preserve-3d;
  transform-origin:50% 56%;
  will-change:transform;
  isolation:isolate;
  overflow:visible;
  border-radius:46% 46% 24% 24%/42% 42% 18% 18%;
  background:radial-gradient(ellipse at 50% 54%,#060a08 0 42%,rgba(2,4,3,.95) 64%,transparent 77%);
}
.portrait-surface::before{
  content:"";
  position:absolute;
  z-index:0;
  inset:6% 5% 0;
  border-radius:48%;
  pointer-events:none;
  background:radial-gradient(ellipse at 50% 46%,rgba(186,255,0,.13),rgba(8,14,11,.16) 45%,transparent 73%);
  filter:blur(22px);
  opacity:calc(.24 + var(--assembly-progress)*.42);
}
.hero-portrait,.assembly-image-piece img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
  user-select:none;
  pointer-events:none;
  -webkit-user-drag:none;
}
.person-base{
  z-index:3!important;
  left:0!important;
  bottom:auto!important;
  width:100%!important;
  height:100%!important;
  opacity:1!important;
  visibility:visible!important;
  filter:drop-shadow(0 30px 50px rgba(0,0,0,.62))!important;
  transform:scale(1.018);
  transform-origin:50% 55%;
}
.assembly-layer{
  position:absolute;
  inset:0;
  pointer-events:none;
  transform-style:preserve-3d;
}
.assembly-layer--back{z-index:2}
.assembly-layer--front{z-index:6}
.assembly-piece{
  position:absolute;
  pointer-events:none;
  opacity:0;
  transform-style:preserve-3d;
  backface-visibility:hidden;
  -webkit-backface-visibility:hidden;
  will-change:transform,opacity,filter;
}
.assembly-image-piece{inset:0}
.assembly-image-piece img{
  filter:drop-shadow(0 16px 26px rgba(0,0,0,.6)) drop-shadow(0 0 8px rgba(186,255,0,.08));
  transform:scale(1.018);
  transform-origin:50% 55%;
}
.assembly-layer--back .assembly-image-piece img{filter:drop-shadow(0 14px 24px rgba(0,0,0,.66))}
.piece-torso-left img,.piece-torso-right img{transform:translateY(-20px) scale(1.018);transform-origin:50% 55%}
.piece-chest-center img{transform:translateY(-16px) scale(1.018);transform-origin:50% 55%}
.assembly-css-piece{z-index:4}
.costume-underlay{
  left:-1%;
  right:-1%;
  top:67.4%;
  bottom:-5%;
  clip-path:polygon(0 35%,16% 14%,33% 4%,43% 1%,50% 7%,57% 1%,67% 4%,84% 14%,100% 35%,100% 100%,0 100%);
  background:
    linear-gradient(90deg,rgba(181,128,65,.28),transparent 2% 98%,rgba(181,128,65,.28)),
    linear-gradient(145deg,#111514,#070908 70%);
  box-shadow:0 -1px 0 rgba(193,143,78,.48),0 18px 35px rgba(0,0,0,.5);
}
.costume-underlay::after{
  content:"";
  position:absolute;
  left:34.5%;
  top:-10.2%;
  width:31%;
  height:22%;
  background:linear-gradient(180deg,#171918 0%,#0b0d0c 72%);
  border-top:1px solid rgba(212,159,88,.55);
  border-left:1px solid rgba(212,159,88,.22);
  border-right:1px solid rgba(212,159,88,.22);
  border-radius:26px 26px 12px 12px;
  clip-path:polygon(18% 100%,6% 32%,28% 0,72% 0,94% 32%,82% 100%,50% 86%);
  box-shadow:0 8px 16px rgba(0,0,0,.38),0 0 0 1px rgba(12,14,13,.32) inset;
}
.collar-shell{
  z-index:5;
  left:31.5%;
  top:60.2%;
  width:37%;
  height:17.5%;
  clip-path:polygon(10% 5%,38% 19%,50% 27%,62% 19%,90% 5%,100% 73%,86% 100%,14% 100%,0 73%);
  background:linear-gradient(145deg,#171918,#090b0a 72%);
  box-shadow:inset 0 0 0 1px rgba(190,139,75,.5),0 10px 22px rgba(0,0,0,.45);
}
.collar-shell::before{
  content:"";
  position:absolute;
  inset:2px;
  clip-path:inherit;
  border-top:1px solid rgba(212,159,88,.72);
  opacity:.8;
}
.collar-shell i{
  position:absolute;
  left:50%;
  top:29%;
  width:1px;
  height:71%;
  background:linear-gradient(rgba(204,151,83,.85),rgba(204,151,83,.28));
  box-shadow:0 0 8px rgba(186,255,0,.08);
}
.visor-assembly{
  position:absolute;
  z-index:9;
  inset:0;
  pointer-events:none;
  transform-style:preserve-3d;
}
.visor-piece{filter:drop-shadow(0 8px 12px rgba(0,0,0,.5)) drop-shadow(0 0 7px rgba(186,255,0,.12))}
.visor-lens{
  top:31.2%;
  width:20.4%;
  height:11.7%;
  background:
    linear-gradient(115deg,rgba(186,255,0,.09),transparent 36%),
    linear-gradient(180deg,rgba(25,29,26,.94),rgba(4,8,6,.82));
  border:1px solid rgba(190,139,77,.82);
  box-shadow:inset 0 0 0 2px rgba(0,0,0,.48),inset 0 -12px 24px rgba(0,0,0,.24);
  overflow:hidden;
}
.visor-lens::before{
  content:"";
  position:absolute;
  inset:8% 7%;
  border:1px solid rgba(186,255,0,.08);
  clip-path:inherit;
}
.visor-lens i{
  position:absolute;
  left:9%;
  right:9%;
  top:16%;
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(186,255,0,.62),transparent);
  opacity:.65;
}
.visor-lens--left{
  left:29.1%;
  clip-path:polygon(4% 9%,86% 4%,100% 35%,87% 94%,12% 88%,0 35%);
}
.visor-lens--right{
  left:51%;
  clip-path:polygon(14% 4%,96% 9%,100% 35%,88% 88%,13% 94%,0 35%);
}
.visor-bridge{
  z-index:2;
  left:46.8%;
  top:32.8%;
  width:8.4%;
  height:8.5%;
  clip-path:polygon(0 0,28% 0,50% 28%,72% 0,100% 0,74% 52%,58% 46%,50% 100%,42% 46%,26% 52%);
  background:linear-gradient(145deg,#292b29,#0a0c0b 75%);
  border-top:1px solid rgba(190,139,77,.8);
}
.visor-arm{
  top:32.1%;
  width:8.5%;
  height:8%;
  background:linear-gradient(180deg,#242625,#090b0a);
  border-top:1px solid rgba(190,139,77,.72);
}
.visor-arm--left{left:22.8%;clip-path:polygon(0 20%,100% 0,100% 75%,12% 100%)}
.visor-arm--right{left:70.1%;clip-path:polygon(0 0,100% 20%,88% 100%,0 75%)}

/* Fallback transforms are also the design source for the GSAP timeline. */
.piece-ghutra-left-lower{--fx:-180px;--fy:82px;--fz:-190px;--frx:8deg;--fry:-58deg;--frz:-16deg;--fs:1.08;--fd:.00s}
.piece-ghutra-right-lower{--fx:180px;--fy:82px;--fz:-190px;--frx:8deg;--fry:58deg;--frz:16deg;--fs:1.08;--fd:.00s}
.piece-ghutra-left-upper{--fx:-145px;--fy:-30px;--fz:-105px;--frx:-12deg;--fry:-52deg;--frz:-13deg;--fs:1.07;--fd:.43s}
.piece-ghutra-right-upper{--fx:145px;--fy:-30px;--fz:-105px;--frx:-12deg;--fry:52deg;--frz:13deg;--fs:1.07;--fd:.43s}
.piece-torso-left{--fx:-145px;--fy:145px;--fz:85px;--frx:24deg;--fry:-34deg;--frz:-9deg;--fs:1.08;--fd:.00s}
.piece-torso-right{--fx:145px;--fy:145px;--fz:85px;--frx:24deg;--fry:34deg;--frz:9deg;--fs:1.08;--fd:.00s}
.piece-chest-center{--fx:0px;--fy:180px;--fz:120px;--frx:32deg;--fry:0deg;--frz:0deg;--fs:1.1;--fd:.06s}
.piece-collar-left{--fx:-80px;--fy:78px;--fz:150px;--frx:15deg;--fry:-48deg;--frz:-8deg;--fs:1.08;--fd:.16s}
.piece-collar-right{--fx:80px;--fy:78px;--fz:150px;--frx:15deg;--fry:48deg;--frz:8deg;--fs:1.08;--fd:.16s}
.piece-crown-left{--fx:-90px;--fy:-150px;--fz:130px;--frx:-62deg;--fry:-28deg;--frz:-10deg;--fs:1.1;--fd:.60s}
.piece-crown-right{--fx:90px;--fy:-150px;--fz:130px;--frx:-62deg;--fry:28deg;--frz:10deg;--fs:1.1;--fd:.60s}
.piece-visor-left-image{--fx:-160px;--fy:-8px;--fz:230px;--frx:-8deg;--fry:-76deg;--frz:-9deg;--fs:1.12;--fd:.70s}
.piece-visor-right-image{--fx:160px;--fy:-8px;--fz:230px;--frx:-8deg;--fry:76deg;--frz:9deg;--fs:1.12;--fd:.70s}
.piece-visor-bridge-image{--fx:0px;--fy:-72px;--fz:265px;--frx:-60deg;--fry:0deg;--frz:0deg;--fs:.7;--fd:.80s}
.piece-agal-left{--fx:-115px;--fy:-178px;--fz:180px;--frx:-70deg;--fry:-42deg;--frz:-16deg;--fs:1.12;--fd:.84s}
.piece-agal-right{--fx:115px;--fy:-178px;--fz:180px;--frx:-70deg;--fry:42deg;--frz:16deg;--fs:1.12;--fd:.84s}
.piece-agal-center{--fx:0px;--fy:-205px;--fz:210px;--frx:-78deg;--fry:0deg;--frz:0deg;--fs:1.15;--fd:.96s}
.costume-underlay{--fx:0px;--fy:180px;--fz:60px;--frx:30deg;--fry:0deg;--frz:0deg;--fs:1.08;--fd:0s}
.collar-shell{--fx:0px;--fy:105px;--fz:145px;--frx:25deg;--fry:0deg;--frz:0deg;--fs:1.09;--fd:.12s}
.visor-lens--left{--fx:-150px;--fy:-8px;--fz:210px;--frx:-6deg;--fry:-72deg;--frz:-8deg;--fs:1.12;--fd:.32s}
.visor-lens--right{--fx:150px;--fy:-8px;--fz:210px;--frx:-6deg;--fry:72deg;--frz:8deg;--fs:1.12;--fd:.32s}
.visor-bridge{--fx:0px;--fy:-64px;--fz:250px;--frx:-55deg;--fry:0deg;--frz:0deg;--fs:.72;--fd:.44s}
.visor-arm--left{--fx:-112px;--fy:-2px;--fz:160px;--frx:0deg;--fry:-68deg;--frz:-6deg;--fs:1.08;--fd:.38s}
.visor-arm--right{--fx:112px;--fy:-2px;--fz:160px;--frx:0deg;--fry:68deg;--frz:6deg;--fs:1.08;--fd:.38s}

.hero-visual:not([data-pointer-active="true"]) .assembly-piece{
  transform:translate3d(var(--fx),var(--fy),var(--fz)) rotateX(var(--frx)) rotateY(var(--fry)) rotateZ(var(--frz)) scale(var(--fs));
  opacity:0;
}
.hero-visual[data-pointer-active="true"] .assembly-piece{
  transform:translate3d(0,0,0) rotateX(0) rotateY(0) rotateZ(0) scale(1);
  opacity:1;
  transition:
    transform .82s cubic-bezier(.16,1,.3,1) var(--fd,0s),
    opacity .22s ease var(--fd,0s),
    filter .35s ease;
}
.assembly-sweep{
  position:absolute;
  z-index:11;
  top:10%;
  bottom:6%;
  left:50%;
  width:2px;
  opacity:0;
  pointer-events:none;
  background:linear-gradient(transparent,var(--accent) 11% 89%,transparent);
  box-shadow:0 0 8px var(--accent),0 0 30px rgba(186,255,0,.45),-34px 0 46px rgba(186,255,0,.08);
}
.assembly-sweep i{
  position:absolute;
  top:0;
  bottom:0;
  left:-38px;
  width:76px;
  background:linear-gradient(90deg,transparent,rgba(186,255,0,.09),transparent);
  filter:blur(6px);
}
.assembly-hud{
  position:absolute;
  z-index:12;
  left:27%;
  top:29%;
  width:46%;
  height:18%;
  pointer-events:none;
}
.assembly-hud span{position:absolute;width:25px;height:25px;border-color:var(--accent);border-style:solid;opacity:0;filter:drop-shadow(0 0 6px var(--accent))}
.assembly-hud span:nth-child(1){left:0;top:0;border-width:1px 0 0 1px}.assembly-hud span:nth-child(2){right:0;top:0;border-width:1px 1px 0 0}.assembly-hud span:nth-child(3){left:0;bottom:0;border-width:0 0 1px 1px}.assembly-hud span:nth-child(4){right:0;bottom:0;border-width:0 1px 1px 0}
.assembly-sparks{position:absolute;z-index:13;inset:0;pointer-events:none}
.assembly-sparks i{
  --sx:calc(22% + (var(--spark) % 5)*13%);
  position:absolute;
  left:var(--sx);
  top:calc(16% + (var(--spark) % 7)*10%);
  width:calc(2px + (var(--spark) % 3)*2px);
  height:2px;
  background:var(--accent);
  box-shadow:0 0 9px var(--accent);
  opacity:0;
}
.portrait-surface .face-hotspot{position:absolute;z-index:20;left:23%;top:13%;width:55%;height:60%;pointer-events:none}
.portrait-surface .particle-canvas{position:absolute;z-index:10!important;inset:0!important;pointer-events:none;opacity:0}
.portrait-surface .face-data-trails{position:absolute;z-index:10!important;inset:0!important;pointer-events:none;opacity:0}
.portrait-surface .face-data-trails i{left:45%;top:44%;background:linear-gradient(90deg,rgba(186,255,0,.8),transparent)!important}
.hero-visual[data-pointer-active="true"] .assembly-sweep{opacity:.82}
.hero-visual[data-pointer-active="true"] .assembly-hud span{opacity:.58}
.hero-visual[data-pointer-active="true"] .assembly-sparks i{opacity:.68}
.hero-visual[data-pointer-active="true"] .face-data-trails{opacity:.28!important}
.hero-visual[data-pointer-active="true"] .particle-canvas{opacity:.48!important}
.hero-visual:not([data-pointer-active="true"]) .particle-canvas,.hero-visual:not([data-pointer-active="true"]) .face-data-trails{opacity:0!important}

/* Light theme keeps the cinematic portrait on a dedicated dark stage. */
html[data-theme="light"] .hero-visual{
  background:radial-gradient(circle at 44% 43%,rgba(141,206,0,.14),transparent 36%),linear-gradient(145deg,#07100b,#020403 72%);
  border:1px solid rgba(91,143,12,.2);
  box-shadow:0 28px 75px rgba(25,48,31,.14);
}
html[data-theme="light"] .hero-visual::before{opacity:.3}
html[data-theme="light"] .hud-label{color:#dbe5dd;background:rgba(4,8,6,.78)}
html[data-theme="light"] .hud-core{color:var(--accent);background:#07100b}
html[data-theme="light"] .person-base{filter:drop-shadow(0 28px 44px rgba(0,0,0,.58))!important}
html[data-theme="light"] .hero-visual::after{mix-blend-mode:screen;opacity:calc(.04 + var(--assembly-progress)*.5)}
html[data-theme="light"] .assembly-image-piece img{filter:drop-shadow(0 16px 24px rgba(0,0,0,.58)) drop-shadow(0 0 7px rgba(186,255,0,.06))}

/* Builder preview must stay stable. */
.builder-preview-mode .assembly-piece,.builder-preview-mode .assembly-sweep,.builder-preview-mode .assembly-hud span,.builder-preview-mode .assembly-sparks i{visibility:visible}
.builder-preview-mode .hero-visual{cursor:crosshair}
.builder-preview-mode .person-base{opacity:1!important}

@media(max-width:1099px){
  .hero-visual{height:590px}
  .portrait-surface{width:min(570px,100%);height:min(570px,100%);left:50%}
}
@media(max-width:768px){
  .hero-visual{height:500px;border-radius:24px}
  .portrait-surface{width:500px;height:500px;max-width:118vw;left:50%}
  .hud-labels{opacity:.7;scale:.82;transform-origin:left center}
  .assembly-piece{filter:none}
  .assembly-hud{left:29%;width:42%}
}
@media(prefers-reduced-motion:reduce){
  .assembly-piece,.assembly-sweep,.assembly-hud,.assembly-sparks,.face-data-trails,.particle-canvas{display:none!important}
  .portrait-surface{transform:none!important}
}

/* 6.3.0: the real transparent collar fragments replace the former synthetic neck block. */
.collar-shell{display:none!important}


/* Offline motion is still staged: the scan line crosses once, then disappears. */
@keyframes wahaj-fallback-sweep{
  0%{opacity:0;transform:translateX(150px) scaleY(.45)}
  14%{opacity:.9}
  78%{opacity:.72}
  100%{opacity:0;transform:translateX(-170px) scaleY(1)}
}
@keyframes wahaj-fallback-hud{
  0%{opacity:0;transform:scale(.72)}
  55%{opacity:.62;transform:scale(1.035)}
  100%{opacity:.2;transform:scale(1)}
}
@keyframes wahaj-fallback-spark{
  0%{opacity:0;transform:scale(.25)}
  45%{opacity:.72;transform:scale(1)}
  100%{opacity:.12;transform:scale(.65)}
}
html:is([data-gsap-mode="offline-fallback"],[data-gsap-mode="css-fallback"]) .hero-visual[data-pointer-active="true"] .assembly-sweep{
  animation:wahaj-fallback-sweep 1.34s cubic-bezier(.45,0,.2,1) both;
}
html:is([data-gsap-mode="offline-fallback"],[data-gsap-mode="css-fallback"]) .hero-visual:not([data-pointer-active="true"]) .assembly-sweep{
  animation:none;opacity:0;
}
html:is([data-gsap-mode="offline-fallback"],[data-gsap-mode="css-fallback"]) .hero-visual[data-pointer-active="true"] .assembly-hud span{
  animation:wahaj-fallback-hud .78s cubic-bezier(.16,1,.3,1) calc(var(--piece-order,0)*.025s) both;
}
html:is([data-gsap-mode="offline-fallback"],[data-gsap-mode="css-fallback"]) .hero-visual[data-pointer-active="true"] .assembly-sparks i{
  animation:wahaj-fallback-spark .72s ease-out calc((var(--spark) % 6)*.035s + .3s) both;
}

/* WAHAJ 6.3.3 — clean integrated identity assembly and deterministic pointer reset.
   Every fragment uses the same final portrait, so the collar, thobe and ghutra
   lock together pixel-perfectly at the end of the animation. */
.assembly-layer--fragments{z-index:6;inset:0}
.target-fragment{inset:0;z-index:6;overflow:hidden}
.target-fragment img,.person-target-final{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
  transform:scale(1.018);
  transform-origin:50% 55%;
  pointer-events:none;
  user-select:none;
  -webkit-user-drag:none;
  filter:drop-shadow(0 22px 38px rgba(0,0,0,.64)) drop-shadow(0 0 10px rgba(186,255,0,.07));
}
.fragment-outfit-left{clip-path:polygon(0 55%,52% 55%,53% 100%,0 100%)}
.fragment-outfit-right{clip-path:polygon(48% 55%,100% 55%,100% 100%,47% 100%)}
.fragment-outfit-center{clip-path:polygon(31% 50%,69% 50%,75% 85%,25% 85%)}
.fragment-ghutra-left{clip-path:polygon(0 0,53% 0,52% 67%,0 80%)}
.fragment-ghutra-right{clip-path:polygon(47% 0,100% 0,100% 80%,48% 67%)}
.fragment-headwear-top{clip-path:polygon(24% 0,76% 0,73% 28%,27% 28%)}
.person-target-final{
  z-index:8;
  opacity:0;
  visibility:visible;
  will-change:opacity,filter,transform;
}
.costume-underlay{z-index:4;top:69%;bottom:-8%;clip-path:polygon(0 34%,15% 13%,32% 3%,44% 0,50% 4%,56% 0,68% 3%,85% 13%,100% 34%,100% 100%,0 100%)}
.costume-underlay::after{display:none!important}
/* Offline/reduced-motion fallback: use the clean unified portrait instead of
   leaving separate fragments visible. GSAP inline styles take precedence in
   the full animation path. */
.hero-visual[data-pointer-active="true"] .person-target-final{opacity:1;transition:opacity .42s ease,filter .42s ease}
.hero-visual[data-pointer-active="true"] .target-fragment{opacity:0;transition:opacity .12s ease}
@media(max-width:760px){
  .target-fragment img,.person-target-final{transform:scale(1.012)}
}

/* ================================================================
   WAHAJ CMS 6.4 — full visual QA polish
   Fixes light-mode contrast, oversized blank sections, portfolio
   overflow/pinning, editor preview stability and hero cleanup.
   ================================================================ */

/* Stable page rhythm: no giant empty gaps, while respecting builder values. */
.section{
  padding-block:clamp(48px,min(var(--section-pad,76px),7vw),78px);
  scroll-margin-top:105px;
  overflow:clip;
}
.section[data-bg="surface"]{
  background:
    radial-gradient(circle at 88% 14%,color-mix(in srgb,var(--accent) 5%,transparent),transparent 30%),
    linear-gradient(180deg,color-mix(in srgb,var(--surface) 88%,var(--bg)),color-mix(in srgb,var(--surface-2) 62%,var(--bg)));
  border-block:1px solid color-mix(in srgb,var(--line) 65%,transparent);
}
.section-head{margin-bottom:26px;align-items:flex-end}
.section-head h2{letter-spacing:-.025em}
.section-head p{line-height:1.85}

/* Hero stays balanced and never creates a black/white dead zone. */
.hero{min-height:720px;padding:42px 0 34px}
.hero-grid{min-height:630px;gap:clamp(18px,2.5vw,42px)}
.hero-copy{padding-right:clamp(0px,1.5vw,24px)}
.hero-visual{height:620px;max-width:720px;width:100%;margin-inline:auto}
.portrait-surface{width:min(590px,96%);height:min(590px,96%)}
.service-strip{margin-top:-72px}
.service-mini{min-height:124px}

/* Portfolio: fixed responsive grid. No pinning, horizontal overflow or clipped card. */
#portfolio{overflow:hidden}
#portfolio .container{overflow:visible}
.projects-grid,
.projects-grid.motion-horizontal{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:16px!important;
  width:100%!important;
  max-width:100%!important;
  transform:none!important;
  translate:none!important;
  overflow:visible!important;
}
.project-card,
.motion-horizontal .project-card{
  min-width:0!important;
  width:auto!important;
  flex:none!important;
  min-height:390px!important;
  border-radius:18px;
}
.project-card[hidden],.project-card.is-filtered-out{display:none!important}
.project-card img,.motion-horizontal .project-card img{height:100%!important}
.project-content{right:20px;left:20px;bottom:20px}
.project-content h3{font-size:21px;line-height:1.35}
.project-content p{font-size:13px;line-height:1.7}
.portfolio-tabs{overflow-x:auto;flex-wrap:nowrap;padding-bottom:4px;scrollbar-width:thin}
.tab-pill{flex:0 0 auto}

/* Compact useful sections instead of decorative empty canvases. */
.why-process{grid-template-columns:1.08fr .92fr;align-items:stretch}
.process-map{min-height:420px}
.process-center{width:176px;height:176px}
.process-map>i{transform:rotate(var(--a)) translateX(168px) rotate(calc(var(--a)*-1))}
.why-card{min-height:180px;padding:22px}
.tools-cloud{
  justify-content:flex-start;
  padding:26px;
  border:1px solid var(--line);
  border-radius:22px;
  background:linear-gradient(145deg,var(--glass-strong),color-mix(in srgb,var(--surface-2) 70%,transparent));
  min-height:0;
}
.tool-chip{padding:11px 18px;background:color-mix(in srgb,var(--surface) 88%,transparent)}
.stats-band{margin-top:0;padding:20px 14px}
.testimonial,.faq-item,.contact-card{box-shadow:0 14px 42px rgba(0,0,0,.09)}
.cta-panel{padding:clamp(34px,4vw,52px)}

/* Light theme is a complete theme, not a washed-out filter. */
html[data-theme="light"]{
  --bg:#f3f6f1;
  --bg-2:#e9efe6;
  --surface:#ffffff;
  --surface-2:#edf3e9;
  --text:#132018;
  --muted:#56645b;
  --line:rgba(43,79,51,.16);
  --line-strong:rgba(91,143,12,.50);
  --glass:rgba(255,255,255,.88);
  --glass-strong:rgba(255,255,255,.97);
  --shadow:0 22px 65px rgba(34,57,40,.11);
}
html[data-theme="light"] body::before{opacity:.58}
html[data-theme="light"] .site-header{
  background:rgba(255,255,255,.91);
  border-color:rgba(73,112,42,.20);
  box-shadow:0 18px 48px rgba(33,58,40,.11);
}
html[data-theme="light"] .section[data-bg="surface"]{
  background:
    radial-gradient(circle at 84% 12%,rgba(126,184,0,.075),transparent 32%),
    linear-gradient(180deg,#edf3e9,#f7f9f5 50%,#edf3e9);
  border-color:rgba(49,83,55,.10);
}
html[data-theme="light"] .hero::after{background:radial-gradient(ellipse at 28% 48%,rgba(114,166,16,.08),transparent 46%)}
html[data-theme="light"] .hero-visual{
  border:1px solid rgba(76,117,44,.18);
  border-radius:30px;
  background:
    radial-gradient(circle at 47% 42%,rgba(186,255,0,.11),transparent 34%),
    linear-gradient(145deg,#0a110d,#020504 78%);
  box-shadow:0 30px 80px rgba(29,52,35,.17),inset 0 0 0 1px rgba(255,255,255,.03);
}
html[data-theme="light"] .portrait-surface{background:radial-gradient(ellipse at 50% 54%,#09100c 0 43%,#020504 67%,transparent 78%)}
html[data-theme="light"] .hero-copy h1{color:#142018!important}
html[data-theme="light"] .hero-description,html[data-theme="light"] .section-head p{color:#58675d!important}
html[data-theme="light"] .service-strip .service-mini,
html[data-theme="light"] .service-card,
html[data-theme="light"] .why-card,
html[data-theme="light"] .testimonial,
html[data-theme="light"] .faq-item,
html[data-theme="light"] .contact-card,
html[data-theme="light"] .info-card,
html[data-theme="light"] .stats-band,
html[data-theme="light"] .tools-cloud{
  background:#fff;
  border-color:rgba(46,78,51,.15);
  box-shadow:0 18px 48px rgba(34,57,40,.08);
}
html[data-theme="light"] .project-card{
  background:#07100b;
  border-color:rgba(80,115,56,.24);
  box-shadow:0 18px 45px rgba(26,46,31,.12);
}
html[data-theme="light"] .project-card::after{background:linear-gradient(180deg,rgba(4,9,6,.02) 12%,rgba(3,9,5,.94) 92%)}
html[data-theme="light"] .project-card img{opacity:.72;filter:saturate(.92) contrast(1.03)}
html[data-theme="light"] .project-content h3,html[data-theme="light"] .project-content p{color:#f4f7f5!important}
html[data-theme="light"] .project-content small{color:#baff00!important}
html[data-theme="light"] .process-map{
  background:radial-gradient(circle,rgba(128,185,14,.14),transparent 34%),repeating-radial-gradient(circle,transparent 0 49px,rgba(82,125,37,.12) 50px 51px),#fff;
  box-shadow:0 18px 48px rgba(34,57,40,.07);
}
html[data-theme="light"] .process-center{background:#fff;color:#152019}
html[data-theme="light"] .process-map>i{background:#fff;color:#5f9200}
html[data-theme="light"] .field input,
html[data-theme="light"] .field textarea,
html[data-theme="light"] .field select{background:#f8faf6;color:#162019}
html[data-theme="light"] .site-footer{background:#eaf0e6}

/* Hero transformation cleanup: no floating fragments after pointer leave. */
.hero-transform-reset .assembly-piece,
.hero-transform-reset .person-target-final,
.hero-transform-reset .assembly-sweep,
.hero-transform-reset .assembly-hud span,
.hero-transform-reset .assembly-sparks i,
.hero-transform-reset .face-data-trails i{
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
}
.hero-visual:not([data-pointer-active="true"]) .person-target-final{opacity:0!important;visibility:hidden!important}
.hero-visual[data-pointer-active="true"] .person-target-final{visibility:visible!important}
.assembly-piece,.person-target-final{pointer-events:none!important}

/* Builder: keep iframe mounted and visually stable during edits. */
.builder-page{contain:layout paint}
.builder-canvas-area{min-width:0;overflow:hidden}
.canvas-viewport{overscroll-behavior:contain;scrollbar-gutter:stable}
.preview-frame-wrap{isolation:isolate;transform:translateZ(0);backface-visibility:hidden}
.preview-frame{display:block;contain:strict;background:#f3f6f1}
.builder-preview-mode .section{overflow:clip!important}
.builder-preview-mode .projects-grid{transform:none!important}
.builder-preview-mode .wahaj-splash{display:none!important}
.builder-preview-mode .hero-transform-reset .assembly-piece{display:block!important}

/* Dashboard cards/charts remain readable without oversized empty panels. */
.dashboard-metrics{grid-template-columns:repeat(6,minmax(0,1fr))}
.metric-card{min-height:118px;padding:16px}
.metric-card strong{font-size:27px}
.chart-box{height:auto;min-height:315px}
.chart-canvas{height:240px}
.donut-wrap{height:240px}
.panel{overflow:hidden}

/* Responsive QA */
@media(max-width:1280px){
  .projects-grid,.projects-grid.motion-horizontal{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .dashboard-metrics{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:1024px){
  .hero-grid{min-height:0}
  .hero-visual{height:540px;max-width:680px}
  .service-strip{margin-top:-22px}
  .why-process{grid-template-columns:1fr}
  .process-map{order:-1;min-height:380px}
  .projects-grid,.projects-grid.motion-horizontal{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:768px){
  .section{padding-block:clamp(42px,var(--pad-mobile,48px),58px)}
  .hero{padding-top:24px}
  .hero-visual{height:470px;border-radius:22px}
  .portrait-surface{width:min(500px,112%);height:min(500px,112%)}
  .projects-grid,.projects-grid.motion-horizontal{grid-template-columns:1fr!important}
  .project-card,.motion-horizontal .project-card{min-height:360px!important}
  .tools-cloud{padding:18px;justify-content:flex-start}
  .dashboard-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:480px){
  .hero-visual{height:405px}
  .project-card,.motion-horizontal .project-card{min-height:330px!important}
  .dashboard-metrics{grid-template-columns:1fr}
}

/* ==================================================================
   WAHAJ CMS 6.5 — transcript-driven correction pass
   Homepage-only intro, vivid light theme, editable page builder,
   square service media, service details modal and fast hero cleanup.
   ================================================================== */

/* Service catalogue: image-led cards with a deliberate near-square frame. */
.services-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.service-card{padding:0;min-height:0;aspect-ratio:.88/1;overflow:hidden;background:var(--surface);border-color:var(--line)}
.service-card-open{appearance:none;border:0;background:none;color:inherit;text-align:inherit;width:100%;height:100%;display:grid;grid-template-rows:minmax(0,1.15fr) minmax(185px,.85fr);padding:0;cursor:pointer;font:inherit}
.service-card-media{height:auto;min-height:0;margin:0;border-radius:0;background:#07100b;position:relative;overflow:hidden}
.service-card-media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 62%,rgba(3,9,5,.22));pointer-events:none}
.service-card-media img{width:100%;height:100%;object-fit:cover;opacity:1;filter:none;transform:scale(1.002);transition:transform .55s cubic-bezier(.2,.8,.2,1),filter .4s}
.service-card-body{display:flex;flex-direction:column;align-items:flex-start;padding:22px 22px 20px;background:linear-gradient(160deg,var(--glass-strong),color-mix(in srgb,var(--surface-2) 72%,var(--surface)))}
.service-card-body h3{font-size:20px;line-height:1.35;margin:0 0 9px}
.service-card-body p{font-size:13px;line-height:1.85;margin:0;color:var(--muted)}
.service-card-body .card-link{margin-top:auto;padding-top:14px}
.service-card:hover .service-card-media img{transform:scale(1.055);filter:saturate(1.06) contrast(1.03)}

/* Rich service information popup before the request page. */
.service-modal-backdrop{position:fixed;inset:0;z-index:10000;display:grid;place-items:center;padding:22px;background:rgba(1,5,3,.78);backdrop-filter:blur(13px);animation:wahajModalIn .22s ease both}
.service-modal{position:relative;width:min(960px,100%);max-height:min(760px,calc(100vh - 44px));overflow:auto;display:grid;grid-template-columns:minmax(300px,.9fr) minmax(360px,1.1fr);border:1px solid color-mix(in srgb,var(--accent) 34%,var(--line));border-radius:28px;background:var(--surface);box-shadow:0 34px 100px rgba(0,0,0,.5)}
.service-modal-close{position:absolute;z-index:2;top:14px;left:14px;width:42px;height:42px;border:1px solid var(--line);border-radius:50%;background:var(--glass-strong);color:var(--text);font-size:27px;line-height:1;cursor:pointer}
.service-modal-media{min-height:560px;background:#06100a;overflow:hidden}
.service-modal-media img{width:100%;height:100%;object-fit:cover;display:block}
.service-modal-copy{padding:clamp(30px,4vw,52px);align-self:center}
.service-modal-copy h2{font-size:clamp(30px,4vw,48px);line-height:1.2;margin:13px 0}
.service-modal-copy>p{color:var(--muted);line-height:1.9}
.service-modal-copy h3{margin:26px 0 12px}
.service-modal-copy ul{list-style:none;padding:0;margin:0;display:grid;gap:10px}
.service-modal-copy li{display:flex;gap:10px;align-items:flex-start;color:var(--text);line-height:1.65}
.service-modal-copy li span{display:grid;place-items:center;width:23px;height:23px;flex:0 0 23px;border-radius:50%;background:color-mix(in srgb,var(--accent) 17%,transparent);color:var(--accent);font-weight:900}
.service-modal-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:30px}
.service-modal-actions .secondary-btn{display:inline-flex;align-items:center;gap:8px}
.service-modal-actions svg{width:20px;height:20px}
@keyframes wahajModalIn{from{opacity:0;transform:translateY(12px) scale(.985)}to{opacity:1;transform:none}}

/* Real WhatsApp mark, not a text badge. */
.float-whatsapp{display:grid;place-items:center;font-size:0}
.float-whatsapp .whatsapp-svg,.whatsapp-header-btn .whatsapp-svg{width:27px;height:27px;display:block}
.float-whatsapp .whatsapp-svg{width:31px;height:31px}
.contact-point b .whatsapp-svg{width:25px;height:25px;display:block}

/* Light mode: clear, vivid and intentionally designed—not a white veil. */
html[data-theme="light"]{
  --bg:#f6f8f4;--bg-2:#eef3eb;--surface:#ffffff;--surface-2:#edf3e8;
  --text:#101b14;--muted:#4c5d51;--line:rgba(34,68,43,.18);
  --line-strong:rgba(103,151,11,.62);--glass:rgba(255,255,255,.91);
  --glass-strong:#ffffff;--shadow:0 22px 58px rgba(26,52,33,.12)
}
html[data-theme="light"] body{background:linear-gradient(180deg,#f8faf7 0,#eef3eb 48%,#f8faf7 100%)}
html[data-theme="light"] body::before{opacity:.22;filter:saturate(.7)}
html[data-theme="light"] .hero{background:radial-gradient(circle at 25% 42%,rgba(170,225,45,.12),transparent 31%);border-bottom:1px solid rgba(43,75,47,.08)}
html[data-theme="light"] .hero::after{opacity:.6;background:radial-gradient(ellipse at 27% 48%,rgba(144,197,26,.10),transparent 43%)}
html[data-theme="light"] .hero-visual{border:0;border-radius:0;background:transparent;box-shadow:none}
html[data-theme="light"] .portrait-surface{background:radial-gradient(ellipse at 50% 53%,rgba(4,12,7,.98) 0 48%,rgba(7,15,10,.80) 62%,transparent 77%)}
html[data-theme="light"] .visual-orbit,html[data-theme="light"] .hud-labels,html[data-theme="light"] .hud-core{filter:contrast(1.12) saturate(1.08)}
html[data-theme="light"] .section{color:#101b14}
html[data-theme="light"] .section-head h2,html[data-theme="light"] .why-card h3,html[data-theme="light"] .testimonial h3,html[data-theme="light"] .faq-question,html[data-theme="light"] .service-card h3{color:#101b14!important}
html[data-theme="light"] .section-head p,html[data-theme="light"] .why-card p,html[data-theme="light"] .testimonial p,html[data-theme="light"] .faq-answer,html[data-theme="light"] .service-card p{color:#4c5d51!important}
html[data-theme="light"] .section-badge,html[data-theme="light"] .card-link{color:#598b00!important}
html[data-theme="light"] .section[data-bg="surface"]{background:linear-gradient(180deg,#edf3e9 0,#f8faf6 50%,#edf3e9 100%);border-color:rgba(35,71,43,.10)}
html[data-theme="light"] .service-mini,html[data-theme="light"] .service-card,html[data-theme="light"] .why-card,html[data-theme="light"] .testimonial,html[data-theme="light"] .faq-item,html[data-theme="light"] .contact-card,html[data-theme="light"] .info-card,html[data-theme="light"] .stats-band,html[data-theme="light"] .tools-cloud{background:#fff;border-color:rgba(35,70,43,.18);box-shadow:0 18px 46px rgba(29,55,36,.10)}
html[data-theme="light"] .service-card-media{background:#07100b}
html[data-theme="light"] .service-card-media img{opacity:1!important;filter:saturate(1.05) contrast(1.04)!important}
html[data-theme="light"] .service-card-body{background:#fff}
html[data-theme="light"] .project-card{background:#06100a;border-color:rgba(40,75,47,.24);box-shadow:0 20px 52px rgba(25,48,31,.15)}
html[data-theme="light"] .project-card img{opacity:1!important;filter:saturate(1.08) contrast(1.05)!important}
html[data-theme="light"] .project-card::after{background:linear-gradient(180deg,rgba(3,8,5,0) 35%,rgba(2,7,4,.94) 94%)}
html[data-theme="light"] .project-content{filter:none}
html[data-theme="light"] .project-content h3,html[data-theme="light"] .project-content p{color:#fff!important;text-shadow:0 2px 12px rgba(0,0,0,.45)}
html[data-theme="light"] .process-map{border:1px solid rgba(47,83,52,.17);background:radial-gradient(circle,rgba(147,202,25,.20),transparent 30%),repeating-radial-gradient(circle,transparent 0 49px,rgba(65,105,43,.18) 50px 51px),#fff}
html[data-theme="light"] .process-center{background:#fff;color:#101b14;border-color:#83ba12;box-shadow:0 12px 36px rgba(74,113,32,.16)}
html[data-theme="light"] .process-map>i{opacity:1;background:#fff;color:#477700;border-color:rgba(73,116,43,.28);box-shadow:0 8px 22px rgba(44,77,45,.12)}
html[data-theme="light"] .tool-chip{background:#fff;color:#172219;border-color:rgba(41,76,48,.17)}
html[data-theme="light"] .testimonial-stars{color:#679a00}
html[data-theme="light"] .service-modal{background:#fff}

/* Login and admin light palette: no muddy olive-on-white blend. */
html[data-theme="light"] .admin-body,html[data-theme="light"] .login-shell{background:radial-gradient(circle at 15% 10%,rgba(179,230,52,.15),transparent 27%),#eef3eb}
html[data-theme="light"] .login-card{background:#fff;border-color:rgba(42,76,48,.20);box-shadow:0 26px 80px rgba(28,55,35,.16)}
html[data-theme="light"] .login-card h1,html[data-theme="light"] .login-card label{color:#101b14}
html[data-theme="light"] .login-card input{background:#f7faf5!important;color:#101b14!important;border-color:rgba(39,72,45,.20)!important}
html[data-theme="light"] .login-note{background:#f2f7ef;color:#48594d;border-color:rgba(51,88,48,.24)}
html[data-theme="light"] .admin-sidebar,html[data-theme="light"] .admin-topbar,html[data-theme="light"] .panel,html[data-theme="light"] .metric-card{background:#fff;border-color:rgba(39,72,45,.17)}

/* Builder usability: visible exit, page selector and direct canvas editing. */
.builder-exit,.builder-back{display:inline-flex!important;align-items:center;gap:7px;background:#eef5e9!important;color:#142019!important;border:1px solid rgba(141,196,27,.55)!important;font-weight:800!important;opacity:1!important}
.builder-page-select{height:39px;min-width:150px;padding:0 12px;border:1px solid var(--line-strong);border-radius:9px;background:var(--surface);color:var(--text);font:inherit;font-weight:700}
.builder-preview-mode [data-inline-path]{cursor:text;outline:1px dashed transparent;outline-offset:4px;transition:outline-color .18s,background .18s}
.builder-preview-mode [data-inline-path]:hover,.builder-preview-mode [data-inline-path]:focus{outline-color:var(--accent);background:color-mix(in srgb,var(--accent) 7%,transparent)}
.builder-preview-mode [data-builder-image-path]{cursor:pointer;outline:2px dashed transparent;outline-offset:-4px}
.builder-preview-mode [data-builder-image-path]:hover{outline-color:var(--accent)}
.builder-item-editor{display:grid;gap:12px;padding:14px;border:1px solid var(--line);border-radius:12px;background:color-mix(in srgb,var(--surface-2) 72%,transparent);margin-bottom:12px}
.builder-item-editor img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:9px;border:1px solid var(--line)}
.builder-empty-note{padding:16px;border:1px dashed var(--line);border-radius:12px;color:var(--muted);line-height:1.8}
html[data-theme="light"] .builder-page{--bg:#f4f7f2;--surface:#fff;--surface-2:#edf3e9;--text:#101b14;--muted:#536158;--line:rgba(38,73,45,.18)}
html[data-theme="light"] .builder-top,html[data-theme="light"] .builder-nav,html[data-theme="light"] .builder-inspector{background:#fff;color:#101b14;border-color:rgba(37,72,44,.16)}
html[data-theme="light"] .canvas-viewport{background:#e8eee5}
html[data-theme="light"] .builder-exit,html[data-theme="light"] .builder-back{background:#172019!important;color:#fff!important}

/* The reverse animation must never leave headwear or fragments behind. */
.hero-visual[data-pointer-leaving="true"] .person-target-final,
.hero-visual[data-pointer-leaving="true"] .assembly-piece[data-piece="headwear-top"],
.hero-transform-reset .assembly-piece,
.hero-transform-reset .person-target-final{opacity:0!important;visibility:hidden!important;transition:none!important}

@media(max-width:1100px){.services-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.service-card{aspect-ratio:auto;min-height:520px}}
@media(max-width:760px){
  .services-grid{grid-template-columns:1fr}.service-card{min-height:500px;aspect-ratio:auto}.service-card-open{grid-template-rows:280px 1fr}
  .service-modal{grid-template-columns:1fr}.service-modal-media{min-height:260px;max-height:330px}.service-modal-copy{padding:26px 22px}.service-modal-actions{display:grid}.service-modal-actions>*{justify-content:center}
}

/* ================================================================
   WAHAJ CMS 6.5.2 — light-mode hero cleanup
   Fixes the dark backdrop behind the transformed portrait in day mode
   and fully hides the white-shirt edges after the transformation locks.
   ================================================================ */
.hero-visual .person-base{
  transition:opacity .38s ease,filter .38s ease,transform .38s ease;
}
.hero-visual[data-pointer-active="true"] .person-base,
.hero-visual[data-transform-latched="true"] .person-base{
  opacity:calc(1 - (var(--assembly-progress) * .985))!important;
}
.hero-visual[data-transform-latched="true"] .person-target-final{
  opacity:1!important;
}
html[data-theme="light"] .portrait-surface{
  overflow:hidden;
  background:radial-gradient(
    ellipse at 50% 54%,
    rgba(30,44,33,.10) 0 28%,
    rgba(72,95,74,.08) 44%,
    rgba(208,219,206,.14) 62%,
    transparent 79%
  )!important;
}
html[data-theme="light"] .portrait-surface::before{
  background:radial-gradient(
    ellipse at 50% 46%,
    rgba(155,210,44,.22),
    rgba(155,210,44,.07) 36%,
    transparent 72%
  )!important;
  filter:blur(26px)!important;
  opacity:calc(.08 + var(--assembly-progress) * .16)!important;
}
html[data-theme="light"] .person-glow{
  left:11%!important;
  right:19%!important;
  bottom:7%!important;
  height:58%!important;
  background:radial-gradient(
    ellipse at 50% 58%,
    rgba(136,188,35,.18),
    rgba(136,188,35,.06) 44%,
    transparent 72%
  )!important;
  filter:blur(26px)!important;
  opacity:.16!important;
}
html[data-theme="light"] .hero-visual::before{
  opacity:.22!important;
}
html[data-theme="light"] .visual-orbit{
  border-color:rgba(88,128,24,.18)!important;
  box-shadow:inset 0 0 44px rgba(110,156,18,.08),0 0 32px rgba(110,156,18,.05)!important;
}
html[data-theme="light"] .target-fragment img,
html[data-theme="light"] .person-target-final{
  filter:drop-shadow(0 18px 30px rgba(29,44,33,.18)) drop-shadow(0 0 8px rgba(140,190,36,.06))!important;
}

/* ================================================================
   WAHAJ CMS 6.5.3 — definitive hero cleanup
   Hard state classes are used instead of relying on interpolated custom
   properties. This completely removes the white base portrait after the
   transformation finishes and removes the dark oval in light mode.
   ================================================================ */
.hero-visual.hero-transform-complete .person-base,
.hero-visual.hero-transform-complete .hero-portrait{
  opacity:0!important;
  visibility:hidden!important;
  display:none!important;
  filter:none!important;
}
.hero-visual.hero-transform-complete .person-target-final{
  opacity:1!important;
  visibility:visible!important;
  display:block!important;
}
.hero-visual.hero-transform-complete .target-fragment,
.hero-visual.hero-transform-complete .costume-underlay{
  opacity:0!important;
  visibility:hidden!important;
}
html[data-theme="light"] .portrait-surface{
  background:transparent!important;
  background-image:none!important;
  box-shadow:none!important;
  overflow:hidden!important;
}
html[data-theme="light"] .portrait-surface::before{
  content:none!important;
  display:none!important;
  opacity:0!important;
  background:none!important;
}
html[data-theme="light"] .person-glow{
  display:none!important;
  opacity:0!important;
  background:none!important;
}
html[data-theme="light"] .hero-visual::after{
  display:none!important;
  opacity:0!important;
  background:none!important;
}
html[data-theme="light"] .hero-visual.hero-transform-complete .person-target-final{
  filter:drop-shadow(0 18px 28px rgba(29,44,33,.14))!important;
}


/* WAHAJ CMS 6.6 — stable visual builder controls */
.builder-item-actions{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;margin:10px 0 14px;padding:8px;background:rgba(255,255,255,.035);border:1px solid var(--line);border-radius:10px}
.builder-item-actions button,.builder-add-item{min-height:34px;border:1px solid var(--line);background:var(--surface-2);color:var(--text);border-radius:8px;cursor:pointer;font-family:inherit}
.builder-item-actions button:hover,.builder-add-item:hover{border-color:var(--accent);color:var(--accent)}
.builder-item-actions button.danger:hover{border-color:#d85b5b;color:#ff8585}
.builder-item-actions button:disabled{opacity:.35;cursor:not-allowed}
.builder-add-item{width:100%;margin-top:8px;background:color-mix(in srgb,var(--accent) 10%,var(--surface));font-weight:800}
.menu-item-row{grid-template-columns:auto minmax(130px,1fr) minmax(120px,1fr) minmax(130px,1fr) auto auto auto auto auto auto!important;align-items:center}
.menu-page-select{min-width:130px}
.page-title-link{border:0;background:none;color:var(--text);font:inherit;cursor:pointer;padding:0}.page-title-link:hover{color:var(--accent)}
html[data-theme="light"] .builder-item-actions{background:rgba(29,50,34,.035)}
@media(max-width:900px){.builder-item-actions{grid-template-columns:1fr 1fr}.menu-item-row{display:flex!important;flex-wrap:wrap}.menu-item-row>*{flex:1 1 140px}}

.builder-drag-handle{grid-column:1/-1;display:block;padding:5px 8px;border-radius:7px;color:var(--muted);cursor:grab;text-align:center;font-size:12px}.builder-drag-handle:active{cursor:grabbing}.builder-item-actions.drag-over{outline:2px solid var(--accent);background:color-mix(in srgb,var(--accent) 12%,var(--surface))}


/* ==================================================================
   WAHAJ CMS 6.7 — production runtime safety + mobile admin overhaul
   ================================================================== */
.runtime-notice{position:fixed;z-index:10000;left:50%;bottom:18px;transform:translateX(-50%);width:min(92vw,620px);padding:12px 16px;border:1px solid color-mix(in srgb,var(--accent) 50%,var(--line));border-radius:14px;background:color-mix(in srgb,var(--surface) 94%,#000);color:var(--text);box-shadow:0 18px 60px rgba(0,0,0,.35);text-align:center;font-size:13px}
.admin-menu-toggle,.admin-sidebar-close,.admin-mobile-overlay{display:none}
.admin-topbar-title{min-width:0}.admin-topbar-title h1,.admin-topbar-title p{overflow:hidden;text-overflow:ellipsis}
.data-table-wrap{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:thin}
.data-table{width:100%;min-width:720px}

@media(max-width:768px){
  body.admin-drawer-open{overflow:hidden!important}
  .admin-shell{display:block!important;min-height:100dvh}
  .admin-sidebar{display:flex!important;position:fixed!important;top:0!important;right:0!important;bottom:0!important;left:auto!important;width:min(88vw,330px)!important;height:100dvh!important;padding:16px 12px!important;border:0!important;border-left:1px solid var(--line)!important;z-index:230!important;transform:translateX(105%);transition:transform .24s ease;box-shadow:-24px 0 70px rgba(0,0,0,.46);background:color-mix(in srgb,var(--surface) 97%,#000)!important;backdrop-filter:blur(22px)}
  .admin-sidebar.open{transform:translateX(0)}
  .admin-sidebar-close{display:grid;place-items:center;position:absolute;top:12px;left:12px;width:38px;height:38px;border-radius:11px;border:1px solid var(--line);background:var(--surface-2);color:var(--text);font-size:25px;z-index:2}
  .admin-mobile-overlay{display:block;position:fixed;inset:0;z-index:220;border:0;background:rgba(0,0,0,.58);opacity:0;visibility:hidden;transition:.2s}
  .admin-mobile-overlay.show{opacity:1;visibility:visible}
  .admin-brand{display:flex!important;justify-content:flex-start!important;padding-left:48px!important}
  .admin-brand div{display:block!important}.admin-brand img{width:44px!important}
  .admin-nav{display:grid!important;align-content:start!important;gap:4px!important;margin-top:12px!important;padding:0 0 16px!important;overflow-y:auto!important;overflow-x:hidden!important}
  .admin-nav-group{display:grid!important;gap:4px!important;margin-bottom:10px!important}
  .admin-nav-group>small{display:block!important;padding:8px 12px 3px!important}
  .admin-nav button{display:flex!important;min-width:0!important;width:100%!important;justify-content:flex-start!important;padding:11px 12px!important;text-align:right!important}
  .admin-nav button span:not(.nav-icon){display:inline!important}
  .admin-user{display:flex!important;padding:12px 6px!important}.admin-user>div:not(.admin-avatar){display:block!important;min-width:0}.admin-user strong,.admin-user small{display:block;max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .admin-main{width:100%!important;min-width:0!important;padding:0 10px 28px!important}
  .admin-topbar{position:sticky;top:0;z-index:80;height:auto!important;min-height:66px!important;margin:0 -10px 12px!important;padding:10px!important;display:grid!important;grid-template-columns:44px minmax(0,1fr);gap:8px 10px!important;background:color-mix(in srgb,var(--bg) 93%,transparent)!important;border-bottom:1px solid var(--line);backdrop-filter:blur(18px)}
  .admin-menu-toggle{display:grid!important;place-items:center;grid-column:1;grid-row:1}
  .admin-topbar-title{grid-column:2;grid-row:1;min-width:0}.admin-topbar-title h1{font-size:20px!important;line-height:1.25;margin:0}.admin-topbar-title p{font-size:10px!important;white-space:nowrap;margin:3px 0 0}
  .top-actions{grid-column:1/-1;grid-row:2;display:flex!important;width:100%;gap:7px!important;overflow-x:auto;padding-bottom:2px;scrollbar-width:none}.top-actions::-webkit-scrollbar{display:none}.top-actions>*{flex:0 0 auto;min-height:40px!important;padding-inline:13px!important}
  #admin-content{min-width:0}.panel{padding:14px!important;border-radius:14px!important}.panel-head{align-items:flex-start!important;flex-wrap:wrap!important;gap:10px}.panel-head>div{min-width:0}
  .dashboard-grid,.charts-row,.settings-layout,.tools-grid{grid-template-columns:1fr!important}.dashboard-grid{gap:10px!important;margin-top:10px!important}.dashboard-metrics{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}.metric-card{min-height:105px!important;padding:13px!important}.metric-card strong{font-size:24px!important}
  .chart-box{min-height:280px!important}.chart-canvas{height:210px!important}.donut-wrap{height:210px!important}.donut{width:145px!important;height:145px!important}
  .data-table-wrap{margin-inline:-4px;padding-bottom:4px;border-radius:10px}.data-table{min-width:680px;font-size:12px}.data-table th,.data-table td{padding:11px 10px!important;white-space:nowrap}.data-table td small{white-space:normal;min-width:145px}
  .toolbar,.toolbar.compact,.tabs,.settings-tabs{display:flex!important;flex-wrap:nowrap!important;overflow-x:auto!important;gap:7px!important}.toolbar>*{flex:0 0 min(78vw,300px)}.tabs button,.settings-tabs button{flex:0 0 auto}
  .collection-grid,.media-grid,.themes-grid,.plugins-grid{grid-template-columns:1fr!important}.form-grid{grid-template-columns:1fr!important}.field.full{grid-column:auto!important}.field input,.field textarea,.field select,.search-input{width:100%!important;min-width:0!important}
  .modal-backdrop{padding:8px!important;align-items:flex-end!important}.modal{width:100%!important;max-width:none!important;max-height:92dvh!important;border-radius:20px 20px 0 0!important;padding:16px!important}.modal-grid,.modal .form-grid{grid-template-columns:1fr!important}
  .menu-item-row{display:grid!important;grid-template-columns:1fr!important}.menu-item-row>*{width:100%!important;min-width:0!important}
  .builder-page{position:fixed;inset:0;z-index:400}.builder-top{padding:7px!important}.builder-tools{overflow-x:auto!important}.builder-nav{width:min(84vw,290px)!important}.builder-inspector{width:min(88vw,310px)!important}.canvas-viewport{padding:4px!important}
}
@media(max-width:430px){
  .dashboard-metrics{grid-template-columns:1fr!important}.admin-topbar-title h1{font-size:18px!important}.top-actions .secondary-btn{font-size:12px}.panel{padding:12px!important}.login-shell{padding:12px!important}.login-card{padding:22px 16px!important;border-radius:20px!important}
}