/* =========================================================
   M2A GROUP — ABOUT PAGE / MULTI-SECTOR AMBIENT SYSTEM
   Arabic + English. Master V3 tokens + approved Studio assets only.
   ========================================================= */

body.about-page{
  --about-gold:#D4AF37;
  --about-blue:#0284C7;
  --about-cyan:#00F2FE;
  --about-emerald:#059669;
  --about-violet:#8B5CF6;
  --about-orange:#F59E0B;
  --about-indigo:#6366F1;
  --about-teal:#14B8A6;
  --about-lime:#84CC16;
  background:#121418;
}

body.m2a-master-template.about-page .m2a-master-header{
  background:
    linear-gradient(100deg,rgba(18,20,24,.94),rgba(2,132,199,.075) 32%,rgba(212,175,55,.075) 60%,rgba(5,150,105,.06)),
    rgba(18,20,24,.9) !important;
  border-bottom-color:rgba(125,211,252,.12) !important;
}

body.about-page main{
  position:relative;
  overflow:hidden;
  isolation:isolate;
}

body.about-page main::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:-2;
  pointer-events:none;
  background:
    radial-gradient(circle at 7% 13%,rgba(2,132,199,.11),transparent 27%),
    radial-gradient(circle at 92% 17%,rgba(212,175,55,.10),transparent 25%),
    radial-gradient(circle at 18% 76%,rgba(5,150,105,.075),transparent 28%),
    radial-gradient(circle at 82% 80%,rgba(0,242,254,.055),transparent 28%),
    linear-gradient(150deg,#121418 0%,#101923 47%,#121418 100%);
}

.about-section{
  position:relative;
  padding:clamp(72px,7vw,112px) 0;
}

.about-section::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:.72;
  background-image:
    linear-gradient(rgba(226,232,240,.022) 1px,transparent 1px),
    linear-gradient(90deg,rgba(226,232,240,.022) 1px,transparent 1px);
  background-size:88px 88px;
  mask-image:linear-gradient(to bottom,transparent,rgba(0,0,0,.72) 18%,rgba(0,0,0,.72) 82%,transparent);
}

.about-eyebrow{
  display:inline-flex;
  align-items:center;
  gap:10px;
  margin-bottom:18px;
  color:var(--m2a-sky-soft);
  font-family:'Inter','Cairo',sans-serif;
  font-size:12px;
  font-weight:800;
  letter-spacing:.13em;
  text-transform:uppercase;
}

.about-eyebrow::before{
  content:"";
  width:34px;
  height:2px;
  border-radius:99px;
  background:linear-gradient(90deg,var(--about-cyan),var(--about-gold));
  box-shadow:0 0 16px rgba(0,242,254,.24);
}

.about-title{
  margin:0;
  color:var(--m2a-heading);
  font-size:clamp(36px,5.15vw,72px);
  font-weight:900;
  line-height:1.08;
  letter-spacing:-.035em;
  text-wrap:balance;
}
html[dir="rtl"] .about-title{letter-spacing:-.02em}

.about-lead{
  max-width:760px;
  margin-top:24px;
  color:var(--m2a-muted) !important;
  font-size:clamp(17px,1.6vw,21px);
  line-height:1.95;
}

.about-hero{
  min-height:min(900px,100vh);
  display:flex;
  align-items:center;
  padding-top:clamp(140px,13vw,188px);
  padding-bottom:clamp(70px,8vw,110px);
}

.about-hero::after{
  content:"";
  position:absolute;
  width:min(56vw,780px);
  aspect-ratio:1;
  inset-inline-end:-18vw;
  top:3%;
  border-radius:50%;
  pointer-events:none;
  filter:blur(16px);
  background:conic-gradient(from 90deg,rgba(212,175,55,.14),rgba(2,132,199,.12),rgba(0,242,254,.08),rgba(5,150,105,.10),rgba(212,175,55,.14));
  opacity:.55;
}

.about-hero-grid{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:minmax(0,1.02fr) minmax(390px,.98fr);
  align-items:center;
  gap:clamp(42px,6vw,86px);
}

.about-hero-copy,.about-hero-visual{min-width:0}
.about-hero-actions,.about-cta-actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:32px}

.about-hero-facts{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
  margin-top:34px;
}

