@media (max-width: 768px) {
  /* === MOBILE TYPOGRAPHY FINAL LOCK === */
  h1, .hero-title, [class*="hero"] h1, .contact-page-title,
  .home-page .home-hero h1 {
    font-size: 24px !important; line-height: 30px !important; font-weight: 700 !important;
  }
  h2, [class*="section-title"], [class*="content-title"],
  .home-section-title, .about-section-title, .impact-section-title,
  .midan-section-title, .services-page h2, .about-mini-heading,
  .about-mini-heading span, .ko-site-cta__title {
    font-size: 18px !important; line-height: 28px !important; font-weight: 700 !important;
  }
  h3, [class*="card"] h3, [class*="item"] h3, [class*="panel"] h3,
  .home-metric-item h3, .impact-model-card h3, .about-card h3,
  .services-core-item h3, #key-metrics .home-metric-item h3 {
    font-size: 16px !important; line-height: 24px !important; font-weight: 700 !important;
  }
  p, [class*="card"] p, [class*="item"] p, [class*="panel"] p,
  .home-metric-item p, blockquote.about-quote p,
  .about-recommendations-slider .about-quote p,
  blockquote.about-quote footer,
  .about-recommendations-slider .about-quote footer {
    font-size: 12px !important; line-height: 20px !important; font-weight: 400 !important;
  }
}
@media (max-width:767px){
html[lang="ar"] .home-hero-content,html[dir="rtl"] .home-hero-content{order:1!important;}
html[lang="ar"] .home-hero-image,html[dir="rtl"] .home-hero-image,html[lang="ar"] .home-hero-portrait,html[dir="rtl"] .home-hero-portrait{order:2!important;}
.about-page .hero h1,.about-page .hero p,.about-hero h1,.about-hero p{text-align:center!important;margin-inline:auto!important;}
}
@media (min-width:768px){
.about-page .about-actions,.about-page .hero-actions{order:1!important;}
.about-page .about-biography-text,.about-page .hero-description{order:2!important;}
}
@media (min-width:1024px){
.services-page h1{max-width:12ch!important;margin-inline:auto!important;line-height:1.2!important;}
}
.contact-page h1{color:#bf9125!important;}
.contact-page .hero-eyebrow,.contact-page .hero-kicker,.contact-page .hero-subtitle-tag,.contact-page .section-eyebrow{display:none!important;}
/* الرئيسية: في العربية على الموبايل النص قبل الصورة */
@media (max-width:767px){
  html[dir="rtl"] .home-page .home-hero-grid,
  body[dir="rtl"] .home-page .home-hero-grid,
  .home-page .home-hero-grid{
    display:flex !important;
    flex-direction:column !important;
  }
  html[dir="rtl"] .home-page .home-hero-copy,
  body[dir="rtl"] .home-page .home-hero-copy,
  .home-page .home-hero-copy{
    order:1 !important;
  }
  html[dir="rtl"] .home-page .home-hero-portrait,
  body[dir="rtl"] .home-page .home-hero-portrait,
  .home-page .home-hero-portrait{
    order:2 !important;
  }
}

/* من أنا: الأزرار قبل الفقرة على الكمبيوتر بعد نقلها في HTML */
@media (min-width:768px){
  .about-page .about-editorial-copy,
  .about-premium .about-editorial-copy{
    display:flex !important;
    flex-direction:column !important;
  }
  .about-page .about-editorial-copy .about-cta-row,
  .about-premium .about-editorial-copy .about-cta-row{
    order:0 !important;
    margin:0 0 22px !important;
  }
  .about-page .about-editorial-copy > p,
  .about-premium .about-editorial-copy > p{
    order:1 !important;
  }
}

/* الخدمات: عنوان الهيرو سطرين على الكمبيوتر */
@media (min-width:768px){
  .services-page .services-hero-copy h1,
  .services-page .services-hero-title-v29{
    max-width:none !important;
    width:auto !important;
    white-space:normal !important;
    text-align:inherit !important;
  }
  .services-page .services-hero-title-v29 span{
    display:block !important;
  }
}

/* تواصل: لون عنوان الهيرو وإخفاء الوسم أعلى الهيرو */
.contact-page-title,
#contact .contact-page-title,
main #contact h1.contact-page-title{
  color:#bf9125 !important;
}
#contact .eyebrow,
#contact .contact-kicker:first-child,
.contact-kicker{
  display:none !important;
}
/* الرئيسية: موبايل عربي — النص أولاً ثم الصورة مباشرة، بدون نزول زائد */
@media (max-width:767px){
  html[dir="rtl"] .home-page .home-hero-grid,
  body[dir="rtl"] .home-page .home-hero-grid{
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap:18px !important;
  }

  html[dir="rtl"] .home-page .home-hero-copy,
  body[dir="rtl"] .home-page .home-hero-copy{
    order:1 !important;
    margin-bottom:0 !important;
  }

  html[dir="rtl"] .home-page .home-hero-portrait,
  body[dir="rtl"] .home-page .home-hero-portrait{
    order:2 !important;
    margin-top:0 !important;
    padding-top:0 !important;
  }

  html[dir="rtl"] .home-page .home-hero-portrait img,
  body[dir="rtl"] .home-page .home-hero-portrait img{
    max-height:260px !important;
    width:auto !important;
    margin:0 auto !important;
    object-fit:contain !important;
  }
}

