/* USys Marketing v1B — Production Brand Finalization */

/* ---------- IBM Plex Sans ---------- */
@font-face{
  font-family:"IBM Plex Sans";
  src:url("/assets/fonts/IBMPlexSans-Regular.woff2") format("woff2");
  font-style:normal;
  font-weight:400;
  font-display:swap;
}
@font-face{
  font-family:"IBM Plex Sans";
  src:url("/assets/fonts/IBMPlexSans-Medium.woff2") format("woff2");
  font-style:normal;
  font-weight:500;
  font-display:swap;
}
@font-face{
  font-family:"IBM Plex Sans";
  src:url("/assets/fonts/IBMPlexSans-SemiBold.woff2") format("woff2");
  font-style:normal;
  font-weight:600;
  font-display:swap;
}
@font-face{
  font-family:"IBM Plex Sans";
  src:url("/assets/fonts/IBMPlexSans-Bold.woff2") format("woff2");
  font-style:normal;
  font-weight:700;
  font-display:swap;
}

/* ---------- IBM Plex Sans Arabic ---------- */
@font-face{
  font-family:"IBM Plex Sans Arabic";
  src:url("/assets/fonts/IBMPlexSansArabic-Regular.woff2") format("woff2");
  font-style:normal;
  font-weight:400;
  font-display:swap;
}
@font-face{
  font-family:"IBM Plex Sans Arabic";
  src:url("/assets/fonts/IBMPlexSansArabic-Medium.woff2") format("woff2");
  font-style:normal;
  font-weight:500;
  font-display:swap;
}
@font-face{
  font-family:"IBM Plex Sans Arabic";
  src:url("/assets/fonts/IBMPlexSansArabic-SemiBold.woff2") format("woff2");
  font-style:normal;
  font-weight:600;
  font-display:swap;
}
@font-face{
  font-family:"IBM Plex Sans Arabic";
  src:url("/assets/fonts/IBMPlexSansArabic-Bold.woff2") format("woff2");
  font-style:normal;
  font-weight:700;
  font-display:swap;
}

/* ---------- Language-specific typography ---------- */
html[lang^="ar"] body,
body[dir="rtl"]{
  font-family:"IBM Plex Sans Arabic","IBM Plex Sans",system-ui,sans-serif;
  font-weight:400;
  line-height:1.78;
}

html[lang^="en"] body,
body[dir="ltr"]{
  font-family:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  font-weight:400;
  line-height:1.65;
}

button,input,textarea,select{
  font-family:inherit;
}

/* Arabic must not use Latin-style negative tracking */
body[dir="rtl"] h1,
body[dir="rtl"] h2,
body[dir="rtl"] h3,
body[dir="rtl"] .eyebrow,
body[dir="rtl"] .nav-links{
  letter-spacing:0 !important;
}

/* ---------- Professional weight hierarchy ---------- */
.nav-links{font-weight:600}
.btn{font-weight:600}
.lang{font-weight:600}
.eyebrow{font-weight:600}
.field label{font-weight:600}
.footer-title{font-weight:600}
.link-arrow{font-weight:600}
.preview-badge{font-weight:600}
.feature-index{font-weight:600}

h1,h2,h3,strong{
  font-weight:600;
}

.hero h1,
.page-hero h1{
  font-weight:700;
}

body[dir="rtl"] .hero h1{
  line-height:1.16;
}

body[dir="ltr"] .hero h1{
  line-height:1.06;
}

/* ---------- Logo integrity ---------- */
.brand{
  display:inline-flex;
  align-items:center;
  flex-shrink:0;
  overflow:visible;
}

.brand img{
  width:auto !important;
  height:42px !important;
  max-width:190px !important;
  max-height:none !important;
  object-fit:contain !important;
  object-position:center !important;
  overflow:visible !important;
}

.hero-card .logo{
  display:block;
  width:auto !important;
  height:52px !important;
  max-width:240px !important;
  max-height:none !important;
  object-fit:contain !important;
  object-position:center !important;
  overflow:visible !important;
}

.footer-logo{
  display:block;
  width:auto !important;
  height:44px !important;
  max-width:210px !important;
  max-height:none !important;
  object-fit:contain !important;
  object-position:center !important;
  overflow:visible !important;
}

/* ---------- Refinement ---------- */
.nav{height:80px}
.nav-links{font-size:.92rem}
.btn{border-radius:10px}
.card p,
.feature-row p,
.section-head p,
.content-prose p,
.content-prose li{
  font-weight:400;
}

@media(max-width:620px){
  .brand img{
    height:36px !important;
    max-width:160px !important;
  }

  .hero h1{
    font-size:2.45rem;
  }

  body[dir="rtl"] .hero h1{
    line-height:1.2;
  }
}

