/* OMC Shell 3.2.4 — reference typography + two-level header refresh.
 * Typography values are taken from the user-supplied dr-amrelgazzar workbook.
 * Brand colors remain OMC. No font files are bundled.
 */
:root{
  --omc-green:#0E4434;
  --omc-gold:#B17A4A;
  --omc-sand:#F7F2EC;
  --omc-ink:#14261F;
  --omc-green-10:#E6EEEA;
  --omc-gold-light:#DEAC75;
  --omc-font:"Almarai",sans-serif;
  --omc-font-latin:system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  --omc-reference-system-font:system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
}

/* =========================================================
   SITE-WIDE TYPOGRAPHY
   Reference values: H2 32/38.4/500, H3 18/21.6/600,
   paragraph 15/26/400, menu 16/20/600. Page-title banner H1 is
   corrected to the supplied inspected value: Almarai Bold 40/40.
   The locked homepage keeps its approved Elementor hero sizes.
   ========================================================= */
body.omc-site,
body.omc-site .elementor,
body.omc-site input,
body.omc-site select,
body.omc-site textarea,
body.omc-site button{
  font-family:var(--omc-font)!important;
}
body.omc-site{
  font-size:15px;
  line-height:26px;
  color:var(--omc-ink);
}
body.omc-site main h1{
  font-family:var(--omc-font)!important;
}
/* Keep the already-approved homepage hero geometry/scale intact. */
body.omc-site:not(.home) main h2{
  font-family:var(--omc-font)!important;
  font-size:32px!important;
  font-weight:500!important;
  line-height:38.4px!important;
}
body.omc-site:not(.home) main h3{
  font-family:var(--omc-font)!important;
  font-size:18px!important;
  font-weight:600!important;
  line-height:21.6px!important;
}
body.omc-site:not(.home) main p{
  font-family:var(--omc-font)!important;
  font-size:15px!important;
  font-weight:400!important;
  line-height:26px!important;
}
body.omc-site main .elementor-widget-text-editor li,
body.omc-site main .omc-rich-content li{
  font-family:var(--omc-reference-system-font)!important;
  font-size:16px!important;
  font-weight:400!important;
  line-height:24px!important;
}
body.omc-site main .elementor-widget-text-editor a:not(.elementor-button),
body.omc-site main .omc-rich-content a:not(.elementor-button){
  font-family:var(--omc-reference-system-font)!important;
  font-size:16px!important;
  font-weight:400!important;
  line-height:24px!important;
}
/* CTA dimensions were not supplied in the reference workbook: family only, no invented global size. */
body.omc-site .elementor-button,
body.omc-site .omc-button,
body.omc-site input[type="submit"],
body.omc-site button{
  font-family:var(--omc-font)!important;
}

/* =========================================================
   TOP INFORMATION BAR — same structure as the supplied visual
   ========================================================= */
