
.oq-page{
--bg:#030816;
--bg2:#06142b;
--card:rgba(8,25,55,.72);
--text:#f7fbff;
--muted:#9db2cf;
--line:rgba(47,170,255,.2);
--blue:#087cff;
--cyan:#00d9ff;
--shadow:0 20px 70px rgba(0,102,255,.18);
font-family:'Noto Kufi Arabic','Inter',sans-serif;
background:var(--bg);
color:var(--text);
overflow:hidden;
transition:.3s
}

.oq-page.light{
--bg:#f6faff;
--bg2:#eaf4ff;
--card:rgba(255,255,255,.82);
--text:#071326;
--muted:#53657d;
--line:rgba(0,105,220,.16);
--shadow:0 20px 60px rgba(0,75,160,.12)
}

.oq-page *{box-sizing:border-box}

.oq-wrap{
width:min(1180px,92%);
margin:auto
}

.oq-nav{
position:sticky;
top:0;
z-index:50;
background:rgba(3,8,22,.74);
backdrop-filter:blur(18px);
border-bottom:1px solid var(--line)
}

.light .oq-nav{background:rgba(246,250,255,.8)}

.oq-navin{
height:78px;
display:flex;
align-items:center;
gap:24px
}

.oq-logo{
width:190px;
max-height:58px;
object-fit:contain
}

.oq-menu{
display:flex;
gap:22px;
margin-inline-start:auto
}

.oq-menu a,.oq-actions button{
color:var(--text) !important;
text-decoration:none;
font-size:13px
}

.oq-actions{display:flex;gap:9px}

.oq-actions button{
border:1px solid var(--line);
background:var(--card);
padding:9px 12px;
border-radius:999px;
cursor:pointer
}

/* HERO — replaced with isolated hero design */
/* =========================
   HERO BACKGROUND
   ========================= */

.oq-page .oq-hero{
  min-height:560px;
  display:grid;
  align-items:center;

  position:relative;
  overflow:hidden;
  isolation:isolate;

  border-bottom:1px solid rgba(0,200,245,.14);

  background:
    radial-gradient(
      ellipse at 75% 48%,
      rgba(0,200,245,.18),
      rgba(8,127,245,.09) 25%,
      transparent 52%
    ),
    radial-gradient(
      ellipse at 88% 18%,
      rgba(8,127,245,.12),
      transparent 34%
    ),
    linear-gradient(
      135deg,
      #06172d,
      #071a35 48%,
      #041326
    );
}


/* Particles */

.oq-page .oq-hero::before{
  content:"";

  position:absolute;
  z-index:-2;
  inset:-20%;

  pointer-events:none;
  opacity:.7;

  background:
    radial-gradient(
      circle at 12% 22%,
      rgba(255,255,255,.48) 0 1px,
      transparent 1.5px
    ),

    radial-gradient(
      circle at 31% 68%,
      rgba(0,200,245,.42) 0 1px,
      transparent 1.6px
    ),

    radial-gradient(
      circle at 71% 19%,
      rgba(255,255,255,.32) 0 1px,
      transparent 1.5px
    ),

    radial-gradient(
      circle at 89% 67%,
      rgba(8,127,245,.38) 0 1px,
      transparent 1.6px
    );

  background-size:
    190px 190px,
    250px 250px,
    310px 310px,
    370px 370px;

  animation:oqParticles 22s linear infinite;
}


/* Bottom futuristic rings */

.oq-page .oq-hero::after{
  content:"";

  position:absolute;
  z-index:-1;

  left:-12%;
  right:-12%;
  bottom:-43%;

  height:82%;

  pointer-events:none;
  opacity:.8;

  background:

    radial-gradient(
      ellipse at 50% 110%,
      transparent 0 43%,
      rgba(0,200,245,.14) 43.5% 45%,
      transparent 46%
    ),

    radial-gradient(
      ellipse at 50% 112%,
      transparent 0 53%,
      rgba(8,127,245,.16) 53.4% 55%,
      transparent 56%
    ),

    radial-gradient(
      ellipse at 50% 114%,
      transparent 0 63%,
      rgba(255,255,255,.07) 63.4% 64.3%,
      transparent 65%
    );

  animation:oqRibbon 18s ease-in-out infinite alternate;
}


/* =========================
   LIGHT MODE
   ========================= */