/* ---------- Corporate attribution ---------- */
.usys-corporate-attribution{
  width:min(1180px,calc(100% - 40px));
  margin:28px auto 0;
  padding-top:20px;
  border-top:1px solid rgba(255,255,255,.10);
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
  font-size:.82rem;
  font-weight:400;
  color:#9fb4aa;
}

.usys-corporate-attribution strong{
  font-weight:600;
  color:#d8e4de;
}

.usys-corporate-attribution .sep{
  opacity:.55;
}

@media(max-width:620px){
  .usys-corporate-attribution{
    width:calc(100% - 28px);
    align-items:flex-start;
  }
}

/* ============================================================
   USys Marketing v1B — FINAL PRODUCTION VISUAL FIX
   ============================================================ */

html,
body{
  overflow-x:hidden;
}

/* ---------- Brand lockup integrity ---------- */

.site-header{
  overflow:visible !important;
}

.nav{
  min-height:82px !important;
  height:auto !important;
  overflow:visible !important;
}

.brand{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  flex:0 0 auto !important;
  overflow:visible !important;
  line-height:0 !important;
  padding:3px 0 !important;
}

.brand img{
  display:block !important;
  width:176px !important;
  height:auto !important;
  max-width:none !important;
  max-height:none !important;
  object-fit:contain !important;
  object-position:center !important;
  overflow:visible !important;
  padding:6px 8px !important;
  box-sizing:content-box !important;
  clip-path:none !important;
}

.hero-card{
  overflow:visible !important;
}

.hero-card .logo{
  display:block !important;
  width:230px !important;
  height:auto !important;
  max-width:100% !important;
  max-height:none !important;
  object-fit:contain !important;
  object-position:center !important;
  overflow:visible !important;
  padding:7px 8px !important;
  box-sizing:content-box !important;
  clip-path:none !important;
}

.footer-logo{
  display:block !important;
  width:184px !important;
  height:auto !important;
  max-width:none !important;
  max-height:none !important;
  object-fit:contain !important;
  object-position:center !important;
  overflow:visible !important;
  padding:6px 8px !important;
  box-sizing:content-box !important;
  clip-path:none !important;
  filter:none !important;
}

/* ---------- Typography ---------- */

html[lang^="ar"] body,
body[dir="rtl"]{
  font-family:"IBM Plex Sans Arabic","IBM Plex Sans",system-ui,sans-serif !important;
  line-height:1.78;
}

html[lang^="en"] body,
body[dir="ltr"]{
  font-family:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",sans-serif !important;
}

.nav-links{
  font-weight:600 !important;
}

.btn,
.lang{
  font-weight:600 !important;
}

.hero h1{
  font-weight:700 !important;
}

body[dir="rtl"] .hero h1{
  font-size:clamp(2.75rem,4vw,4.25rem) !important;
  line-height:1.17 !important;
  letter-spacing:0 !important;
  max-width:700px !important;
}

body[dir="ltr"] .hero h1{
  font-size:clamp(2.85rem,4.25vw,4.55rem) !important;
  line-height:1.06 !important;
}

/* ---------- More controlled spacing ---------- */

.section{
  padding:82px 0 !important;
}

main > .section:last-child{
  padding-bottom:58px !important;
}

footer{
  margin-top:0 !important;
  padding-top:58px !important;
}

.footer-bottom{
  margin-top:36px !important;
}

.cta{
  margin-bottom:0 !important;
}

.quote-band{
  overflow:hidden;
}

/* ---------- Security/legal notice ---------- */

.notice{
  font-size:.9rem !important;
  line-height:1.75 !important;
  font-weight:400 !important;
  opacity:.86;
}

/* ---------- Corporate attribution ---------- */

.usys-corporate-attribution{
  margin-top:22px !important;
  padding-top:18px !important;
  line-height:1.6 !important;
}

.usys-corporate-attribution strong{
  font-weight:600 !important;
}

/* ---------- Mobile ---------- */

@media(max-width:620px){
  .nav{
    min-height:72px !important;
  }

  .brand img{
    width:148px !important;
    padding:5px 6px !important;
  }

  .hero-card .logo{
    width:195px !important;
  }

  .footer-logo{
    width:165px !important;
  }

  body[dir="rtl"] .hero h1{
    font-size:2.35rem !important;
    line-height:1.22 !important;
  }

  body[dir="ltr"] .hero h1{
    font-size:2.45rem !important;
  }

  .section{
    padding:64px 0 !important;
  }
}

/* ============================================================
   USys FULL BRAND LOCKUP
   Approved identity:
   Symbol + USys + PEOPLE CONNECT PROGRESS
   ============================================================ */

/* ---------- Header ---------- */

.brand{
  display:inline-flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:center !important;
  gap:4px !important;
  overflow:visible !important;
  line-height:1 !important;
  padding:5px 6px !important;
}