/* من أنا: الموبايل يرجع كما كان — الأزرار تحت الصورة */
@media (max-width:767px){
  .about-premium .about-biography-portrait .about-cta-row{
    display:flex !important;
  }

  .about-premium .about-editorial-copy .about-cta-row-desktop{
    display:none !important;
  }
}

/* من أنا: الكمبيوتر — نسخة الأزرار داخل النص قبل الفقرة، والأزرار الأصلية تحت الصورة مخفية */
@media (min-width:768px){
  .about-premium .about-biography-portrait > .about-cta-row{
    display:none !important;
  }

  .about-premium .about-editorial-copy{
    display:block !important;
  }

  .about-premium .about-editorial-copy .about-cta-row-desktop{
    display:flex !important;
    justify-content:center !important;
    gap:14px !important;
    margin:0 auto 22px !important;
  }
}

/* الخدمات: عنوان الهيرو سطرين على الكمبيوتر فقط */
@media (min-width:1024px){
  .services-page .services-hero-copy h1{
    max-width:620px !important;
    text-align:inherit !important;
    line-height:1.18 !important;
  }
  .services-page .services-hero-title-v29 span{
    display:block !important;
  }
}

/* تواصل: لون العنوان وإخفاء الوسم أعلى الهيرو */
.contact-page-title,
#contact .contact-page-title,
main #contact h1.contact-page-title{
  color:#bf9125 !important;
}

#contact .eyebrow,
#contact .section-head .eyebrow,
main #contact .eyebrow.reveal{
  display:none !important;
}
/* من أنا - الكمبيوتر: توسيط الأزرار في وسط الشاشة */
@media (min-width:768px){
  .about-premium .about-editorial-copy .about-cta-row-desktop,
  .about-page .about-editorial-copy .about-cta-row-desktop{
    width:100vw !important;
    max-width:100vw !important;
    margin-inline:calc(50% - 50vw) !important;
    display:flex !important;
    justify-content:center !important;
    align-items:center !important;
    gap:14px !important;
    text-align:center !important;
  }
}