.about-fact,
.about-glass,
.about-sector-card,
.about-tech-item,
.about-os-screen{
  border:1px solid rgba(226,232,240,.10);
  background:linear-gradient(145deg,rgba(28,34,45,.78),rgba(18,24,32,.62));
  backdrop-filter:blur(18px) saturate(122%);
  box-shadow:0 24px 76px rgba(0,0,0,.27),inset 0 1px 0 rgba(255,255,255,.035);
}

.about-fact{padding:17px 18px;border-radius:20px}
.about-fact strong{display:block;margin-bottom:3px;color:var(--m2a-gold-soft);font-family:'Inter','Cairo',sans-serif;font-size:clamp(21px,2.4vw,30px);line-height:1.1}
.about-fact span{color:var(--m2a-muted);font-size:12px;font-weight:700}

.about-hero-frame{
  position:relative;
  overflow:hidden;
  aspect-ratio:3/2;
  border:1px solid rgba(212,175,55,.28);
  border-radius:38px;
  background:#171D26;
  box-shadow:0 40px 110px rgba(0,0,0,.42),0 0 50px rgba(2,132,199,.06);
}

.about-hero-frame img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  filter:saturate(.9) contrast(1.03) brightness(.86);
}

.about-hero-frame::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,rgba(18,20,24,.02),rgba(18,20,24,.72)),linear-gradient(125deg,rgba(2,132,199,.13),transparent 40%,rgba(212,175,55,.10));
}

.about-hero-caption{
  position:absolute;
  z-index:2;
  inset-inline:24px;
  bottom:22px;
  padding:18px 20px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:20px;
  background:rgba(18,20,24,.68);
  backdrop-filter:blur(18px) saturate(125%);
}
.about-hero-caption small{display:block;color:var(--m2a-sky-soft);font-weight:800;letter-spacing:.1em}
.about-hero-caption strong{display:block;margin-top:5px;color:var(--m2a-heading);font-size:18px}
.about-spectrum{position:absolute;z-index:3;width:58%;height:7px;inset-inline-start:8%;bottom:-3px;border-radius:99px;background:linear-gradient(90deg,var(--about-gold),var(--about-blue),var(--about-cyan),var(--about-emerald),var(--about-violet));box-shadow:0 0 28px rgba(0,242,254,.20)}

.about-section-head{
  position:relative;
  z-index:1;
  max-width:850px;
  margin:0 auto 46px;
  text-align:center;
}

.about-section-head h2,.about-copy h2,.about-os-copy h2,.about-governance-copy h2{
  margin:0;
  color:var(--m2a-heading);
  font-size:clamp(31px,4vw,52px);
  line-height:1.2;
  font-weight:900;
  text-wrap:balance;
}

.about-section-head p,.about-copy p,.about-os-copy p,.about-governance-copy p{
  color:var(--m2a-muted) !important;
  font-size:16px;
  line-height:1.9;
}
.about-section-head p{margin:16px auto 0;max-width:760px}

.about-identity-grid{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);
  gap:28px;
  align-items:stretch;
}
.about-copy-card{padding:clamp(28px,4vw,48px);border-radius:32px}
.about-copy-card p{margin-top:18px}
.about-principles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}

.about-principle{
  position:relative;
  overflow:hidden;
  min-height:190px;
  padding:25px;
  border-radius:26px;
  transition:transform 280ms var(--m2a-ease),border-color 180ms var(--m2a-ease),box-shadow 280ms var(--m2a-ease);
}
.about-principle::before{content:"";position:absolute;width:130px;height:130px;inset-inline-end:-50px;top:-54px;border-radius:50%;background:var(--principle-glow,rgba(56,189,248,.18));filter:blur(14px)}
.about-principle b{position:relative;display:block;margin-bottom:10px;color:var(--m2a-heading);font-size:19px}
.about-principle p{position:relative;margin:0;color:var(--m2a-muted)!important;font-size:14px;line-height:1.8}

.about-sectors{background:radial-gradient(circle at 12% 24%,rgba(2,132,199,.07),transparent 26%),radial-gradient(circle at 87% 75%,rgba(5,150,105,.06),transparent 28%)}
.about-sector-grid{position:relative;z-index:1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}