.oq-page.light .oq-hero{

  background:

    radial-gradient(
      ellipse at 75% 46%,
      rgba(56,166,255,.19),
      rgba(104,195,255,.09) 27%,
      transparent 51%
    ),

    radial-gradient(
      ellipse at 12% 18%,
      rgba(0,200,245,.08),
      transparent 38%
    ),

    linear-gradient(
      180deg,
      #fff,
      #F8FCFF 44%,
      #EEF7FF
    );
}


.oq-page.light .oq-hero::before{

  opacity:.22;

  background:

    radial-gradient(
      circle at 12% 22%,
      rgba(8,127,245,.48) 0 1px,
      transparent 1.5px
    ),

    radial-gradient(
      circle at 31% 68%,
      rgba(0,200,245,.44) 0 1px,
      transparent 1.6px
    ),

    radial-gradient(
      circle at 71% 19%,
      rgba(8,127,245,.28) 0 1px,
      transparent 1.5px
    ),

    radial-gradient(
      circle at 89% 67%,
      rgba(0,200,245,.36) 0 1px,
      transparent 1.6px
    );

  background-size:
    190px 190px,
    250px 250px,
    310px 310px,
    370px 370px;
}


.oq-page.light .oq-hero::after{

  opacity:.95;

  background:

    radial-gradient(
      ellipse at 50% 112%,
      transparent 0 43%,
      rgba(255,255,255,.96) 43.5% 45%,
      rgba(95,185,255,.20) 45.5% 47%,
      transparent 48%
    ),

    radial-gradient(
      ellipse at 50% 112%,
      transparent 0 52%,
      rgba(255,255,255,.92) 52.5% 54%,
      rgba(39,145,255,.13) 54.5% 56%,
      transparent 57%
    );
}


/* =========================
   HERO GRID
   ========================= */

.oq-page .oq-grid{

  position:relative;
  z-index:2;

  display:grid;

  grid-template-columns:
    .82fr
    1.18fr;

  align-items:center;

  gap:34px;

  min-height:560px;

  padding:44px 0;
}


/* Text left / 3D image right */

.oq-page .oq-grid > div:first-child{
  grid-column:1;
}

.oq-page .oq-grid > .oq-visual{
  grid-column:2;
  grid-row:1;
}


/* =========================
   KICKER
   ========================= */

.oq-page .oq-kicker{

  display:inline-flex;

  padding:7px 14px;

  border:
    1px solid
    rgba(0,200,245,.28);

  border-radius:999px;

  background:
    rgba(0,174,255,.07);

  color:
    var(--cyan) !important;

  font-size:12px;

  font-weight:700;

  backdrop-filter:
    blur(10px);
}


/* =========================
   HERO TITLE
   ========================= */

.oq-page .oq-hero h1{

  max-width:570px;

  font-size:
    clamp(
      40px,
      4.5vw,
      58px
    );

  line-height:1.28;

  margin:
    18px 0 16px;

  letter-spacing:-1.2px;

  color:
    var(--text) !important;
}


.oq-page .oq-gradient{

  background:
    linear-gradient(
      90deg,
      var(--blue),
      var(--cyan)
    );

  -webkit-background-clip:text;
  background-clip:text;

  -webkit-text-fill-color:
    transparent;

  color:
    transparent !important;
}


/* =========================
   DESCRIPTION
   ========================= */

.oq-page .oq-hero p{

  font-size:15px;

  line-height:2;

  color:
    var(--muted) !important;

  max-width:590px;

  margin:0;
}


/* =========================
   BUTTONS
   ========================= */

.oq-page .oq-btns{

  display:flex;

  gap:11px;

  margin-top:25px;

  flex-wrap:wrap;
}


.oq-page .oq-btn{

  display:inline-flex;

  align-items:center;
  justify-content:center;

  min-height:44px;

  padding:
    11px 20px;

  border-radius:999px;

  text-decoration:none !important;

  font-weight:700;

  font-size:13px;

  transition:.22s;
}


.oq-page .oq-btn:hover{

  transform:
    translateY(-2px);
}


.oq-page .oq-primary{

  background:
    linear-gradient(
      90deg,
      var(--blue),
      var(--cyan)
    );

  color:#fff !important;

  box-shadow:
    0 10px 28px
    rgba(0,157,255,.22);
}


.oq-page .oq-secondary{

  border:
    1px solid
    var(--line);

  color:
    var(--text) !important;

  background:
    rgba(8,26,51,.44);

  backdrop-filter:
    blur(12px);
}


