@font-face{font-family:IS;src:url(fonts/InstrumentSans.ttf);unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Arabic UI";src:url(fonts/NotoKufiArabic-Black.ttf) format("truetype");font-weight:900;font-style:normal;font-display:swap}
:root{--ch:#141518;--sl:#2E3239;--sl2:#40464F;--br:#B07D4E;--cu:#C47A4A;--tx:#ECE8E2;--mu:#AAAAAC}
*{box-sizing:border-box}body{margin:0;background:var(--ch);color:var(--tx);font:18px/1.6 'Instrument Sans',IS,sans-serif}
a{color:inherit;text-decoration:none}.draft{background:var(--cu);color:#0F0F11;text-align:center;font-size:14px;padding:6px;font-weight:600}
.hero{min-height:820px;background-image:linear-gradient(180deg,rgba(20,21,24,.02),rgba(20,21,24,.92)),image-set(url(img/web/hero-1600.webp) 1x, url(img/hero.jpg) 2x);background-size:cover;background-position:center;padding:28px 6vw 56px;display:flex;flex-direction:column}
nav{display:flex;justify-content:space-between;align-items:center;font-size:16px}nav a{margin-left:28px}
.herobox{margin-top:auto;display:flex;gap:40px;align-items:center}.avatar{width:220px;height:220px;border-radius:50%;border:6px solid var(--br);object-fit:cover;flex-shrink:0}
.hero-line{font-size:clamp(2.6rem,5.2vw,5rem);font-weight:700;margin:0;line-height:1.02;color:var(--tx);letter-spacing:-0.02em;max-width:none}
.hero-line .accent{color:var(--cu)}
.lead{max-width:980px;font-size:clamp(1.35rem,1.55vw,1.55rem);line-height:1.45;margin:1.75rem 0 20px;color:#F5F2EC;font-weight:450}
.lead .fig{color:var(--cu);font-weight:700}
.id-name{font-size:20px;font-weight:600;margin:0 0 2px;color:var(--tx)}
.role{color:var(--cu);font-size:17px;margin:4px 0 0;font-weight:500}.loc{color:var(--mu);margin:2px 0 14px;font-size:15px}
.btn{display:inline-block;background:var(--cu);color:#0F0F11;font-weight:600;padding:16px 34px;border-radius:40px;margin-top:12px}
section{padding:90px 6vw}h2{color:var(--br);font-size:15px;letter-spacing:.14em;text-transform:uppercase;margin:0 0 24px}h3{margin:0 0 8px;font-size:22px}
.sub{color:var(--mu);margin-top:-12px}
.nums{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;padding-top:64px;padding-bottom:64px;background:#1E2025}.nums div{border-left:5px solid var(--cu);padding-left:20px}.nums b{font-size:56px;display:block;color:var(--tx)}.nums span{color:var(--mu);font-size:16px}
.split{display:grid;grid-template-columns:1.1fr 1fr;gap:60px;align-items:center}.split img{width:100%;border-radius:20px;max-height:640px;object-fit:cover}
blockquote{margin:24px 0 0;border-left:3px solid var(--br);padding:6px 0 6px 22px;font-size:21px;font-style:italic}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}.grid2{display:grid;grid-template-columns:repeat(2,1fr);gap:26px}
.card{background:var(--sl);border-radius:20px;padding:30px;position:relative}.card i{font-style:normal;background:var(--cu);color:#0F0F11;font-weight:700;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;margin-bottom:14px}
.card p{color:var(--mu);margin:0 0 12px}.card small{color:var(--br);font-size:14px}.bar{border-left:6px solid var(--cu)}
.tile{background:var(--sl);border-radius:20px;overflow:hidden}.tile img{width:100%;aspect-ratio:16/10;object-fit:cover;display:block}.tile h3,.tile p,.tile small{margin:18px 24px}.tile p{color:var(--mu)}.tile small{display:block;color:var(--cu);margin-bottom:24px}
#refs blockquote{background:var(--sl);border-radius:20px;border:0;padding:30px;margin:0}cite{display:block;margin-top:16px;color:var(--br);font-style:normal;font-size:15px}
.tl{list-style:none;padding:0;border-left:4px solid var(--cu);margin-left:14px}.tl li{padding:0 0 30px 34px;position:relative}.tl li:before{content:'';position:absolute;left:-14px;top:6px;width:24px;height:24px;border-radius:50%;background:var(--cu)}.tl p{color:var(--mu);margin:6px 0 0}
.note{color:var(--mu);font-size:15px}.contact{text-align:center;background-image:linear-gradient(rgba(20,21,24,.75),rgba(20,21,24,.9)),image-set(url(img/web/contact-1600.webp) 1x, url(img/contact.jpg) 2x);background-size:cover;background-position:center;padding:120px 6vw}.small{color:var(--mu);font-size:14px}.links{color:var(--br);margin-top:30px}
footer{text-align:center;color:var(--mu);font-size:14px;padding:30px}
@media(max-width:800px){.grid3,.grid2,.split,.nums{grid-template-columns:1fr}.hero{min-height:auto;padding:20px 5vw 40px}.herobox{flex-direction:column;align-items:flex-start;gap:22px;margin-top:36px}.hero-line{font-size:clamp(2.2rem,8vw,3.2rem);max-width:none;margin:0 0 12px}.lead{font-size:1.2rem;line-height:1.5;margin:0 0 18px}nav span{display:none}.avatar{width:160px;height:160px}}
.pills{display:flex;flex-wrap:wrap;gap:12px;margin:0 0 28px}.pills a{border:1px solid var(--br);color:var(--tx);padding:8px 18px;border-radius:30px;font-size:15px}
.pillar{display:grid;grid-template-columns:1fr 1.1fr;gap:50px;align-items:center;margin:0 0 60px}.pillar.rev img{order:2}.pillar img{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:20px}.pillar i{font-style:normal;background:var(--cu);color:#0F0F11;font-weight:700;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;margin-bottom:14px}.pillar h3{font-size:32px}.tag{color:var(--cu);margin:0 0 12px}.pillar ul{color:var(--mu);padding-left:20px;margin:0 0 14px}.pillar li{margin-bottom:8px}.pillar small{color:var(--br);font-size:14px}@media(max-width:800px){.pillar{grid-template-columns:1fr}.pillar.rev img{order:0}}
.pq{margin:18px 0 0;border-left:3px solid var(--cu);padding:4px 0 4px 18px;font-size:17px;font-style:italic;color:var(--tx)}.pq cite{font-size:13px;margin-top:8px}
.btn.off{background:var(--sl2);color:var(--mu);cursor:not-allowed;pointer-events:none}
.lead2{color:var(--mu);max-width:760px;font-size:19px;margin-top:-6px}.links a{text-decoration:underline;text-underline-offset:4px}

/* r14m scratch: one-sentence headline (2 lines, flush, tight); gap before lead; UK on dark (mobile) */
.hero-line{text-align:left}
.hero-line .hero-from,
.hero-line .accent{
  display:block;
  margin:0;
  padding:0;
  text-indent:0;
  line-height:1.02;
}
.hero-line .hero-from{white-space:nowrap;color:var(--tx)}
.hero-line .accent{color:var(--cu);font-weight:700}
.lead .nowrap{white-space:nowrap}
.hero-copy{padding-left:3rem}
@media(max-width:800px){
.hero-line{font-size:clamp(1.55rem,6.4vw,2.35rem);letter-spacing:-0.03em;max-width:none;margin:0;line-height:1.02}
.lead{margin-top:1.75rem} /* overridden to 4rem under 600 for UK band */
}
@media(max-width:600px){
.hero-copy{padding-left:1.25rem;padding-right:0.35rem;box-sizing:border-box;max-width:100%}
.lead{margin-top:4rem;margin-bottom:1.1rem;max-width:none}
}

/* r14m-desk: desktop only — F top level with tallest tower via transform (bg locked) */
@media (min-width: 801px) {
  .hero {
    min-height: 820px;
    /* do NOT set height — changing it reflows background-size:cover */
    background-position: center center;
    background-size: cover;
    overflow: visible;
  }
  .herobox {
    margin-top: calc(9.5rem + 22px);
    align-items: flex-start;
    transform: translateY(-67px); /* visual F ink top → tower tip; bg stays put */
  }
  .avatar { margin-top: 0; }
  .hero-copy {
    padding-top: calc(110px - 0.51 * clamp(2.6rem, 5.2vw, 5rem));
    padding-left: 3rem;
  }
  .hero-line { margin: 0; line-height: 1.02; }
  .lead { margin-top: 3.75rem; margin-bottom: 1.25rem; }
}
/* r16: no dark circle behind O — same on desktop and mobile */
.hero-line .ceo-o{
  position:static;
  display:inline;
  z-index:auto;
}

/* r15: structure scaffolds — coming soon pages + RTL */
.soon-page{max-width:820px;margin:0 auto;padding:40px 6vw 80px}
.soon-back{margin:0 0 28px;color:var(--mu);font-size:15px}
.soon-back a{color:var(--tx);text-decoration:underline;text-underline-offset:3px}
.soon-page h1{font-size:clamp(1.8rem,4vw,2.6rem);margin:0 0 10px;line-height:1.15}
.soon-kicker{color:var(--cu);font-size:13px;letter-spacing:.12em;text-transform:uppercase;margin:0 0 8px;font-weight:700}
.soon-box{background:var(--sl);border-radius:20px;padding:28px;border-left:6px solid var(--cu);margin:24px 0}
.soon-label{color:var(--cu);font-weight:700;text-transform:uppercase;letter-spacing:.12em;font-size:13px;margin:0 0 12px}
.soon-slots{list-style:none;padding:0;margin:0}
.soon-slots li{display:flex;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid var(--sl2);font-size:16px}
.soon-slots li:last-child{border-bottom:0}
.soon-slots em{color:var(--mu);font-style:normal;font-size:14px;white-space:nowrap}
.soon-note{color:var(--mu);font-size:14px}
.soon-note code{color:var(--tx)}
.post-slot{display:block;color:inherit}
.post-slot.is-pending{cursor:default}
.post-slot .slot-note{display:block;color:var(--mu);font-size:13px;margin:6px 24px 18px}
.lang-switch{margin-left:28px;color:var(--cu);font-weight:600}
.struct-links{display:flex;flex-wrap:wrap;gap:12px;margin:0 0 8px}
.struct-links a{border:1px solid var(--br);padding:8px 18px;border-radius:30px;font-size:15px}
body.rtl{direction:rtl;text-align:right}
body.rtl .soon-back{text-align:right}
body.rtl .soon-slots li{flex-direction:row-reverse}
body.rtl .soon-box{border-left:0;border-right:6px solid var(--cu)}
@media(max-width:800px){.soon-slots li{flex-direction:column;align-items:flex-start;gap:4px}body.rtl .soon-slots li{align-items:flex-end}}


/* r17: dark slate nav bar — white links, copper hover */
nav{
  background:rgba(28,32,40,.85);
  border-radius:12px;
  padding:10px 18px;
  margin:0 0 8px;
  backdrop-filter:saturate(120%) blur(6px);
  -webkit-backdrop-filter:saturate(120%) blur(6px);
}
nav b{color:#fff}
nav a{color:#fff; opacity:1}
nav a:hover{color:var(--cu)}
@media(max-width:800px){
  nav{padding:10px 14px; border-radius:10px}
}

/* CV: copper timeline on the left, two action buttons filling its height on the right */
#cv .cv-layout{
  display:grid;
  grid-template-columns:minmax(0,1.35fr) minmax(240px,0.75fr);
  gap:36px 48px;
  align-items:stretch;
}
#cv #experience{padding:0;margin:0}
#cv .cv-actions{
  display:flex;
  flex-direction:column;
  gap:22px;
  height:100%;
  min-height:100%;
}
#cv .cv-actions .btn{
  flex:1 1 0;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:12px;
  margin:0;
  text-align:center;
  padding:28px 34px;
  min-height:8rem;
}
#cv .cv-actions .btn:hover{background:var(--br)}
#cv .cv-actions .btn:focus-visible{outline:3px solid var(--tx);outline-offset:3px}
#cv .cv-action-label{font-size:22px;font-weight:700;line-height:1.25}
#cv .cv-action-note{font-size:16px;font-weight:500;line-height:1.45;max-width:28ch}
@media(max-width:800px){
  #cv .cv-layout{
    grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);
    gap:10px;
  }
  #cv #experience,
  #cv .cv-actions{min-width:0}
  #cv .cv-actions{height:100%;min-height:100%}
  #cv .cv-actions .btn{
    flex:1 1 0;
    min-width:0;
    min-height:0;
    gap:6px;
    padding:14px 8px;
  }
  #cv .cv-action-label,
  #cv .cv-action-note{
    max-width:100%;
    min-width:0;
    overflow-wrap:break-word;
  }
  #cv .cv-action-label{font-size:clamp(12px,3.2vw,18px);line-height:1.2}
  #cv .cv-action-note{font-size:clamp(11px,2.8vw,14px);line-height:1.3}
  #cv .tl{
    font-size:clamp(12px,3.3vw,16px);
    overflow-wrap:break-word;
  }
  #cv #experience h2{
    font-size:clamp(11px,2.8vw,15px);
    letter-spacing:.08em;
  }
}