.omc-topbar{
  width:100%;
  background:var(--omc-green);
  color:#fff;
  font-family:var(--omc-font);
  position:relative;
  z-index:101;
}
.omc-topbar *{box-sizing:border-box}
.omc-topbar__inner{
  width:min(1720px,100%);
  min-height:56px;
  margin-inline:auto;
  padding-inline:26px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:0;
}
.omc-topbar__item{
  min-height:56px;
  display:inline-flex;
  align-items:center;
  gap:9px;
  padding-inline:22px;
  color:#fff;
  text-decoration:none;
  font-family:var(--omc-font);
  font-size:14px;
  font-weight:700;
  line-height:20px;
  white-space:nowrap;
}
.omc-topbar a.omc-topbar__item:hover{color:var(--omc-gold-light);text-decoration:none}
.omc-topbar__item .omc-icon{width:21px;height:21px;color:var(--omc-gold-light)}
.omc-topbar__email{border-inline-start:1px solid rgba(255,255,255,.62)}
.omc-topbar__address{
  flex:1 1 auto;
  justify-content:center;
  min-width:0;
  border-inline-start:1px solid rgba(255,255,255,.62);
}
.omc-topbar__address>span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.omc-topbar__left{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
  padding-inline-start:18px;
  flex:0 0 auto;
}
.omc-topbar__phone{padding-inline:0 10px}
.omc-topbar__socials{display:flex;align-items:center;gap:10px;direction:ltr}
.omc-topbar__socials a{
  width:38px;
  height:38px;
  border-radius:50%;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:var(--omc-green);
  background:var(--omc-gold-light);
  text-decoration:none;
  transition:transform .16s ease,background-color .16s ease,color .16s ease;
}
.omc-topbar__socials a:hover{background:#fff;color:var(--omc-green);transform:translateY(-1px)}
.omc-topbar__socials .omc-icon{width:19px;height:19px;color:currentColor;stroke-width:1.9}
.omc-topbar a:focus-visible{outline:3px solid #fff;outline-offset:2px}

/* =========================================================
   MAIN HEADER / NAV — geometry mirrors supplied reference
   ========================================================= */
.omc-header{
  background:var(--omc-sand)!important;
  border-bottom:0!important;
  box-shadow:none!important;
}
.omc-header__row{
  width:min(1280px,100%)!important;
  min-height:118px!important;
  margin-inline:auto!important;
  padding:18px 28px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:42px!important;
}
.omc-brand{gap:16px!important;flex:0 0 auto!important;color:var(--omc-green)!important}
.omc-brand__mark{width:72px!important;height:76px!important}
.omc-brand__image{
  width:auto!important;
  height:auto!important;
  max-width:340px!important;
  max-height:88px!important;
  object-fit:contain!important;
}
.omc-brand__name{
  font-family:var(--omc-font)!important;
  font-size:24px!important;
  line-height:30px!important;
  font-weight:700!important;
  color:var(--omc-green)!important;
}
.omc-brand__descriptor{
  font-family:var(--omc-font)!important;
  font-size:13px!important;
  line-height:22px!important;
  font-weight:400!important;
  color:rgba(20,38,31,.68)!important;
}
.omc-navigation{margin-inline-start:auto!important;flex:0 1 auto!important}
.omc-navigation>.omc-menu{gap:30px!important}
.omc-navigation a,
.omc-navigation .omc-menu-label,
.omc-navigation>.omc-menu>li>a,
.omc-navigation>.omc-menu>li>.omc-menu-label{
  font-family:var(--omc-font)!important;
  font-size:16px!important;
  font-weight:600!important;
  line-height:20px!important;
  color:var(--omc-green)!important;
  min-height:36px!important;
}
.omc-navigation>.omc-menu>li>a::after,
.omc-navigation>.omc-menu>li>.omc-menu-label::after{display:none!important}
.omc-navigation a:hover,
.omc-navigation>.omc-menu>li:hover>a,
.omc-navigation>.omc-menu>li:hover>.omc-menu-label,
.omc-navigation :is(.current-menu-item,.current-menu-ancestor,.omc-current-page,.omc-current-section)>a{
  color:var(--omc-gold)!important;
  text-decoration:none!important;
}
/* Booking stays in the nav position but uses the previously approved gold CTA shape. */
.omc-navigation>.omc-menu>li.omc-booking-menu-item>a{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:52px!important;
  padding:13px 26px!important;
  border-radius:8px!important;
  background:var(--omc-gold)!important;
  color:#fff!important;
  font-size:19px!important;
  font-weight:700!important;
  line-height:1.35!important;
  text-decoration:none!important;
  white-space:nowrap!important;
  transition:box-shadow .16s ease!important;
}
.omc-navigation>.omc-menu>li.omc-booking-menu-item>a:hover,
.omc-navigation>.omc-menu>li.omc-booking-menu-item>a:focus-visible,
.omc-navigation>.omc-menu>li.omc-booking-menu-item.omc-current-page>a,
.omc-navigation>.omc-menu>li.omc-booking-menu-item.current-menu-item>a{
  background:var(--omc-gold)!important;
  color:#fff!important;
  box-shadow:inset 0 0 0 2px rgba(255,255,255,.60)!important;
}
.omc-submenu-toggle{color:var(--omc-green)!important}
.omc-navigation .sub-menu{
  top:calc(100% + 16px)!important;
  background:#fff!important;
  border:0!important;
  border-radius:4px!important;
  box-shadow:0 10px 26px rgba(20,38,31,.14)!important;
  padding:8px!important;
}
.omc-navigation .sub-menu a{
  font-family:var(--omc-font)!important;
  font-size:15px!important;
  line-height:24px!important;
  font-weight:600!important;
  color:var(--omc-green)!important;
  min-height:42px!important;
  padding:8px 12px!important;
}
.omc-navigation .sub-menu a:hover{
  background:var(--omc-green)!important;
  color:#fff!important;
}
.omc-navigation .sub-menu .omc-services-all>a{color:var(--omc-green)!important}
.omc-navigation .sub-menu .omc-services-all>a:hover{color:#fff!important}

/* =========================================================
   PAGE TITLE BANNER — supplied OMC hospital image + dark overlay
   ========================================================= */
.omc-template-hero{
  width:100%!important;
  min-height:260px!important;
  padding:72px 0!important;
  display:flex!important;
  align-items:center!important;
  background-image:linear-gradient(rgba(20,38,31,.64),rgba(20,38,31,.64)),url("https://orthomisr.com/wp-content/uploads/2026/09/abstract-blur-beautiful-luxury-hospital-clinic-interior-background-1.webp")!important;
  background-position:center!important;
  background-size:cover!important;
  background-repeat:no-repeat!important;
}
.omc-template-hero .omc-template-wrap{text-align:center}
body.omc-site main .omc-template-hero h1,
.omc-template-hero h1{
  margin:0 auto 18px!important;
  max-width:1000px!important;
  color:#fff!important;
  text-align:center!important;
  font-family:var(--omc-font)!important;
  font-size:40px!important;
  line-height:40px!important;
  font-weight:700!important;
}
.omc-template-hero .omc-breadcrumbs,
.omc-template-hero .omc-breadcrumbs ol{
  justify-content:center!important;
  text-align:center!important;
  color:rgba(255,255,255,.9)!important;
  font-family:var(--omc-font)!important;
}
.omc-template-hero .omc-breadcrumbs{font-size:14px!important;line-height:24px!important}
.omc-template-hero .omc-breadcrumbs a{color:#fff!important}
.omc-template-hero .omc-breadcrumbs a:hover{color:var(--omc-gold-light)!important}

/* Ensure content-template typography remains the exact supplied reference measurements. */
.omc-rich-content h2,.omc-service-booking__copy h2,.omc-template-section-head h2{
  font-family:var(--omc-font)!important;font-size:32px!important;font-weight:500!important;line-height:38.4px!important
}
.omc-rich-content h3,.omc-service-card__title,.omc-side-card__head h2{
  font-family:var(--omc-font)!important;font-size:18px!important;font-weight:600!important;line-height:21.6px!important
}
.omc-rich-content p,.omc-service-booking__copy p,.omc-side-card__head p,.omc-cf7-wrap .wpcf7 p,.omc-cf7-wrap .wpcf7 label{
  font-family:var(--omc-font)!important;font-size:15px!important;font-weight:400!important;line-height:26px!important
}

/* =========================================================
   TABLET / MOBILE
   ========================================================= */
@media(max-width:1023px){
  .omc-topbar__inner{min-height:44px;padding-inline:14px;justify-content:center;gap:18px}
  .omc-topbar__item{min-height:44px;padding-inline:0;font-size:12px;line-height:18px}
  .omc-topbar__item .omc-icon{width:18px;height:18px}
  .omc-topbar__address{display:none}
  .omc-topbar__email{border:0}
  .omc-topbar__left{padding:0;gap:12px}
  .omc-topbar__socials{display:none}

  .omc-header__row{
    width:100%!important;
    min-height:74px!important;
    padding:11px 18px!important;
    gap:14px!important;
  }
  .omc-brand{gap:10px!important}
  .omc-brand__mark{width:42px!important;height:45px!important}
  .omc-brand__image{max-width:190px!important;max-height:52px!important}
  .omc-brand__name{font-size:17px!important;line-height:22px!important}
  .omc-brand__descriptor{display:none!important}
  .omc-menu-toggle{
    font-family:var(--omc-font)!important;
    font-size:16px!important;
    font-weight:600!important;
    line-height:20px!important;
    color:var(--omc-green)!important;
  }
  .omc-navigation{
    background:var(--omc-sand)!important;
    padding:8px 18px 14px!important;
    box-shadow:0 10px 24px rgba(20,38,31,.10)!important;
  }
  .omc-navigation>.omc-menu>li>a,.omc-navigation>.omc-menu>li>.omc-menu-label{
    font-size:16px!important;font-weight:600!important;line-height:20px!important;min-height:48px!important
  }
  .omc-navigation>.omc-menu>li.omc-booking-menu-item{padding:10px 0 4px!important;border-bottom:0!important}
  .omc-navigation>.omc-menu>li.omc-booking-menu-item>a{
    width:100%!important;min-height:48px!important;padding:11px 18px!important;font-size:16px!important;line-height:24px!important
  }
  .omc-navigation .sub-menu{background:#fff!important;box-shadow:none!important;border-radius:0!important;padding:5px 12px 9px!important}
  .omc-navigation .sub-menu a{font-size:15px!important;line-height:24px!important}

  .omc-template-hero{min-height:210px!important;padding:54px 0!important}
}
@media(max-width:560px){
  .omc-topbar__email{display:none}
  .omc-topbar__inner{justify-content:center}
  .omc-topbar__phone{padding:0}
  .omc-brand__image{max-width:150px!important;max-height:48px!important}
  .omc-template-hero{min-height:190px!important;padding:46px 0!important}
}

@media print{
  .omc-topbar{display:none!important}
}