.about-sector-card{
  position:relative;
  overflow:hidden;
  min-height:240px;
  padding:28px;
  border-radius:28px;
  border-color:rgba(226,232,240,.10);
  background:radial-gradient(circle at 90% 10%,color-mix(in srgb,var(--sector-color) 14%,transparent),transparent 34%),linear-gradient(145deg,rgba(28,34,45,.82),rgba(17,24,32,.70));
  transition:transform 280ms var(--m2a-ease),border-color 180ms var(--m2a-ease),box-shadow 280ms var(--m2a-ease);
}
.about-sector-card::after{content:"";position:absolute;inset-inline:26px;bottom:0;height:2px;opacity:.65;background:linear-gradient(90deg,transparent,var(--sector-color),transparent);box-shadow:0 0 18px color-mix(in srgb,var(--sector-color) 32%,transparent)}
.about-sector-icon{display:grid;width:52px;height:52px;place-items:center;margin-bottom:24px;border:1px solid rgba(226,232,240,.12);border-radius:17px;color:var(--sector-color);background:rgba(28,34,45,.72)}
.about-sector-icon svg{width:27px;height:27px;stroke:currentColor;stroke-width:1.7}
.about-sector-card small{display:block;margin-bottom:7px;color:var(--sector-color);font-family:'Inter','Cairo',sans-serif;font-size:11px;font-weight:800;letter-spacing:.09em}
.about-sector-card h3{margin:0 0 10px;color:var(--m2a-heading);font-size:21px;line-height:1.35}
.about-sector-card p{margin:0;color:var(--m2a-muted)!important;font-size:14px;line-height:1.75}

.about-os{background:radial-gradient(circle at 75% 35%,rgba(0,242,254,.075),transparent 30%),radial-gradient(circle at 18% 65%,rgba(212,175,55,.07),transparent 30%)}
.about-os-grid{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,.88fr) minmax(420px,1.12fr);gap:clamp(34px,5vw,72px);align-items:center}
.about-os-copy p{margin-top:18px}
.about-tech-list{display:grid;gap:12px;margin-top:28px}
.about-tech-item{display:grid;grid-template-columns:44px minmax(0,1fr);gap:13px;align-items:center;padding:15px 16px;border-radius:18px}
.about-tech-item i{display:grid;width:42px;height:42px;place-items:center;border-radius:14px;color:var(--m2a-sky-soft);background:rgba(56,189,248,.09);border:1px solid rgba(56,189,248,.18);font-style:normal;font-weight:900}
.about-tech-item b{display:block;color:var(--m2a-heading);font-size:14px}
.about-tech-item span{display:block;margin-top:2px;color:var(--m2a-muted);font-size:12px;line-height:1.55}

.about-os-screen{position:relative;padding:14px;border-radius:30px;border-color:rgba(0,242,254,.17);background:linear-gradient(145deg,rgba(28,34,45,.82),rgba(12,18,25,.92));box-shadow:0 34px 100px rgba(0,0,0,.38),0 0 42px rgba(0,242,254,.055)}
.about-os-screen img{width:100%;height:auto;max-height:680px;object-fit:contain;border-radius:20px;background:#0D131A}
.about-os-status{display:flex;align-items:center;gap:9px;width:max-content;max-width:calc(100% - 28px);margin:14px 0 0 auto;padding:10px 13px;border:1px solid rgba(56,189,248,.18);border-radius:999px;color:var(--m2a-muted-strong);background:rgba(18,24,32,.78);font-size:12px;font-weight:800}
html[dir="rtl"] .about-os-status{margin-left:auto;margin-right:0}
.about-os-status i{width:8px;height:8px;border-radius:50%;background:var(--about-cyan);box-shadow:0 0 16px rgba(0,242,254,.62)}

.about-governance-grid{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);gap:28px;align-items:start}
.about-governance-copy{position:sticky;top:130px;padding:36px;border-radius:30px}
.about-governance-copy p{margin-top:17px}
.about-governance-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}
.about-governance-card{min-height:205px;padding:26px;border-radius:25px;transition:transform 280ms var(--m2a-ease),border-color 180ms var(--m2a-ease),box-shadow 280ms var(--m2a-ease)}
.about-governance-card span{display:inline-grid;width:42px;height:42px;place-items:center;margin-bottom:18px;border-radius:14px;color:var(--m2a-gold-soft);background:rgba(212,175,55,.10);border:1px solid rgba(212,175,55,.18);font-family:'Inter',sans-serif;font-weight:900}
.about-governance-card h3{margin:0 0 9px;color:var(--m2a-heading);font-size:19px}
.about-governance-card p{margin:0;color:var(--m2a-muted)!important;font-size:13.5px;line-height:1.75}