/* Section order: language toggle, copper headline numbers, competence cards */
.lang-toggle{display:flex;justify-content:flex-end;align-items:center;gap:10px;margin:0 0 14px;font-size:15px;overflow:visible}
.lang-toggle a{display:inline-flex;align-items:center;gap:8px;color:var(--tx);flex-shrink:0;overflow:visible}
.lang-toggle a.is-current{color:var(--cu);font-weight:700}
.lang-toggle .lang-sep{color:var(--br);font-weight:600}
.lang-toggle a[lang="ar"],
.lang-toggle a[lang="ar"] span{font-family:"Arabic UI","Noto Kufi Arabic",sans-serif;color:var(--cu);font-weight:900}
.lang-toggle a[lang="ar"] span{white-space:nowrap;line-height:1.4;font-size:1.12em}
.flag{display:block;border-radius:2px;flex-shrink:0}
.ph{color:var(--cu);font-size:14px;font-weight:600}
.card p.ph,.ph-banner{color:var(--cu)}
.ph-banner{text-align:center;margin:12px 6vw}
.fig{color:var(--cu);font-weight:700}
.nums b,.nums span{color:var(--cu)}
.nums .cap-em{font-size:1.25em;font-weight:inherit;color:inherit}
.value-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;margin:12px 0 0;align-items:stretch}
.value-col{background:var(--sl);border-radius:18px;min-height:380px;padding:0 22px 28px;display:flex;flex-direction:column;align-items:center;text-align:center;box-shadow:inset 0 16px 0 var(--cu);min-width:0}
.value-col h3{margin:52px 0 0;max-width:100%;font-size:clamp(28px,2.3vw,40px);line-height:1.12;color:var(--tx);font-weight:700;overflow-wrap:break-word}
.video-mark{margin-top:auto;display:inline-flex;align-items:center;gap:8px;color:var(--cu);font-size:13px;font-weight:600;letter-spacing:.04em}
.video-mark-icon{width:28px;height:28px;border-radius:50%;border:2px solid var(--cu);display:grid;place-items:center;flex-shrink:0}
.video-mark-icon:before{content:"";width:0;height:0;border-style:solid;border-width:5px 0 5px 8px;border-color:transparent transparent transparent var(--cu);margin-left:2px}
.gov-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px}
.span-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:26px;width:100%}
#governance .span-pair{margin-top:26px}
#forward .span-pair{grid-template-columns:repeat(3,minmax(0,1fr))}
#forward .tile{min-width:0}
.library-cards .card{min-height:220px;display:flex;flex-direction:column;justify-content:center}
article.comp{display:grid;grid-template-columns:minmax(0,1fr);gap:18px;align-items:stretch;margin:0 0 28px;background:transparent;border-radius:0;padding:0;border-left:0}
article.comp .pillar{margin:0;background:var(--sl);border-radius:20px;padding:30px;border-left:6px solid var(--cu)}
article.comp .pq{width:100%;max-width:none;box-sizing:border-box;margin:0;background:var(--sl);border-radius:20px;border:0;border-left:6px solid var(--cu);padding:28px 32px;font-size:20px;line-height:1.55;overflow-wrap:break-word}
#refs.grid3,#refs>.grid3{grid-template-columns:minmax(0,1fr);width:100%}
#refs blockquote{width:100%;max-width:none;box-sizing:border-box;font-size:21px;line-height:1.55;overflow-wrap:break-word}
.price-request{margin:28px auto 0;max-width:640px;width:100%;text-align:center}
.price-request summary.btn{display:block;list-style:none;cursor:pointer;width:fit-content;margin-left:auto;margin-right:auto}
.price-request summary.btn::-webkit-details-marker{display:none}
.price-request form{background:var(--sl);border-radius:20px;border-left:6px solid var(--cu);padding:24px;margin:16px auto 0;text-align:left}
.price-request label{display:block;margin:0 0 12px;font-size:15px;color:var(--tx)}
.price-request input,.price-request textarea,.price-request select{display:block;width:100%;margin-top:6px;background:#1E2025;color:var(--tx);border:1px solid var(--br);border-radius:12px;padding:10px 12px;font:inherit}
.enquiry-form{background:var(--sl);border-radius:20px;border-left:6px solid var(--cu);padding:24px;margin:16px auto 0;text-align:left;max-width:640px}
.enquiry-form label{display:block;margin:0 0 12px;font-size:15px;color:var(--tx)}
.enquiry-form input,.enquiry-form textarea,.enquiry-form select{display:block;width:100%;margin-top:6px;background:#1E2025;color:var(--tx);border:1px solid var(--br);border-radius:12px;padding:10px 12px;font:inherit}
.price-request .enquiry-form{max-width:none}
input[name="_honey"]{display:none !important}
[hidden]{display:none !important}
.form-submit{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;margin:12px 0 0}
.contact>.form-submit{justify-content:center}
.form-submit .btn{margin-top:0}
.form-notice{color:var(--mu);font-size:14px;font-weight:400;line-height:1.4;max-width:36em}
p.form-notice{display:block;margin:18px 0 0;max-width:36em}
@media(min-width:801px){
  nav{flex-wrap:wrap;gap:8px}
  nav span{display:flex;flex-wrap:wrap;justify-content:flex-end;max-width:78%}
}
@media(max-width:800px){
  .lang-toggle{justify-content:flex-start}
  #refs blockquote,article.comp .pq{padding:20px 18px;font-size:18px;line-height:1.55}
  .value-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .value-col{min-height:230px;padding:0 10px 16px;border-radius:14px;box-shadow:inset 0 10px 0 var(--cu)}
  .value-col h3{margin:28px 0 0;font-size:20px}
  .gov-row{gap:10px}
  .gov-row .card{padding:16px 10px}
  .gov-row h3{font-size:15px;line-height:1.25}
  .span-pair{gap:12px}
  #forward .span-pair{grid-template-columns:1fr}
  .span-pair .card{padding:18px 14px}
  .library-cards .card{min-height:160px}
}