.oq-page.light .oq-secondary{

  background:
    rgba(255,255,255,.66);
}


/* =========================
   3D IMAGE
   ========================= */

.oq-page .oq-visual{

  position:relative;

  width:100%;

  display:flex;

  align-items:center;
  justify-content:center;
}


.oq-page .oq-visual::before{

  content:"";

  position:absolute;

  width:78%;

  aspect-ratio:1;

  border-radius:50%;

  background:
    radial-gradient(
      circle,
      rgba(0,200,245,.18),
      rgba(8,127,245,.08) 43%,
      transparent 70%
    );

  filter:
    blur(12px);

  animation:
    oqGlow
    12s
    ease-in-out
    infinite;
}


.oq-page .oq-visual img{

  position:relative;

  z-index:2;

  width:100%;

  max-width:650px;

  height:auto;

  object-fit:contain;

  filter:
    drop-shadow(
      0 28px 46px
      rgba(0,140,255,.24)
    );
}

.oq-strip{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:12px;
margin-top:-45px;
position:relative;
z-index:2
}

.oq-mini,.oq-card{
border:1px solid var(--line);
background:var(--card);
backdrop-filter:blur(16px);
border-radius:22px;
box-shadow:var(--shadow)
}

.oq-mini{padding:22px}

.oq-mini b{
display:block;
font-size:16px;
margin:9px 0;
color:var(--text) !important;
}

.oq-icon{
font-size:27px;
color:var(--cyan) !important
}

.oq-section{padding:100px 0}

.oq-head{
max-width:760px;
margin:0 auto 45px;
text-align:center
}

.oq-head span{
color:var(--cyan) !important;
font-weight:700;
font-size:13px
}

/* FIX: ALL SECTION TITLES */
.oq-head h2{
font-size:clamp(30px,4vw,48px);
margin:12px 0;
color:var(--text) !important;
}

.oq-head p,.oq-card p{
color:var(--muted) !important;
line-height:1.9
}

.oq-cards{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:18px
}

.oq-card{
padding:28px;
transition:.25s;
color:var(--text);
}

.oq-card:hover{
transform:translateY(-7px);
border-color:rgba(0,217,255,.55)
}

.oq-card h3{
margin:14px 0 8px;
font-size:19px;
color:var(--text) !important;
}

/* PREVIOUS PROJECTS */
.oq-projects-showcase{
display:grid;
grid-template-columns:repeat(2,minmax(0,1fr));
gap:22px;
max-width:1000px;
margin:42px auto 0;
}

.oq-project-box{
position:relative;
overflow:hidden;
min-height:300px;
padding:34px;
border:1px solid var(--line);
border-radius:24px;
background:
radial-gradient(circle at 85% 15%,rgba(0,217,255,.10),transparent 32%),
linear-gradient(145deg,rgba(8,25,55,.90),rgba(5,15,36,.82));
box-shadow:var(--shadow);
transition:transform .28s ease,border-color .28s ease,box-shadow .28s ease;
}

.oq-page.light .oq-project-box{
background:
radial-gradient(circle at 85% 15%,rgba(0,145,255,.10),transparent 34%),
linear-gradient(145deg,rgba(255,255,255,.96),rgba(239,247,255,.92));
}

.oq-project-box:before{
content:'';
position:absolute;
width:180px;
height:180px;
border:1px solid rgba(0,217,255,.10);
border-radius:50%;
left:-80px;
bottom:-100px;
}

.oq-project-box:hover{
transform:translateY(-7px);
border-color:rgba(0,217,255,.55);
box-shadow:0 22px 60px rgba(0,126,255,.18);
}

.oq-project-symbol{
width:62px;
height:62px;
display:flex;
align-items:center;
justify-content:center;
margin-bottom:24px;
border:1px solid rgba(0,217,255,.28);
border-radius:18px;
background:rgba(0,174,255,.08);
color:var(--cyan);
font-size:30px;
font-weight:700;
}

.oq-project-box h3{
margin:0 0 13px;
font-size:24px;
color:var(--text) !important;
}

.oq-project-box p{
margin:0;
color:var(--muted) !important;
line-height:2;
font-size:15px;
}

.oq-project-link{
display:inline-flex;
align-items:center;
gap:8px;
margin-top:24px;
color:var(--cyan) !important;
font-size:14px;
font-weight:700;
text-decoration:none;
transition:gap .2s ease;
}