.about-operating-line{position:relative;z-index:1;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin-top:44px}
.about-operating-step{position:relative;padding:22px 18px;border-radius:22px;text-align:center}
.about-operating-step::after{content:"";position:absolute;top:50%;inset-inline-end:-13px;width:14px;height:1px;background:linear-gradient(90deg,var(--m2a-gold),var(--m2a-sky))}
html[dir="rtl"] .about-operating-step::after{transform:scaleX(-1)}
.about-operating-step:last-child::after{display:none}
.about-operating-step b{display:block;color:var(--m2a-heading);font-size:14px}
.about-operating-step small{display:block;margin-top:5px;color:var(--m2a-muted);font-size:11px;line-height:1.55}

.about-cta{position:relative;z-index:1;overflow:hidden;padding:clamp(34px,5vw,58px);border:1px solid rgba(212,175,55,.22);border-radius:36px;text-align:center;background:radial-gradient(circle at 12% 12%,rgba(2,132,199,.13),transparent 32%),radial-gradient(circle at 88% 86%,rgba(5,150,105,.10),transparent 32%),linear-gradient(145deg,rgba(28,34,45,.88),rgba(15,21,29,.91));box-shadow:0 35px 105px rgba(0,0,0,.36),inset 0 1px 0 rgba(255,255,255,.04)}
.about-cta h2{margin:0;color:var(--m2a-heading);font-size:clamp(29px,4vw,48px);line-height:1.2}
.about-cta p{max-width:720px;margin:15px auto 0;color:var(--m2a-muted)!important;font-size:16px;line-height:1.85}
.about-cta-actions{justify-content:center;margin-top:27px}

@media (hover:hover) and (pointer:fine){
  .about-sector-card:hover,.about-principle:hover,.about-governance-card:hover{
    transform:translate3d(0,-6px,0);
    border-color:rgba(212,175,55,.28);
    box-shadow:0 32px 92px rgba(0,0,0,.34),0 0 28px rgba(56,189,248,.055);
  }
}

@media(max-width:1100px){
  .about-hero-grid{grid-template-columns:minmax(0,1fr) minmax(340px,.8fr);gap:42px}
  .about-sector-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .about-os-grid{grid-template-columns:1fr}
  .about-os-screen{max-width:920px;margin-inline:auto;width:100%}
}

@media(max-width:900px){
  .about-hero{min-height:auto;padding-top:132px}
  .about-hero-grid,.about-identity-grid,.about-governance-grid{grid-template-columns:1fr}
  .about-hero-visual{max-width:720px;width:100%;margin-inline:auto}
  .about-governance-copy{position:relative;top:auto}
  .about-operating-line{grid-template-columns:repeat(3,minmax(0,1fr))}
  .about-operating-step::after{display:none}
}

@media(max-width:700px){
  .about-section{padding:64px 0}
  .about-hero{padding-top:116px}
  .about-title{font-size:clamp(34px,10vw,52px)}
  .about-hero-facts{grid-template-columns:1fr}
  .about-principles,.about-governance-cards{grid-template-columns:1fr}
  .about-sector-grid{grid-template-columns:1fr}
  .about-sector-card{min-height:auto;padding:24px}
  .about-operating-line{grid-template-columns:1fr 1fr}
  .about-hero-frame{border-radius:28px}
  .about-copy-card,.about-governance-copy{padding:27px;border-radius:26px}
}

@media(max-width:430px){
  .about-section{padding:54px 0}
  .about-hero{padding-top:106px}
  .about-hero-actions,.about-cta-actions{display:grid;grid-template-columns:1fr}
  .about-hero-actions .btn,.about-cta-actions .btn{width:100%}
  .about-operating-line{grid-template-columns:1fr}
  .about-os-screen{padding:8px;border-radius:22px}
  .about-os-screen img{border-radius:15px}
}

@media(prefers-reduced-motion:reduce){
  .about-sector-card,.about-principle,.about-governance-card{transition:none!important}
  .about-sector-card:hover,.about-principle:hover,.about-governance-card:hover{transform:none!important}
}