:root{
  --ink:#17211f;--navy:#14221f;--blue:#92784c;--cyan:#c8aa70;
  --paper:#f6f3ec;--muted:#68736f;--line:#dedbd1;--radius:22px;
}
body{font-family:"IBM Plex Sans Arabic",sans-serif;background:#fbfaf7;color:var(--ink)}
h1,h2,h3,.brand{font-family:"Noto Kufi Arabic",sans-serif}
.site-header{background:rgba(20,34,31,.86);border-bottom-color:rgba(200,170,112,.16)}
.nav-wrap{height:88px}.brand{font-size:1.04rem;letter-spacing:-.02em}
.brand-mark{width:48px;height:48px;padding:7px;background:#1c2e2a;border:1px solid rgba(200,170,112,.38);border-radius:15px;box-shadow:none}
.brand-mark svg{width:100%;height:100%;display:block}.logo-f{fill:#c8aa70}.logo-t{fill:#f7f3ea}
.brand b{color:#c8aa70}.main-nav a{color:#d6ddd9}.main-nav a:hover{color:#dec99f}
.btn{background:#ad8e57;border-radius:10px;box-shadow:0 12px 28px rgba(56,45,27,.16);letter-spacing:.01em}
.btn:hover{background:#967746}.btn-small{border:1px solid rgba(255,255,255,.12)}
.hero{background:
 radial-gradient(circle at 74% 40%,rgba(200,170,112,.15),transparent 31%),
 linear-gradient(125deg,#10201d 0%,#182a26 55%,#0e1a18 100%);min-height:100svh}
.hero:before{opacity:.4;background-size:78px 78px}
.hero-grid{min-height:calc(100svh - 132px);padding-block:82px}
.eyebrow{color:#d4c098}.eyebrow i{background:#c8aa70;box-shadow:0 0 15px rgba(200,170,112,.55)}
h1{font-size:clamp(3.2rem,6.2vw,6.1rem);line-height:1.2;letter-spacing:-.065em;font-weight:600}
h1 span,h2 em{color:#c8aa70}.hero-copy>p{color:#b8c1bc;font-size:1.15rem;max-width:590px}
.trust-row{color:#87958f}.trust-row span:before{color:#c8aa70}
.orbit{border-color:rgba(200,170,112,.2)}.orbit-two{border-color:rgba(200,170,112,.17)}
.code-card{background:rgba(24,42,37,.92);border-color:rgba(200,170,112,.22);box-shadow:0 42px 90px rgba(2,12,10,.42)}
.main-card{transform:rotate(-2deg);border-radius:20px}.pulse{background:#c8aa70;box-shadow:0 0 22px rgba(200,170,112,.7)}
.chart i{background:linear-gradient(#d7c091,#92784c)}.card-line b{color:#d4bd8b}
.float-card{border:1px solid rgba(200,170,112,.2);box-shadow:0 22px 55px rgba(2,12,10,.28)}
.float-card>span{background:#f1eadc;color:#92784c}.marquee{background:#ad8e57}.marquee i{color:#182722}
.section{padding:132px 0}.kicker{color:#92784c;letter-spacing:.08em}
.section h2{letter-spacing:-.05em;font-weight:600}.section h2 em{color:#92784c}
.about{background:#fbfaf7}.about-copy .text-link,.faq .text-link{color:#92784c}
.pillars{border-top-color:#dedbd1}.pillars article{border-left-color:#dedbd1}.pillars b{color:#a18451}
.services{background:#f3f0e8}.service-card{border-color:#e3dfd5;border-radius:22px;box-shadow:0 12px 45px rgba(41,51,47,.035)}
.service-card:hover{box-shadow:0 26px 60px rgba(39,53,48,.09)}
.service-card.featured{background:linear-gradient(145deg,#182a26,#10201d)}
.service-card.featured:before{border-color:rgba(200,170,112,.25);box-shadow:0 0 0 55px rgba(200,170,112,.035),0 0 0 110px rgba(200,170,112,.025)}
.service-icon{background:#eee7d9;color:#92784c;border-radius:14px}.featured .service-icon{background:rgba(200,170,112,.12);color:#d4bd8b}
.project{border-radius:24px}.project-dark{background:#172722}.project-blue{background:#92784c}.project-light{background:#e8e4da}
.ui-chart{background:linear-gradient(170deg,transparent 48%,#a4844e 49%,#a4844e 51%,transparent 52%),linear-gradient(#f1f5f2 1px,transparent 1px)}
.automation b{color:#92784c}.process{background:linear-gradient(145deg,#152521,#0e1a18)}
.process h2 em{color:#c8aa70}.timeline:before{background:linear-gradient(90deg,transparent,#8e754a,#c8aa70,transparent)}
.timeline b{background:#1c302b;border-color:#5d5847}.faq{background:#fbfaf7}
.contact{background:#92784c}.contact:after{border-color:rgba(255,255,255,.16)}.contact h2 em{color:#1b2a26}
.kicker.light{color:#f0dfba}.brief-form{border-radius:22px;box-shadow:0 32px 75px rgba(57,45,23,.22)}
.brief-form input,.brief-form select,.brief-form textarea{background:#f7f5f0;border-color:#e2ded4;border-radius:9px}
.brief-form input:focus,.brief-form select:focus,.brief-form textarea:focus{border-color:#a98b56;box-shadow:0 0 0 3px rgba(169,139,86,.12)}
.btn-light{background:#192a26}.btn-light:hover{background:#0f1d1a}
footer{background:#0d1917}.footer-top{border-bottom-color:rgba(200,170,112,.14)}
.reveal{transform:translateY(18px);transition-duration:.85s}
@media(max-width:900px){.nav-wrap{height:78px}.main-nav{top:78px;background:#162622;border-color:#3b4a45}.section{padding:105px 0}}
@media(max-width:600px){.hero h1{font-size:2.85rem}.section{padding:82px 0}.brand-mark{width:43px;height:43px}.contact h2{font-size:3rem}}

/* Faisal Tech final palette: navy, gold, white */
:root{--ink:#071a33;--navy:#071a33;--blue:#a98443;--cyan:#c6a15b;--paper:#f6f8fb;--white:#fff;--muted:#5f6d7c;--line:#dfe5ec}
body,.about,.faq{background:#fff;color:#071a33}
.site-header{background:rgba(7,26,51,.9);border-bottom-color:rgba(198,161,91,.22)}
.brand-mark{background:#071a33;border-color:rgba(198,161,91,.55)}
.logo-f{fill:#c6a15b}.logo-t{fill:#fff}.brand b,.eyebrow,h1 span,.process h2 em{color:#c6a15b}
.main-nav a{color:#e4eaf1}.main-nav a:hover{color:#d6b56f}
.btn{background:#b28d49;color:#fff}.btn:hover{background:#9a7637}
.hero{background:radial-gradient(circle at 74% 40%,rgba(198,161,91,.18),transparent 31%),linear-gradient(125deg,#06162c 0%,#0b2342 55%,#051225 100%)}
.eyebrow i,.pulse{background:#c6a15b}.code-card{background:rgba(8,29,55,.94);border-color:rgba(198,161,91,.28)}
.chart i{background:linear-gradient(#d7b873,#9f7938)}.float-card>span{background:#f7f1e5;color:#9f7938}
.marquee{background:#b28d49}.marquee i{color:#071a33}
.kicker,.section h2 em,.pillars b,.about-copy .text-link,.faq .text-link{color:#a47d38}
.services{background:#f4f6f9}.service-card{border-color:#e1e6ec}.service-card.featured{background:linear-gradient(145deg,#0b2342,#06162c)}
.service-icon{background:#f5efe3;color:#a47d38}.featured .service-icon{background:rgba(198,161,91,.14);color:#d5b66f}
.project-dark{background:#071a33}.project-blue{background:#ad8744}.project-light{background:#f0f2f5}
.process{background:linear-gradient(145deg,#0b2342,#051225)}.timeline b{background:#102d50;border-color:#8d7445}
.contact{background:#0b2342}.contact h2 em{color:#c6a15b}.kicker.light{color:#d9bd83}
.brief-form{background:#fff}.brief-form input,.brief-form select,.brief-form textarea{background:#f6f8fb;border-color:#dfe5ec}
.brief-form input:focus,.brief-form select:focus,.brief-form textarea:focus{border-color:#b28d49;box-shadow:0 0 0 3px rgba(178,141,73,.13)}
.btn-light{background:#b28d49}.btn-light:hover{background:#987235}
footer{background:#041126}.footer-top{border-bottom-color:rgba(198,161,91,.18)}

/* Arabic typography and RTL corrections */
html{direction:rtl}
body{direction:rtl;text-align:right;font-kerning:normal;font-feature-settings:"kern" 1,"liga" 1,"calt" 1}
h1,h2,h3,p,a,button,label,input,select,textarea,summary,li,small,strong,b,span{
  letter-spacing:0;
  word-spacing:normal;
}
h1,h2,h3{line-height:1.45;text-wrap:balance}
p,li,summary,label,input,select,textarea{line-height:1.9}
.hero-copy,.section-intro,.about-copy,.service-card,.project>div:last-child,.contact-copy,.brief-form,.accordion{
  direction:rtl;
  text-align:right;
}
.main-nav,.hero-actions,.trust-row,.section-heading,.footer-top,.footer-bottom{
  direction:rtl;
}
.eyebrow,.kicker,.text-link,.btn,.brand{letter-spacing:0}
.metric,.card-line,.float-card,.contact-badge{direction:rtl}
.metric strong,.service-no,.timeline b,.project>div:last-child>span,#count{unicode-bidi:isolate}
.brief-form input,.brief-form select,.brief-form textarea{direction:rtl;text-align:right}
.brief-form label small{text-align:left;direction:ltr}
.text-link span,.footer-bottom a{unicode-bidi:isolate}
@media(max-width:900px){.main-nav{text-align:right}}
@media(max-width:600px){
  h1,h2,h3{line-height:1.5}
  .hero-copy{text-align:center}
  .hero-actions,.trust-row{direction:rtl}
}

.credential-row{
  display:flex;align-items:center;gap:14px;margin-top:26px;padding:18px 20px;
  border:1px solid rgba(198,161,91,.22);border-radius:14px;
  background:rgba(255,255,255,.035);color:#fff;
}
.credential-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:26px}
.credential-grid .credential-row{width:100%;margin-top:0}
.engineering-card img{
  flex:0 0 82px;width:82px;height:82px;object-fit:cover;object-position:center;
  border-radius:10px;background:#fff;border:3px solid #fff;
}
.engineering-card div{min-width:0}
.engineering-card strong bdi{color:#d5b66f;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.credential-row{transition:.25s}
.credential-row:hover{background:rgba(198,161,91,.1);border-color:rgba(198,161,91,.5);transform:translateY(-2px)}
.credential-icon{
  flex:0 0 42px;width:42px;height:42px;display:grid;place-items:center;
  border-radius:50%;background:#c6a15b;color:#071a33;font-weight:800;
}
.credential-row small,.credential-row strong{display:block}
.credential-row small{color:#91a1b2;font-size:.76rem;margin-bottom:2px}
.credential-row strong{font-size:.9rem;font-weight:600}
.credential-row bdi{color:#d5b66f;font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
.verify-link{margin-right:auto;color:#d5b66f;font-size:.78rem;font-weight:700;white-space:nowrap}
@media(max-width:600px){.credential-row{align-items:flex-start;padding:16px}.credential-row strong{font-size:.82rem}}
@media(max-width:600px){.credential-row{flex-wrap:wrap}.verify-link{width:100%;margin-right:56px}}
@media(max-width:760px){.credential-grid{grid-template-columns:1fr}.engineering-card img{width:74px;height:74px}}

.contact-methods{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}
.contact-phone{
  display:inline-flex;align-items:center;gap:13px;padding:12px 18px;
  border:1px solid rgba(198,161,91,.42);border-radius:12px;
  background:rgba(255,255,255,.06);color:#fff;transition:.25s;
}
.contact-phone:hover{background:rgba(198,161,91,.16);transform:translateY(-2px)}
.contact-phone>span{
  width:38px;height:38px;display:grid;place-items:center;border-radius:10px;
  background:#c6a15b;color:#071a33;font-size:1.05rem;
}
.contact-phone small,.contact-phone bdi{display:block}
.contact-phone small{color:#a9b5c2;font-size:.72rem}
.contact-phone bdi{color:#fff;font-size:1rem;font-weight:700;letter-spacing:.04em}
@media(max-width:600px){.contact-methods{display:grid}.contact-phone{width:100%}}

/* Keep the product journey readable and fully separated from its copy on phones. */
@media(max-width:600px){
  .project-light{
    min-height:0;
    height:auto;
    padding:22px;
    justify-content:flex-start;
  }
  .project-light .project-ui{
    height:auto;
    min-height:0;
    width:100%;
    padding:14px 0 28px;
    overflow:visible;
  }
  .project-light .automation{
    display:flex;
    flex-direction:column;
    align-items:stretch;
    justify-content:flex-start;
    gap:10px;
  }
  .project-light .automation i{
    width:min(100%,260px);
    margin-inline:auto;
    padding:19px 16px;
    text-align:center;
    line-height:1.65;
  }
  .project-light .automation b{
    align-self:center;
    margin:0;
    line-height:1;
    transform:rotate(-90deg);
  }
  .project-light>div:last-child{
    width:100%;
    padding-top:22px;
    border-top:1px solid rgba(7,26,51,.1);
    position:relative;
    z-index:2;
  }
  .project-light h3{
    margin:6px 0 8px;
    font-size:1.45rem;
    line-height:1.55;
  }
  .project-light p{font-size:.88rem;line-height:1.9}
}