/* الرئيسية - الموبايل فقط */
@media (max-width:767px){
  .home-page .home-hero{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    min-height:calc(100svh - 96px) !important;
    text-align:center !important;
  }

  html[dir="rtl"] .home-page .home-hero-grid,
  body[dir="rtl"] .home-page .home-hero-grid,
  .home-page .home-hero-grid{
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
    gap:18px !important;
    text-align:center !important;
  }

  .home-page .home-hero-copy{
    order:1 !important;
    width:100% !important;
    text-align:center !important;
    margin:0 auto !important;
  }

  .home-page .home-hero-copy h1,
  .home-page .home-hero-copy h1 span{
    text-align:center !important;
  }

  .home-page .home-lead{
    font-style:normal !important;
    font-weight:400 !important;
    font-size:18px !important;
    line-height:27px !important;
    text-align:center !important;
    margin-inline:auto !important;
    max-width:34ch !important;
  }

  .home-page .home-hero-portrait{
    order:2 !important;
    width:100% !important;
    display:flex !important;
    justify-content:center !important;
    align-items:center !important;
    margin:0 auto !important;
  }

  .home-page .home-hero-portrait img{
    content:url('/shared/images/profile/for-mobile.webp') !important;
    max-height:300px !important;
    width:auto !important;
    max-width:82vw !important;
    object-fit:contain !important;
    object-position:center bottom !important;
    margin:0 auto !important;
  }
}
@media (min-width:1024px){
  .home-lead{
    font-style:normal !important;
    font-weight:400 !important;
    font-size:24px !important;
    line-height:36px !important;
  }
}
@media (min-width:1024px){
  .mobile-section-desc{
    font-style:normal !important;
    font-weight:400 !important;
    font-size:16px !important;
    line-height:24px !important;
  }
}
@media (min-width:1024px){

  .mobile-section-desc,
  .home-section-head p,
  .about-section-head p,
  .services-section-head p,
  .impact-section-head p,
  .midan-section-head p{
    font-style:normal !important;
    font-weight:400 !important;
    font-size:16px !important;
    line-height:24px !important;
  }
}
@media (min-width:1024px){
  .about-premium .about-overview,
  .about-page .about-overview{
    padding-bottom:96px !important;
  }

  .about-premium .about-editorial-grid,
  .about-page .about-editorial-grid{
    row-gap:48px !important;
    align-items:start !important;
  }

  .about-premium .about-inline-numbers-grid,
  .about-page .about-inline-numbers-grid{
    overflow:visible !important;
    align-items:stretch !important;
    margin-bottom:72px !important;
  }

  .about-premium .about-inline-numbers-grid .about-card,
  .about-page .about-inline-numbers-grid .about-card{
    min-height:132px !important;
    height:auto !important;
    overflow:visible !important;
    padding-bottom:22px !important;
  }

  .about-premium .about-card h3,
  .about-page .about-card h3{
    line-height:1.15 !important;
  }

  .about-premium .about-card p,
  .about-page .about-card p{
    line-height:22px !important;
    overflow:visible !important;
  }

  .about-premium .about-philosophy-section,
  .about-premium .about-work-philosophy,
  .about-premium #work-philosophy,
  .about-page .about-philosophy-section,
  .about-page .about-work-philosophy,
  .about-page #work-philosophy{
    clear:both !important;
    margin-top:96px !important;
    padding-top:48px !important;
    position:relative !important;
    z-index:1 !important;
  }
}
@media (max-width:767px){
  .home-page #key-metrics,
  .home-page .home-metrics-band-section{
    background:var(--bg) !important;
    color:var(--text) !important;
  }
  .home-page #key-metrics .home-section-title,
  .home-page #key-metrics h2,
  .home-page .home-metrics-band-section .home-section-title{
    color:var(--gold) !important;
  }
  .home-page #key-metrics .mobile-section-desc,
  .home-page .home-metrics-band-section .mobile-section-desc{
    color:var(--muted) !important;
  }
  .home-page #key-metrics .home-metrics-band,
  .home-page .home-metrics-band-section .home-metrics-band{
    background:transparent !important;
    border-color:rgba(var(--gold-rgb),.18) !important;
  }
  .home-page #key-metrics .home-metric-item,
  .home-page .home-metrics-band-section .home-metric-item{
    background:var(--card-bg) !important;
    border:1px solid rgba(var(--gold-rgb),.18) !important;
    color:var(--text) !important;
  }
  .home-page #key-metrics .home-metric-item h3{color:var(--gold) !important;}
  .home-page #key-metrics .home-metric-item p{color:var(--muted) !important;}
}