.oq-project-link:hover{gap:13px}

.oq-project-link .oq-arrow{
font-size:19px;
line-height:1;
}

@media(max-width:760px){
.oq-projects-showcase{grid-template-columns:1fr}
.oq-project-box{min-height:auto;padding:28px}
}

/* TECH STACK */
.oq-tech{
display:grid;
grid-template-columns:repeat(5,1fr);
gap:18px;
max-width:1050px;
margin:40px auto 0;
}

.oq-tech i{
font-style:normal;
border:1px solid var(--line);
background:var(--card);
min-height:135px;
padding:20px 10px;
border-radius:18px;
color:var(--text) !important;
display:flex;
flex-direction:column;
align-items:center;
justify-content:center;
gap:14px;
font-size:14px;
font-weight:700;
text-align:center;
transition:transform .25s ease,
           border-color .25s ease,
           box-shadow .25s ease;
}

.oq-tech i:hover{
transform:translateY(-6px);
border-color:rgba(0,217,255,.55);
box-shadow:0 15px 35px rgba(0,126,255,.14);
}

.oq-tech i img{
width:46px;
height:46px;
object-fit:contain;
display:block;
}

@media(max-width:980px){
.oq-tech{
grid-template-columns:repeat(3,1fr);
}
}

@media(max-width:600px){
.oq-tech{
grid-template-columns:repeat(2,1fr);
gap:12px;
}

.oq-tech i{
min-height:120px;
}
}
.oq-process{
display:grid;
grid-template-columns:repeat(7,1fr);
gap:10px
}

.oq-step{
padding:20px 14px;
border-top:2px solid var(--blue);
background:linear-gradient(180deg,rgba(0,126,255,.11),transparent);
border-radius:14px
}

.oq-step em{
font-style:normal;
color:var(--cyan) !important;
font-size:12px
}

.oq-step b{
display:block;
margin-top:10px;
font-size:14px;
color:var(--text) !important;
}

