/* Compact multi-page catalogue, using Zaka2's existing theme tokens. */
.catalog-site{background:var(--paper);color:var(--ink)}
.catalog-site .wrap{max-width:1180px;width:calc(100% - 64px);margin-inline:auto}
.catalog-site .nav{gap:28px;min-height:90px}.catalog-site .navlinks{gap:22px}.catalog-site .brand{flex-shrink:0}.catalog-site .brand-art{width:104px}
.catalog-site :is(h1,h2,h3,p){margin-top:0}.catalog-site :is(.page-intro,.home-hero) h1{font-family:'Space Grotesk',sans-serif;font-size:clamp(42px,5.5vw,74px);font-weight:500;line-height:1.08;letter-spacing:-.04em;margin-bottom:24px}
.catalog-site h2{font-family:'Space Grotesk',sans-serif;font-size:clamp(28px,3vw,42px);font-weight:500;line-height:1.2;letter-spacing:-.025em;margin-bottom:16px}
.catalog-site h3{font-size:22px;line-height:1.35;margin-bottom:12px;letter-spacing:-.02em}.catalog-site p{line-height:1.75;color:var(--muted)}
.catalog-site .eyebrow{color:var(--copper);font-size:11px;letter-spacing:.15em;font-weight:700;margin-bottom:22px}.catalog-site .lead{font-size:18px;max-width:700px;line-height:1.8}
.home-hero{display:grid;grid-template-columns:1.25fr .75fr;align-items:center;gap:64px;padding-block:72px 60px}.home-brand{text-align:center}.home-brand img{width:min(100%,350px);height:auto;border-radius:50%;mix-blend-mode:normal;box-shadow:0 12px 60px #59351b12}.home-brand p{font-size:10px;letter-spacing:.17em;margin-top:20px}
.hero-links{display:flex;gap:24px;align-items:center;flex-wrap:wrap;margin-top:28px}.catalog-site .btn{background:var(--copper);border-color:var(--copper);color:#fff;border-radius:5px;font-size:14px;min-height:48px;display:inline-flex;align-items:center;justify-content:center;padding:14px 22px;text-align:center}.catalog-site .btn:hover{filter:brightness(1.12)}
.text-link{font-size:14px;font-weight:600;color:var(--copper);display:inline-block;text-underline-offset:5px}.text-link:hover{text-decoration:underline}
.catalog-section{padding-block:48px;border-top:1px solid var(--line)}.section-heading{display:flex;align-items:baseline;justify-content:space-between;gap:32px;margin-bottom:24px}.section-heading h2{max-width:590px}.section-heading p{max-width:400px;margin:0;font-size:14px}
.catalog-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}.catalog-grid:has(>.catalog-card:nth-child(3):last-child){grid-template-columns:repeat(3,minmax(0,1fr))}.catalog-grid:has(>.catalog-card:nth-child(2):last-child){grid-template-columns:repeat(2,minmax(0,1fr))}
.catalog-card{border:1px solid var(--line);border-radius:10px;overflow:hidden;background:var(--white);display:flex;flex-direction:column;min-width:0;transition:border-color .2s,transform .2s}.catalog-card:hover{border-color:var(--copper);transform:translateY(-3px)}.catalog-card>img{width:100%;height:auto;aspect-ratio:1.6;object-fit:cover;border-bottom:1px solid var(--line)}.card-body{padding:24px;display:flex;flex:1;flex-direction:column;align-items:flex-start}.card-body p{font-size:14px;margin-bottom:22px}.card-body .text-link{margin-top:auto}.catalog-site .card-body h3{font-size:21px}
.steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}.steps>div{border-inline-start:2px solid var(--copper);padding-inline-start:20px}.steps h3{font-size:17px}.steps p{font-size:14px;margin:0}
.contact-band{background:var(--white);border-block:1px solid var(--line);padding-block:52px}.contact-inner{display:grid;grid-template-columns:1.4fr .6fr;gap:64px;align-items:center}.contact-inner p{max-width:600px;margin-bottom:0}.contact-inner .eyebrow{margin-bottom:16px}.contact-links{display:flex;flex-direction:column;align-items:flex-start;gap:15px}.contact-links a:not(.btn){color:var(--ink);font-size:17px}.contact-links a[dir=ltr]{font-variant-numeric:tabular-nums}
.site-footer{padding-block:32px 24px}.footer-links{display:flex;gap:28px;align-items:center;flex-wrap:wrap;margin-bottom:24px}.site-footer p{font-size:12px;margin-bottom:12px}.site-footer .brand{margin-inline-end:auto}.footer-links>a:not(.brand){font-size:13px}
.page-intro{padding-block:64px 42px}.page-intro h1{max-width:900px}.page-intro .lead{margin-bottom:0}
.about-hero{position:relative;isolation:isolate;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(260px,.9fr);grid-template-rows:auto auto auto;grid-template-areas:"label art" "title art" "lead art";align-content:center;align-items:center;column-gap:5vw;row-gap:8px;min-height:330px;padding-block:42px 38px;overflow:hidden}
.about-hero>.eyebrow{grid-area:label;justify-self:start;margin:0}
.about-hero>h1{grid-area:title;text-align:start;justify-self:start;max-width:650px;margin:4px 0 0}
.about-hero>.lead{grid-area:lead;justify-self:start;text-align:start;max-width:540px;margin:4px 0 0}
.about-hero::before{content:"";position:absolute;z-index:-1;top:50%;right:6%;width:min(34vw,370px);aspect-ratio:1;transform:translateY(-50%);border:1px solid #efad7830;border-radius:50%;background:radial-gradient(circle at 50% 50%,#efad781c 0 1.5px,transparent 2px),radial-gradient(circle,transparent 0 43%,#efad7829 43.3% 43.6%,transparent 44%),radial-gradient(circle,transparent 0 68%,#9ed8d220 68.2% 68.5%,transparent 69%),radial-gradient(circle at 50% 50%,#efad7812,transparent 61%);box-shadow:0 0 65px #efad7812,inset 0 0 45px #9ed8d20a;animation:about-orbit-drift 11s ease-in-out infinite alternate}
.about-hero::after{content:"";position:absolute;z-index:-1;top:50%;right:calc(6% - 18px);width:min(34vw,406px);height:min(19vw,226px);transform:translateY(-50%) rotate(-28deg);border:1px dashed #9ed8d240;border-radius:50%;pointer-events:none}
html[dir=rtl] .about-hero{grid-template-areas:"label art" "title art" "lead art"}
html[dir=rtl] .about-hero::before{right:auto;left:6%}
html[dir=rtl] .about-hero::after{right:auto;left:calc(6% - 18px)}
@keyframes about-orbit-drift{to{transform:translateY(-50%) rotate(7deg)}}.detail-layout{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start}.detail-art img{width:100%;height:auto;border:1px solid var(--line);border-radius:12px}.detail-art small{display:block;color:var(--muted);font-size:12px;margin-top:12px}.feature-list{padding-inline-start:20px;margin-block:24px 32px;color:var(--muted);line-height:1.85}.feature-list li{margin-bottom:14px}.status{display:inline-block;border:1px solid var(--line);padding:5px 10px;border-radius:4px;font-size:11px!important;color:var(--copper)!important;margin-bottom:16px}.back-link{padding-block:0 40px}
.catalog-site [hidden]{display:none!important}.catalog-site a:focus-visible,.catalog-site button:focus-visible{outline:3px solid var(--ice);outline-offset:4px}
html[dir=rtl] .catalog-site :is(h1,h2,h3){font-family:'Tajawal',sans-serif;letter-spacing:0;font-weight:700}html[dir=rtl] .catalog-site :is(.page-intro,.home-hero) h1{font-size:clamp(36px,4.3vw,60px);line-height:1.35}html[dir=rtl] .catalog-site h2{font-size:clamp(26px,2.5vw,36px);line-height:1.4}html[dir=rtl] .catalog-site h3{font-size:20px}html[dir=rtl] .catalog-site .eyebrow{letter-spacing:0}
@media(max-width:1100px){.catalog-site .navlinks{gap:14px}.catalog-site .nav-cta{display:none}.catalog-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.home-hero{gap:36px}.catalog-site .nav{gap:16px}}
@media(max-width:760px){.catalog-site .wrap{width:calc(100% - 36px)}.catalog-site .nav{min-height:76px;flex-wrap:nowrap}.catalog-site .brand-art{width:88px}.catalog-site .navlinks{display:none;position:absolute;inset:76px 0 auto;background:var(--paper);padding:24px;border-bottom:1px solid var(--line);flex-direction:column;align-items:flex-start;gap:20px;z-index:50}.catalog-site .navlinks.open{display:flex}.catalog-site .menu{display:block}.catalog-site .nav-actions{margin-inline-start:auto;gap:8px}.home-hero{grid-template-columns:1fr;padding-block:40px;gap:24px}.home-brand{display:none}.catalog-site .lead{font-size:16px}.catalog-section{padding-block:32px}.section-heading{display:block;margin-bottom:20px}.section-heading p{max-width:none}.catalog-grid,.catalog-grid:has(>.catalog-card:nth-child(3):last-child),.catalog-grid:has(>.catalog-card:nth-child(2):last-child){grid-template-columns:1fr}.card-body{padding:22px}.catalog-card>img{max-height:180px;object-fit:contain;background:#211e1b}.steps{gap:24px;grid-template-columns:1fr}.contact-inner,.detail-layout{grid-template-columns:1fr;gap:28px}.contact-band{padding-block:36px}.page-intro{padding-block:40px 30px}.footer-links{gap:20px}.footer-links .brand{flex-basis:100%}.catalog-site .assistant-link{inset-inline-end:14px;bottom:14px}.catalog-site .chat-panel{max-width:calc(100vw - 24px)}}
@media(prefers-reduced-motion:reduce){.catalog-card{transition:none}.catalog-card:hover{transform:none}}

/* Retain the established hero and responsive wordmarks. */
.catalog-site .hero .btn{font-size:14px}
html[dir=rtl] .catalog-site .hero h1{font-family:'Tajawal',sans-serif;font-weight:500;font-size:clamp(48px,5.8vw,86px);line-height:1.3}
.catalog-site .wordmark-ar{display:none}html[dir=rtl] .catalog-site .wordmark-en{display:none}html[dir=rtl] .catalog-site .wordmark-ar{display:block}
@media(max-width:1100px){.catalog-site .navlinks{gap:12px}.catalog-site .navlinks a{font-size:12px}}
@media(max-width:760px){html[dir=rtl] .catalog-site .hero h1{font-size:clamp(42px,10.8vw,58px)}}

@media(max-width:760px){.about-hero{grid-template-columns:minmax(0,1fr);grid-template-areas:"label" "title" "lead";min-height:300px;row-gap:10px;padding-block:42px 36px}.about-hero::before{right:-8%;width:min(66vw,260px);opacity:.42}.about-hero::after{right:-10%;width:min(70vw,290px);height:min(42vw,170px);opacity:.6}html[dir=rtl] .about-hero{grid-template-areas:"label" "title" "lead"}html[dir=rtl] .about-hero::before{right:auto;left:-8%}html[dir=rtl] .about-hero::after{right:auto;left:-10%}}
/* Give the homepage pillars the same ambient surface as Vision and Mission. */
.catalog-site:has(main > #home) .catalog-card{position:relative;isolation:isolate;background:radial-gradient(ellipse at 100% 0%,#efad7815,transparent 58%),linear-gradient(145deg,#191b1f,#101216 76%);border-color:#efad7833;box-shadow:inset 0 1px #ffffff08}
.catalog-site:has(main > #home) .catalog-card::before{content:"";position:absolute;z-index:-1;inset:-25% -18% auto auto;width:70%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#efad782d,transparent 68%);filter:blur(15px);opacity:.7;pointer-events:none;animation:pillar-glow 9s ease-in-out infinite alternate}
.catalog-site:has(main > #home) .catalog-card::after{content:"";position:absolute;z-index:-1;inset:0;pointer-events:none;background:repeating-linear-gradient(135deg,transparent 0 13px,#efad7807 13.5px 14px);mask-image:linear-gradient(135deg,#000,transparent 66%)}
html[data-theme="light"] .catalog-site:has(main > #home) .catalog-card{background:linear-gradient(145deg,#fff,#f6f0e8);border-color:var(--line)}
html[data-theme="light"] .catalog-site:has(main > #home) .catalog-card::before{background:radial-gradient(circle,#98522522,transparent 68%);opacity:.72}
html[data-theme="light"] .catalog-site:has(main > #home) .catalog-card::after{background:repeating-linear-gradient(135deg,transparent 0 13px,#9852250a 13.5px 14px)}

/* Dynamic Cultural Glyphs (Sacred Arabic, Hieroglyphs, Astrolabe, AI Synapse) */
.catalog-card .card-body::after,
.catalog-site:has(main > #home) .catalog-card .card-body::after {
  content: "";
  position: absolute;
  pointer-events: none;
  z-index: 0;
  width: 136px;
  height: 168px;
  bottom: -22px;
  inset-inline-end: -12px;
  background: url("./glyphs/arabic-zakaa.svg") center/contain no-repeat;
  opacity: .18;
  transform: rotate(-10deg) scale(.95);
  transition: opacity .45s cubic-bezier(0.16, 1, 0.3, 1), transform .65s cubic-bezier(0.16, 1, 0.3, 1), filter .45s ease;
}

:is(.catalog-card):is([data-slug*="erp360"], :has(a[href*="erp360"])) .card-body::after { background-image: url("./glyphs/hiero-djed.svg"); }
:is(.catalog-card):is([data-slug*="worktracker"], :has(a[href*="worktracker"])) .card-body::after { background-image: url("./glyphs/hiero-wadjet.svg"); }
:is(.catalog-card):is([data-slug*="yourspace"], :has(a[href*="yourspace"])) .card-body::after { background-image: url("./glyphs/arabic-khatam.svg"); }
:is(.catalog-card):is([data-slug*="gathering"], :has(a[href*="gathering"])) .card-body::after { background-image: url("./glyphs/hiero-ankh.svg"); }
:is(.catalog-card):is([data-slug*="madinaty-ai"], :has(a[href*="madinaty-ai"])) .card-body::after { background-image: url("./glyphs/hiero-scarab.svg"); }
:is(.catalog-card):is([data-slug*="ai-software"], :has(a[href*="ai-software"])) .card-body::after { background-image: url("./glyphs/ai-neural.svg"); }
:is(.catalog-card):is([data-slug*="consulting"], :has(a[href*="consulting"])) .card-body::after { background-image: url("./glyphs/arabic-zakaa.svg"); }
:is(.catalog-card):is([data-slug*="websites-ecommerce"], :has(a[href*="websites-ecommerce"])) .card-body::after { background-image: url("./glyphs/ai-quantum.svg"); }
:is(.catalog-card):is([data-slug*="academy"], :has(a[href*="academy"])) .card-body::after { background-image: url("./glyphs/arabic-noon.svg"); }
:is(.catalog-card):is([data-slug*="autostop"], :has(a[href*="autostop"])) .card-body::after { background-image: url("./glyphs/ai-astrolabe.svg"); }
:is(.catalog-card):is([data-slug*="loqma"], :has(a[href*="loqma"])) .card-body::after { background-image: url("./glyphs/hiero-ankh.svg"); }
:is(.catalog-card):is([data-slug*="souk-el-kanto"], :has(a[href*="souk-el-kanto"])) .card-body::after { background-image: url("./glyphs/arabic-khatam.svg"); }
:is(.catalog-card):is([data-slug*="eduflow"], :has(a[href*="eduflow"])) .card-body::after { background-image: url("./glyphs/arabic-noon.svg"); }
:is(.catalog-card):is([data-slug*="masar"], :has(a[href*="masar"])) .card-body::after { background-image: url("./glyphs/ai-astrolabe.svg"); }

.catalog-card:is(:hover, :focus-within) .card-body::after,
.catalog-site:has(main > #home) .catalog-card:is(:hover,:focus-within) .card-body::after {
  opacity: .38;
  transform: rotate(-3deg) scale(1.12);
  filter: drop-shadow(0 0 16px rgba(229, 178, 93, 0.45));
}

html[data-theme="light"] .catalog-card .card-body::after,
html[data-theme="light"] .catalog-site:has(main > #home) .catalog-card .card-body::after {
  filter: brightness(.7) sepia(.4);
  opacity: .24;
}

html[data-theme="light"] .catalog-card:is(:hover, :focus-within) .card-body::after,
html[data-theme="light"] .catalog-site:has(main > #home) .catalog-card:is(:hover,:focus-within) .card-body::after {
  opacity: .42;
  filter: brightness(.5) sepia(.8) drop-shadow(0 0 14px rgba(201, 147, 59, 0.4));
}