.about-premium .about-btn-secondary,
.about-page .about-btn-secondary{
  background:transparent !important;
  color:var(--gold) !important;
  border:1px solid rgba(var(--gold-rgb),.36) !important;
}
.about-premium .about-btn-secondary:hover,
.about-page .about-btn-secondary:hover{
  background:rgba(var(--gold-rgb),.08) !important;
  color:var(--gold-dark) !important;
  border-color:rgba(var(--gold-rgb),.48) !important;
}

@media (min-width:768px){
  html[dir="rtl"] .about-premium .about-editorial-copy,
  html[dir="rtl"] .about-page .about-editorial-copy{
    display:block !important;
  }
  html[dir="rtl"] .about-premium .about-editorial-copy .about-cta-row-desktop,
  html[dir="rtl"] .about-page .about-editorial-copy .about-cta-row-desktop{
    position:static !important;
    transform:none !important;
    width:auto !important;
    max-width:none !important;
    margin:0 auto 26px !important;
    display:flex !important;
    justify-content:center !important;
    align-items:center !important;
    gap:14px !important;
  }
  html[dir="rtl"] .about-premium .about-editorial-copy > p,
  html[dir="rtl"] .about-page .about-editorial-copy > p{
    margin-top:0 !important;
    clear:both !important;
  }
}

.services-page #core-services .ko-service-card,
.services-page .ko-service-card,
.services-page #core-services .services-core-item,
.services-page .services-core-item,
.services-page #core-services .services-card-face,
.services-page .services-card-face,
.services-page #core-services .services-card-front,
.services-page .services-card-front{
  background:var(--card-bg) !important;
  color:var(--text) !important;
  border-color:rgba(var(--gold-rgb),.18) !important;
}
.services-page #core-services .ko-service-card h3,
.services-page .ko-service-card h3,
.services-page #core-services .services-core-item h3,
.services-page .services-core-item h3{
  color:var(--gold) !important;
}
.services-page #core-services .ko-service-card p,
.services-page .ko-service-card p,
.services-page #core-services .services-core-item p,
.services-page .services-core-item p{
  color:var(--muted) !important;
}
.services-page #core-services .ko-service-icon,
.services-page .ko-service-icon,
.services-page #core-services .services-core-icon,
.services-page .services-core-icon{
  color:var(--gold) !important;
  background:transparent !important;
}
html[data-theme="dark"] .services-page #core-services .ko-service-card,
body[data-theme="dark"] .services-page #core-services .ko-service-card,
html[data-theme="dark"] .services-page .ko-service-card,
body[data-theme="dark"] .services-page .ko-service-card,
html[data-theme="dark"] .services-page #core-services .services-card-face,
body[data-theme="dark"] .services-page #core-services .services-card-face{
  background:linear-gradient(135deg, rgba(18,18,18,.96), rgba(10,10,10,.98)) !important;
  border-color:rgba(var(--gold-rgb),.24) !important;
}
html[data-theme="light"] .services-page #core-services .ko-service-card,
body[data-theme="light"] .services-page #core-services .ko-service-card,
html[data-theme="light"] .services-page .ko-service-card,
body[data-theme="light"] .services-page .ko-service-card{
  background:linear-gradient(180deg, rgba(255,255,255,.96), rgba(248,246,241,.98)) !important;
}
/* Strong fix: key metrics cards on mobile/dark must not stay white */
@media (max-width:767px){
  html[data-theme="dark"] #key-metrics .home-metrics-band > .home-metric-item,
  html[data-theme="dark"] #key-metrics .home-metrics-band > .home-metric-item.reveal,
  html[data-theme="dark"] #key-metrics .home-metrics-band > .home-metric-item.visible,
  body[data-theme="dark"] #key-metrics .home-metrics-band > .home-metric-item,
  body[data-theme="dark"] #key-metrics .home-metrics-band > .home-metric-item.reveal,
  body[data-theme="dark"] #key-metrics .home-metrics-band > .home-metric-item.visible{
    background:#15130f !important;
    background-color:#15130f !important;
    background-image:none !important;
    border:1px solid rgba(var(--gold-rgb),.28) !important;
    color:var(--text) !important;
    box-shadow:none !important;
  }

  html[data-theme="dark"] #key-metrics .home-metrics-band > .home-metric-item h3,
  body[data-theme="dark"] #key-metrics .home-metrics-band > .home-metric-item h3{
    color:var(--gold) !important;
  }

  html[data-theme="dark"] #key-metrics .home-metrics-band > .home-metric-item p,
  body[data-theme="dark"] #key-metrics .home-metrics-band > .home-metric-item p{
    color:rgba(255,255,255,.72) !important;
  }

  html[data-theme="light"] #key-metrics .home-metrics-band > .home-metric-item,
  html[data-theme="light"] #key-metrics .home-metrics-band > .home-metric-item.reveal,
  html[data-theme="light"] #key-metrics .home-metrics-band > .home-metric-item.visible,
  body[data-theme="light"] #key-metrics .home-metrics-band > .home-metric-item,
  body[data-theme="light"] #key-metrics .home-metrics-band > .home-metric-item.reveal,
  body[data-theme="light"] #key-metrics .home-metrics-band > .home-metric-item.visible{
    background:#fffdf8 !important;
    background-color:#fffdf8 !important;
    background-image:none !important;
    border:1px solid rgba(var(--gold-rgb),.20) !important;
  }
}