.oq-cta{
padding:65px;
border:1px solid var(--line);
border-radius:34px;
background:
radial-gradient(circle at 80% 20%,rgba(0,210,255,.2),transparent 34%),
linear-gradient(135deg,#06172f,var(--card));
text-align:center;
box-shadow:var(--shadow)
}

.light .oq-cta{
background:
radial-gradient(circle at 80% 20%,rgba(0,150,255,.14),transparent 34%),
#fff
}

.oq-cta h2{
font-size:clamp(30px,4vw,52px);
margin:0 0 14px;
color:var(--text) !important;
}

.oq-cta p{
color:var(--muted) !important;
}

.oq-contact{
display:grid;
grid-template-columns:1fr 1fr;
gap:20px
}

.oq-contact .oq-card a{
color:var(--cyan);
text-decoration:none
}

.oq-footer{
padding:40px 0;
border-top:1px solid var(--line);
color:var(--muted) !important;
font-size:13px
}

.oq-footerin{
display:flex;
justify-content:space-between;
gap:20px;
align-items:center
}

.oq-footer img{width:150px}

.en{display:none}

.oq-page.lang-en{direction:ltr}
.oq-page.lang-en .ar{display:none}
.oq-page.lang-en .en{display:initial}

.oq-page.lang-en div.en,
.oq-page.lang-en p.en,
.oq-page.lang-en h1.en,
.oq-page.lang-en h2.en,
.oq-page.lang-en h3.en,
.oq-page.lang-en span.en{
display:block
}

.oq-page.lang-en .oq-menu{
margin-left:auto;
margin-right:0
}

@media(max-width:980px){
.oq-menu{display:none}

.oq-grid{
grid-template-columns:1fr;
text-align:center;
padding:70px 0
}

.oq-hero p{margin:auto}
.oq-btns{justify-content:center}

.oq-visual{
max-width:500px;
margin:auto
}

.oq-strip{
grid-template-columns:1fr 1fr;
margin-top:0
}

.oq-cards{grid-template-columns:1fr 1fr}
.oq-process{grid-template-columns:repeat(2,1fr)}
.oq-contact{grid-template-columns:1fr}
}

@media(max-width:600px){
.oq-navin{height:68px}
.oq-logo{width:140px}
.oq-actions button{padding:7px 9px}
.oq-hero{min-height:auto}
.oq-grid{padding:60px 0}
.oq-hero h1{font-size:40px}
.oq-strip,.oq-cards,.oq-process{grid-template-columns:1fr}
.oq-section{padding:70px 0}
.oq-cta{padding:38px 20px}

.oq-footerin{
flex-direction:column;
text-align:center
}
}


.oq-page{--bg:#061225;--bg2:#081a33;--card:rgba(7,26,53,.86);--text:#f7fafc;--muted:#b8c7da;--line:rgba(0,200,245,.24);--blue:#087ff5;--cyan:#00c8f5;--shadow:0 18px 55px rgba(0,95,210,.13);background-color:var(--bg);background-image:radial-gradient(circle at 12% 18%,rgba(255,255,255,.34) 0 1px,transparent 1.5px),radial-gradient(circle at 82% 34%,rgba(0,200,245,.24) 0 1px,transparent 1.6px),radial-gradient(circle at 58% 72%,rgba(255,255,255,.22) 0 1px,transparent 1.5px);background-size:170px 170px,230px 230px,290px 290px}
.oq-page.light{--bg:#f7fafc;--bg2:#eef7ff;--card:#fff;--text:#071a35;--muted:#5f7188;--line:rgba(8,127,245,.18);--shadow:0 15px 45px rgba(8,70,130,.08);background-image:none}
.oq-page .oq-wrap{width:min(1180px,92%)}
.oq-page .oq-hero{min-height:610px;background:radial-gradient(circle at 78% 43%,rgba(0,200,245,.15),transparent 30%),linear-gradient(180deg,rgba(6,18,37,.22),var(--bg));border-bottom:1px solid var(--line)}
.oq-page.light .oq-hero{background:radial-gradient(circle at 74% 45%,rgba(8,127,245,.12),transparent 33%),linear-gradient(180deg,#fff,#f4faff)}
.oq-page .oq-grid{grid-template-columns:.9fr 1.1fr;gap:46px}
.oq-page .oq-hero h1{font-size:clamp(42px,5.1vw,68px);line-height:1.18}
.oq-page .oq-visual img{max-height:500px;object-fit:contain;animation:none}
.oq-page .oq-strip{margin-top:-34px;gap:14px}
.oq-page .oq-mini{padding:18px 20px;border-radius:16px;box-shadow:none}
.oq-page .oq-section{padding:76px 0}
.oq-page .oq-head{margin-bottom:34px}
.oq-page .oq-head h2{font-size:clamp(28px,3.2vw,40px)}
.oq-page .oq-cards{gap:16px}
.oq-page .oq-card{border-radius:16px;padding:24px;box-shadow:none;background:linear-gradient(145deg,rgba(9,30,60,.92),rgba(6,21,44,.88))}
.oq-page.light .oq-card{background:linear-gradient(145deg,#fff,#f3f9ff)}
.oq-page .oq-card:hover{transform:translateY(-4px);box-shadow:0 14px 35px rgba(0,126,255,.10)}
.oq-page .oq-projects-showcase{max-width:none;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.oq-page .oq-project-box{min-height:260px;border-radius:16px;padding:28px;box-shadow:none}
.oq-page .oq-tech{grid-template-columns:repeat(5,1fr);gap:12px;max-width:1000px}
.oq-page .oq-tech i{min-height:110px;border-radius:14px;background:rgba(7,26,53,.75);box-shadow:none}
.oq-page.light .oq-tech i{background:#fff}
.oq-page .oq-tech i img{width:38px;height:38px}
.oq-page .oq-cta{padding:46px 28px;border-radius:18px;box-shadow:none}
.oq-page .oq-contact{gap:16px}
.oq-page .oq-primary{background:linear-gradient(90deg,#087ff5,#00c8f5);box-shadow:0 9px 24px rgba(0,154,245,.18)}
.oq-page .oq-btn{padding:12px 20px}
@media(max-width:980px){.oq-page .oq-grid{grid-template-columns:1fr;padding:60px 0}.oq-page .oq-tech{grid-template-columns:repeat(3,1fr)}}
@media(max-width:600px){.oq-page .oq-section{padding:58px 0}.oq-page .oq-tech{grid-template-columns:repeat(2,1fr)}.oq-page .oq-projects-showcase{grid-template-columns:1fr}}


/* Arabic typography closer to the supplied reference */
.oq-page{
  font-family:'Tajawal','Noto Kufi Arabic','IBM Plex Sans Arabic','Inter',sans-serif;
}
.oq-page .oq-hero h1,
.oq-page .oq-hero p,
.oq-page .oq-kicker,
.oq-page .oq-btn{
  font-family:'Tajawal','Noto Kufi Arabic','IBM Plex Sans Arabic','Inter',sans-serif;
}
.oq-page .oq-hero h1{
  font-weight:500;
  letter-spacing:0;
}
.oq-page .oq-hero p{font-weight:400}
.oq-page .oq-kicker{font-weight:600}

/* Keep the desktop hero unchanged; fix only tablet/mobile composition */
@media(max-width:980px){
  .oq-page .oq-hero{
    min-height:auto;
  }

  .oq-page .oq-grid{
    grid-template-columns:1fr !important;
    grid-template-rows:auto auto !important;
    gap:24px !important;
    min-height:auto !important;
    padding:54px 0 48px !important;
    text-align:center;
  }

  .oq-page .oq-grid > div:first-child{
    grid-column:1 !important;
    grid-row:1 !important;
    width:100%;
    max-width:720px;
    margin-inline:auto;
  }

  .oq-page .oq-grid > .oq-visual{
    grid-column:1 !important;
    grid-row:2 !important;
    width:100%;
    max-width:620px !important;
    margin:4px auto 0 !important;
  }

  .oq-page .oq-hero h1,
  .oq-page .oq-hero p{
    max-width:680px;
    margin-inline:auto;
  }

  .oq-page .oq-btns{justify-content:center}
}

/* Phone: prevent the narrow right-hand column seen in the screenshots */
@media(max-width:600px){
  .oq-page .oq-hero{
    min-height:auto !important;
    overflow:hidden;
  }

  .oq-page .oq-hero .oq-wrap{
    width:min(100% - 34px,560px) !important;
  }

  .oq-page .oq-grid{
    display:flex !important;
    flex-direction:column !important;
    gap:22px !important;
    padding:38px 0 34px !important;
    text-align:center !important;
  }

  .oq-page .oq-grid > div:first-child{
    order:1;
    width:100% !important;
    max-width:none !important;
  }

  .oq-page .oq-grid > .oq-visual{
    order:2;
    width:100% !important;
    max-width:430px !important;
    margin:0 auto !important;
  }

  .oq-page .oq-kicker{
    display:inline-flex !important;
    width:auto !important;
    max-width:92%;
    padding:8px 14px;
    font-size:11.5px;
    line-height:1.75;
    white-space:normal;
  }

  .oq-page .oq-hero h1{
    width:100% !important;
    max-width:100% !important;
    margin:18px auto 14px !important;
    font-size:clamp(35px,10.5vw,46px) !important;
    line-height:1.32 !important;
    text-align:center !important;
    overflow-wrap:normal;
    word-break:normal;
  }

  .oq-page .oq-gradient{
    display:inline !important;
  }

  .oq-page .oq-hero p{
    width:100% !important;
    max-width:520px !important;
    margin:0 auto !important;
    padding:0 3px;
    font-size:14px !important;
    line-height:2 !important;
    text-align:center !important;
  }

  .oq-page .oq-btns{
    justify-content:center !important;
    margin-top:22px !important;
  }

  .oq-page .oq-visual img{
    display:block;
    width:100% !important;
    max-width:430px !important;
    max-height:none !important;
    height:auto !important;
    margin:0 auto;
    object-fit:contain;
  }

  .oq-page .oq-visual::before{
    width:88%;
  }
}

/* Extra-small phones */
@media(max-width:390px){
  .oq-page .oq-hero .oq-wrap{
    width:calc(100% - 28px) !important;
  }
  .oq-page .oq-hero h1{
    font-size:34px !important;
  }
  .oq-page .oq-hero p{
    font-size:13.5px !important;
  }
}

/* Divi-native component adapters */
.oq-page {--bg:#061225;--bg2:#081a33;--card:rgba(7,26,53,.86);--text:#f7fafc;--muted:#b8c7da;--line:rgba(0,200,245,.24);--blue:#087ff5;--cyan:#00c8f5;--shadow:0 18px 55px rgba(0,95,210,.13);background-color:var(--bg)!important;color:var(--text);font-family:Tajawal,'Noto Kufi Arabic',sans-serif;}
.oq-page.light {--bg:#f7fafc;--bg2:#eef7ff;--card:#fff;--text:#071a35;--muted:#5f7188;--line:rgba(8,127,245,.18);--shadow:0 15px 45px rgba(8,70,130,.08);}
.oq-page .et_pb_row{max-width:1180px;width:92%;}
.oq-page .et_pb_text,.oq-page .et_pb_text_inner,.oq-page h1,.oq-page h2,.oq-page h3{color:var(--text)!important;}
.oq-page p{color:var(--muted)!important;line-height:1.9;}
.oq-page .en{display:none!important}.oq-page.lang-en .ar{display:none!important}.oq-page.lang-en .en{display:block!important}.oq-page.lang-en{direction:ltr}.oq-page:not(.lang-en){direction:rtl}
.oq-page .oq-head{text-align:center;max-width:760px;margin:0 auto 34px}.oq-page .oq-head h2{font-size:clamp(28px,3.2vw,40px);margin:12px 0}.oq-page .oq-head span{color:var(--cyan)}
.oq-page .oq-card,.oq-page .oq-mini,.oq-page .oq-tech-item{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:24px;height:100%;transition:transform .25s,border-color .25s;}
.oq-page .oq-card:hover,.oq-page .oq-tech-item:hover{transform:translateY(-5px);border-color:var(--cyan)}
.oq-page .oq-card h3{font-size:19px;margin:14px 0 8px}.oq-page .oq-card .oq-icon{font-size:27px;color:var(--cyan)}
.oq-page .oq-tech-item{text-align:center;min-height:110px}.oq-page .oq-tech-item img{display:block;width:38px;height:38px;object-fit:contain;margin:0 auto 12px}
.oq-page .oq-hero-title h1{font-size:clamp(42px,5.1vw,68px);line-height:1.18;font-weight:500}.oq-page .oq-gradient{background:linear-gradient(90deg,var(--blue),var(--cyan));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.oq-page.oq-hero{min-height:610px;background:radial-gradient(circle at 78% 43%,rgba(0,200,245,.15),transparent 30%),linear-gradient(180deg,#06172d,var(--bg))!important;}
.oq-page.light.oq-hero{background:radial-gradient(circle at 74% 45%,rgba(8,127,245,.12),transparent 33%),linear-gradient(180deg,#fff,#f4faff)!important}
.oq-page .oq-grid{display:flex;align-items:center;gap:4%;min-height:560px}.oq-page .oq-grid:after{display:none}.oq-page .oq-grid .et_pb_column{margin:0!important}.oq-page .oq-visual img{max-height:500px;object-fit:contain;filter:drop-shadow(0 28px 46px rgba(0,140,255,.24))}
.oq-page .oq-native-btn{display:inline-block;margin:12px 10px 0 0}.oq-page .oq-native-btn .et_pb_button{border-radius:99px!important;font-size:14px!important;padding:10px 22px!important}.oq-page .oq-primary .et_pb_button{background:linear-gradient(90deg,#087ff5,#00c8f5)!important;border:0!important;color:white!important}.oq-page .oq-secondary .et_pb_button{background:var(--card)!important;border:1px solid var(--line)!important;color:var(--text)!important}
.oq-page .oq-kicker{display:inline-block;color:var(--cyan)!important;border:1px solid var(--line);border-radius:99px;padding:7px 14px;background:rgba(0,174,255,.07)}
.oq-page.oq-section{padding:76px 0!important}.oq-page.oq-tech-section,.oq-page#projects{background:linear-gradient(180deg,var(--bg),var(--bg2),var(--bg))!important}
.oq-page .oq-cta-copy{text-align:center}.oq-page.oq-cta-section{text-align:center}.oq-page .oq-cta-copy h2{font-size:clamp(30px,4vw,52px)}
@media(max-width:980px){.oq-page .oq-grid{display:flex;flex-direction:column;min-height:auto;text-align:center}.oq-page .oq-grid .et_pb_column{width:100%!important;margin-bottom:20px!important}.oq-page .oq-tech .et_pb_column{width:18%!important;margin:1%!important}}
@media(max-width:767px){.oq-page .oq-grid{padding:35px 0}.oq-page .oq-hero-title h1{font-size:clamp(35px,10.5vw,46px)}.oq-page .oq-tech .et_pb_column{width:48%!important;margin:1%!important}.oq-page.oq-section{padding:58px 0!important}.oq-page .oq-cards .et_pb_column,.oq-page .oq-contact .et_pb_column{margin-bottom:16px!important}}