.brand img{
  display:block !important;
  width:176px !important;
  height:auto !important;
  max-width:none !important;
  max-height:none !important;
  object-fit:contain !important;
  object-position:center !important;
  padding:0 !important;
  margin:0 !important;
  clip-path:none !important;
}

.header-brand-tagline{
  display:block;
  width:176px;
  color:#0B563D;
  font-family:"IBM Plex Sans",system-ui,sans-serif !important;
  font-size:.50rem;
  font-weight:600;
  line-height:1.15;
  letter-spacing:.125em !important;
  text-align:center;
  white-space:nowrap;
}

/* Give complete logo enough vertical clear-space */
.nav{
  min-height:92px !important;
  height:auto !important;
  overflow:visible !important;
}

/* ---------- Hero brand lockup ---------- */

.hero-card .logo{
  display:block !important;
  width:230px !important;
  height:auto !important;
  max-width:100% !important;
  max-height:none !important;
  object-fit:contain !important;
  padding:0 !important;
  margin:0 auto 5px !important;
  clip-path:none !important;
}

.hero-brand-tagline{
  display:block;
  width:100%;
  margin:0 0 18px;
  color:#0B563D;
  font-family:"IBM Plex Sans",system-ui,sans-serif !important;
  font-size:.58rem;
  font-weight:600;
  line-height:1.2;
  letter-spacing:.15em !important;
  text-align:center;
  white-space:nowrap;
}

/* Existing descriptor remains separate from the logo */
.hero-card-meta{
  margin-top:0 !important;
}

/* ---------- Footer brand lockup ---------- */

.footer-logo{
  display:block !important;
  width:184px !important;
  height:auto !important;
  max-width:none !important;
  max-height:none !important;
  object-fit:contain !important;
  padding:0 !important;
  margin:0 0 5px !important;
  clip-path:none !important;
  filter:none !important;
}

.footer-brand-tagline{
  display:block;
  width:184px;
  margin-bottom:18px;
  color:#d6e7df;
  font-family:"IBM Plex Sans",system-ui,sans-serif !important;
  font-size:.52rem;
  font-weight:600;
  line-height:1.2;
  letter-spacing:.14em !important;
  text-align:center;
  white-space:nowrap;
}

/* Hide the old duplicated standalone tagline in footer */
.footer-grid > div:first-child > strong{
  display:none !important;
}

/* ---------- RTL correctness ---------- */

body[dir="rtl"] .header-brand-tagline,
body[dir="rtl"] .hero-brand-tagline,
body[dir="rtl"] .footer-brand-tagline{
  direction:ltr;
  letter-spacing:.13em !important;
}

/* ---------- Mobile ---------- */

@media(max-width:620px){
  .nav{
    min-height:82px !important;
  }

  .brand img{
    width:145px !important;
  }

  .header-brand-tagline{
    width:145px;
    font-size:.43rem;
    letter-spacing:.10em !important;
  }

  .hero-card .logo{
    width:200px !important;
  }

  .hero-brand-tagline{
    font-size:.50rem;
  }

  .footer-logo,
  .footer-brand-tagline{
    width:160px !important;
  }
}

/* =========================================================
   USys Marketing v1C — Final Production Polish
   ========================================================= */

/* Remove obsolete disclaimer containers */
.notice:empty {
  display:none !important;
}

/* Avoid oversized empty gaps */
main > section:empty {
  display:none !important;
}

.section + footer,
main + footer {
  margin-top:0 !important;
}

/* Arabic UI consistency */
body[dir="rtl"] .trust-item strong,
body[dir="rtl"] .security-item h3,
body[dir="rtl"] .card h3,
body[dir="rtl"] .preview-top strong,
body[dir="rtl"] .hero-card-meta {
  font-family:"IBM Plex Sans Arabic","IBM Plex Sans",sans-serif !important;
}

/* Technical acronyms remain LTR inside Arabic */
body[dir="rtl"] .metric strong,
body[dir="rtl"] [dir="ltr"] {
  direction:ltr;
  unicode-bidi:isolate;
}

/* Header hierarchy */
.site-header .nav{
  padding-block:4px !important;
}

.nav-links{
  align-self:stretch;
}

/* Keep brand lockup intact */
.brand,
.brand img,
.header-brand-tagline,
.hero-card .logo,
.hero-brand-tagline,
.footer-logo,
.footer-brand-tagline{
  overflow:visible !important;
}

/* Cleaner CTA */
.cta{
  min-height:0 !important;
  padding:42px 48px !important;
}

.cta h2{
  margin-top:0 !important;
}

/* Footer production finish */
footer{
  margin-top:0 !important;
}

.footer-grid{
  align-items:start;
}

.footer-bottom{
  margin-top:34px !important;
}

/* Arabic footer alignment */
body[dir="rtl"] .footer-grid{
  text-align:right;
}

@media(max-width:620px){
  .cta{
    padding:30px 24px !important;
  }
}