/* About RTL desktop: prevent CTA buttons from overlapping hero/intro text */
@media (min-width:768px){
  html[dir="rtl"] .about-premium .about-editorial-copy .about-cta-row,
  html[dir="rtl"] .about-page .about-editorial-copy .about-cta-row,
  html[dir="rtl"] .about-premium .about-editorial-copy .about-cta-row-desktop,
  html[dir="rtl"] .about-page .about-editorial-copy .about-cta-row-desktop{
    position:relative !important;
    inset:auto !important;
    top:auto !important;
    right:auto !important;
    bottom:auto !important;
    left:auto !important;
    transform:none !important;

    width:100% !important;
    max-width:100% !important;
    margin:60px auto 0 !important;

    display:flex !important;
    justify-content:center !important;
    align-items:center !important;
    gap:14px !important;
    clear:both !important;
    z-index:1 !important;
  }

  html[dir="rtl"] .about-premium .about-editorial-copy,
  html[dir="rtl"] .about-page .about-editorial-copy{
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
  }

  html[dir="rtl"] .about-premium .about-editorial-copy > p,
  html[dir="rtl"] .about-page .about-editorial-copy > p,
  html[dir="rtl"] .about-premium .about-editorial-copy .about-bio,
  html[dir="rtl"] .about-page .about-editorial-copy .about-bio{
    order:1 !important;
    margin-bottom:0 !important;
  }

  html[dir="rtl"] .about-premium .about-editorial-copy .about-cta-row,
  html[dir="rtl"] .about-page .about-editorial-copy .about-cta-row,
  html[dir="rtl"] .about-premium .about-editorial-copy .about-cta-row-desktop,
  html[dir="rtl"] .about-page .about-editorial-copy .about-cta-row-desktop
}

/* If the CTA sits in the portrait column, hide only duplicate desktop RTL version there */
@media (min-width:768px){
  html[dir="rtl"] .about-premium .about-biography-portrait > .about-cta-row,
  html[dir="rtl"] .about-page .about-biography-portrait > .about-cta-row{
    display:none !important;
  }
}