*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
  :root{
    --bg:#ffffff;
    --bg2:#f0f0f0;
    --ink:#0F0E0C;
    --ink2:#1C1A16;
    --mute:#6B6359;
    --mute2:#9C9286;
    --line:#E2DCCF;
    --line-dk:rgba(255,255,255,.14);
    --accent:#FF772C;
    --serif:'IBM Plex Sans Arabic','IBM Plex Sans','Helvetica Neue',Arial,sans-serif;
    --sans:'IBM Plex Sans Arabic','IBM Plex Sans','Helvetica Neue',Arial,sans-serif;
    --mono:'IBM Plex Sans Arabic','IBM Plex Sans',ui-monospace,monospace;
    --ease:cubic-bezier(.22,.8,.3,1);
  }
  html{scroll-behavior:smooth;font-size:16px;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
  body{
    font-family:var(--sans);background:var(--bg);color:var(--ink);
    font-weight:400;line-height:1.5;letter-spacing:-.005em;
    overflow-x:hidden;
  }
  a{color:inherit;text-decoration:none}
  img,svg{display:block;max-width:100%}
  ::selection{background:var(--accent);color:#fff}
  ::-webkit-scrollbar{width:8px;height:8px}
  ::-webkit-scrollbar-thumb{background:var(--ink);border-radius:0}
  ::-webkit-scrollbar-track{background:var(--bg2)}

  /* ============ LAYOUT ============ */
  .wrap{max-width:1440px;margin:0 auto;padding:0 56px}
  @media (max-width:760px){ .wrap{padding:0 22px} }
  .grid12{display:grid;grid-template-columns:repeat(12,1fr);gap:24px}

  /* ============ TYPE ============ */
  .eyebrow{
    font-family:var(--mono);font-size:11px;font-weight:500;
    text-transform:uppercase;letter-spacing:.16em;color:var(--mute);
    display:inline-flex;align-items:center;gap:10px;
  }
  .eyebrow::before{content:"";width:24px;height:1px;background:currentColor;display:inline-block;opacity:.45}
  .display{font-family:var(--sans);font-weight:300;line-height:.96;letter-spacing:-.025em}
  .display em{font-style:normal;color:var(--accent);font-weight:600}
  .h-xxl{font-size:clamp(72px,12vw,184px)}
  .h-xl{font-size:clamp(56px,8vw,128px)}
  .h-lg{font-size:clamp(44px,5.8vw,92px)}
  .h-md{font-size:clamp(32px,3.6vw,56px)}
  .lead{font-family:var(--sans);font-style:normal;font-weight:300;font-size:clamp(20px,1.7vw,28px);line-height:1.45;color:var(--ink2);letter-spacing:-.01em}
  .body{font-size:15.5px;line-height:1.68;color:var(--mute)}
  .meta{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--mute2)}

  /* ============ NAV ============ */
  nav.site{
    position:fixed;inset:0 0 auto 0;z-index:50;
    display:flex;align-items:center;justify-content:space-between;
    padding:18px 56px;
    transition:background .4s var(--ease), padding .4s var(--ease), border-color .4s var(--ease);
    border-bottom:1px solid transparent;
  }
  nav.site.scrolled{
    background:rgba(255,255,255,.86);
    backdrop-filter:saturate(140%) blur(14px);
    -webkit-backdrop-filter:saturate(140%) blur(14px);
    border-bottom-color:var(--line);
    padding:12px 56px;
  }
  @media (max-width:760px){ nav.site{padding:14px 22px} nav.site.scrolled{padding:10px 22px} }
  .brand{display:flex;align-items:center;gap:12px}
  .brand-mark{
    width:38px;height:38px;border:1px solid var(--ink);
    display:grid;place-items:center;font-family:var(--serif);font-size:22px;font-style:italic;line-height:1;
    color:var(--ink);background:transparent;letter-spacing:-.04em;
  }
  .brand-mark span{position:relative;top:-1px}
  .brand-mark .dot{display:inline-block;width:5px;height:5px;background:var(--accent);margin-left:1px;vertical-align:baseline;border-radius:50%}
  .brand-meta{display:flex;flex-direction:column;line-height:1.05}
  .brand-name{font-size:13px;font-weight:600;letter-spacing:-.01em}
  .brand-sub{font-family:var(--mono);font-size:9.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--mute);margin-top:3px}
  .nav-links{display:flex;align-items:center;gap:6px;list-style:none}
  .nav-links a{
    font-size:13.5px;color:var(--mute);padding:8px 14px;border-radius:999px;
    transition:color .25s, background .25s;
  }
  .nav-links a:hover{color:var(--ink);background:rgba(15,14,12,.06)}
  .nav-cta{
    display:inline-flex;align-items:center;gap:8px;
    background:var(--ink);color:#fff!important;padding:10px 18px 10px 20px;border-radius:999px;
    font-size:13px;font-weight:500;letter-spacing:-.005em;
    transition:transform .25s var(--ease), background .25s;
  }
  .nav-cta:hover{background:var(--accent);transform:translateY(-1px)}
  .nav-cta .arrow{display:inline-block;transition:transform .3s var(--ease)}
  .nav-cta:hover .arrow{transform:translateX(3px)}
  .nav-lang{
    font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;
    color:var(--mute);padding:6px 10px;border:1px solid var(--line);border-radius:999px;
    background:transparent;cursor:pointer;transition:all .25s;
  }
  .nav-lang:hover{border-color:var(--ink);color:var(--ink)}
  .mb-btn{display:none;background:none;border:none;cursor:pointer;flex-direction:column;gap:5px;padding:10px}
  .mb-btn span{display:block;width:22px;height:1.5px;background:var(--ink)}
  @media (max-width:900px){
    .nav-links, .nav-cta{display:none}
    .mb-btn{display:flex}
  }

  /* ============ HERO ============ */
  .hero{
    position:relative;min-height:100vh;
    padding:160px 0 80px;display:flex;flex-direction:column;justify-content:space-between;
    background:
      radial-gradient(900px 600px at 90% 10%, rgba(255,119,44,.07), transparent 60%),
      var(--bg);
  }
  .hero-top{display:flex;justify-content:space-between;align-items:flex-start;gap:48px;flex-wrap:wrap}
  .hero-loc{display:flex;flex-direction:column;gap:6px;align-items:flex-end;text-align:right}
  .hero-loc .meta{font-size:10.5px}
  .hero-loc .live{display:inline-flex;align-items:center;gap:8px;font-family:var(--mono);font-size:11px;color:var(--ink)}
  .pulse{width:7px;height:7px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 0 rgba(255,119,44,.6);animation:pulse 1.8s var(--ease) infinite}
  @keyframes pulse{0%{box-shadow:0 0 0 0 rgba(255,119,44,.55)}80%,100%{box-shadow:0 0 0 10px rgba(255,119,44,0)}}

  .hero-headline{margin-top:14vh}
  .hero-headline h1{margin-top:18px}
  .hero-headline h1 .row{display:block}
  .hero-headline h1 .row.indent{padding-left:14vw}
  .hero-spork{
    display:inline-flex;align-items:center;gap:18px;margin-bottom:8px;
  }
  .hero-spork .spork-glyph{
    font-family:var(--serif);font-style:italic;font-size:clamp(56px,8vw,128px);
    color:var(--accent);line-height:.85;letter-spacing:-.04em;
  }
  .hero-spork .spork-def{
    font-family:var(--mono);font-size:11.5px;letter-spacing:.06em;color:var(--mute);
    text-transform:none;max-width:280px;line-height:1.55;border-left:1px solid var(--line);padding-left:14px;
  }
  .hero-bottom{
    margin-top:96px;display:grid;grid-template-columns:1.2fr 1fr;gap:80px;align-items:end;
  }
  .hero-bottom p.lead{max-width:520px}
  .hero-cta-row{display:flex;gap:14px;align-items:center;flex-wrap:wrap;margin-top:32px}
  .btn{
    display:inline-flex;align-items:center;gap:10px;
    font-size:13.5px;font-weight:500;padding:14px 22px;border-radius:999px;
    transition:transform .3s var(--ease), background .25s, color .25s, border-color .25s;
    cursor:pointer;border:1px solid transparent;
  }
  .btn-primary{background:var(--ink);color:#fff}
  .btn-primary:hover{background:var(--accent);transform:translateY(-2px)}
  .btn-ghost{border-color:var(--ink);color:var(--ink)}
  .btn-ghost:hover{background:var(--ink);color:#fff;transform:translateY(-2px)}
  .btn .arrow{display:inline-block;transition:transform .3s var(--ease)}
  .btn:hover .arrow{transform:translate(3px,-3px)}

  /* Stats */
  .stats{
    margin-top:80px;border-top:1px solid var(--line);padding-top:32px;
    display:grid;grid-template-columns:repeat(4,1fr);gap:24px;
  }
  .stat{display:flex;flex-direction:column;gap:8px}
  .stat .num{font-family:var(--serif);font-size:clamp(48px,5vw,72px);line-height:1;color:var(--ink);letter-spacing:-.02em}
  .stat .num .plus, .stat .num .pct{color:var(--accent);font-style:italic}
  .stat .lbl{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--mute)}
  @media (max-width:760px){
    .hero-headline{margin-top:6vh}
    .hero-headline h1 .row.indent{padding-left:0}
    .hero-bottom{grid-template-columns:1fr;gap:40px;margin-top:60px}
    .stats{grid-template-columns:repeat(2,1fr);row-gap:32px}
  }

  /* ============ SECTION ============ */
  section.sec{padding:140px 0;position:relative}
  section.sec.dark{background:var(--ink);color:#fff}
  section.sec.dark .body{color:rgba(255,255,255,.65)}
  section.sec.dark .meta{color:rgba(255,255,255,.5)}
  section.sec.dark .eyebrow{color:rgba(255,255,255,.55)}
  section.sec.dark .eyebrow::before{background:rgba(255,255,255,.45)}
  section.sec.dark .display{color:#fff}
  @media (max-width:760px){ section.sec{padding:80px 0} }

  .sec-head{display:grid;grid-template-columns:1fr 1.5fr;gap:64px;align-items:end;margin-bottom:80px}
  .sec-head h2{margin-top:18px}
  .sec-head .sec-desc{max-width:520px}
  @media (max-width:900px){ .sec-head{grid-template-columns:1fr;gap:32px;margin-bottom:48px} }

  /* ============ WORK ============ */
  .feat-cases{display:grid;grid-template-columns:1fr 1fr;gap:0;border-top:1px solid var(--line);border-left:1px solid var(--line)}
  .feat-case{
    position:relative;padding:48px 44px 44px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);
    background:var(--bg);
    transition:background .4s var(--ease), color .4s var(--ease);
    display:grid;grid-template-rows:auto auto 1fr auto;gap:24px;min-height:520px;
  }
  .feat-case:hover{background:var(--ink);color:#fff}
  .feat-case:hover .case-body{color:rgba(255,255,255,.7)}
  .feat-case:hover .case-tags span{border-color:rgba(255,255,255,.25);color:rgba(255,255,255,.8)}
  .feat-case:hover .case-cta{color:var(--accent)}
  .feat-case:hover .case-img{filter:invert(1) hue-rotate(180deg)}
  .feat-case:hover .case-num{color:rgba(255,255,255,.3)}
  .feat-case:hover .case-tag{color:rgba(255,255,255,.7)}
  .case-head{display:flex;justify-content:space-between;align-items:flex-start;gap:24px}
  .case-num{font-family:var(--mono);font-size:11px;letter-spacing:.14em;color:var(--mute2);transition:color .3s}
  .case-tag{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--mute);transition:color .3s}
  .case-img{
    aspect-ratio:16/9;background:
      repeating-linear-gradient(135deg, rgba(15,14,12,.04) 0 6px, transparent 6px 12px),
      var(--bg2);
    border:1px solid var(--line);
    display:grid;place-items:center;color:var(--mute2);font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;
    transition:filter .4s var(--ease);
  }
  .case-title{font-family:var(--serif);font-size:clamp(28px,2.6vw,38px);line-height:1.05;letter-spacing:-.02em;font-weight:400}
  .case-body{font-size:14.5px;line-height:1.62;color:var(--mute);transition:color .3s}
  .case-foot{display:flex;justify-content:space-between;align-items:center;gap:18px;padding-top:18px;border-top:1px solid var(--line);transition:border-color .3s}
  .feat-case:hover .case-foot{border-top-color:rgba(255,255,255,.18)}
  .case-tags{display:flex;gap:6px;flex-wrap:wrap}
  .case-tags span{
    font-family:var(--mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--mute);
    padding:5px 9px;border:1px solid var(--line);border-radius:999px;transition:all .3s;
  }
  .case-cta{font-family:var(--mono);font-size:11.5px;letter-spacing:.06em;color:var(--ink);transition:color .3s;white-space:nowrap}
  @media (max-width:900px){ .feat-cases{grid-template-columns:1fr} .feat-case{min-height:auto;padding:32px 28px} }

  .more-label{margin:96px 0 24px;display:flex;align-items:baseline;justify-content:space-between;gap:24px}
  .more-label h3{font-family:var(--serif);font-size:clamp(24px,2vw,32px);font-weight:400;letter-spacing:-.015em}
  .more-cases{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:1px solid var(--line);border-left:1px solid var(--line)}
  .more-case{
    padding:28px 24px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);
    display:flex;flex-direction:column;gap:14px;min-height:280px;
    transition:background .3s;
  }
  .more-case:hover{background:#fff}
  .more-case .case-tag{font-size:10px}
  .more-case h4{font-family:var(--serif);font-size:20px;line-height:1.15;font-weight:400;letter-spacing:-.015em;flex:1}
  .more-case p{font-size:13px;line-height:1.55;color:var(--mute)}
  @media (max-width:1100px){ .more-cases{grid-template-columns:repeat(2,1fr)} }
  @media (max-width:540px){ .more-cases{grid-template-columns:1fr} }

  /* Marquee */
  .marq{margin-top:80px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);overflow:hidden;padding:28px 0;background:var(--bg)}
  .marq-track{display:flex;gap:64px;animation:marq 38s linear infinite;white-space:nowrap;width:max-content}
  .marq-track span{font-family:var(--serif);font-style:italic;font-size:34px;color:var(--ink);letter-spacing:-.01em;opacity:.85}
  .marq-track span::after{content:" /";margin-left:48px;color:var(--accent);font-style:normal}
  @keyframes marq{from{transform:translateX(0)}to{transform:translateX(-50%)}}

  /* ============ SERVICES ============ */
  .services{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line-dk);border-left:1px solid var(--line-dk)}
  section.sec.dark .services{border-color:var(--line-dk)}
  .service{
    padding:48px 40px 56px;border-right:1px solid var(--line-dk);border-bottom:1px solid var(--line-dk);
    display:flex;flex-direction:column;gap:16px;position:relative;min-height:300px;
    transition:background .4s var(--ease);
  }
  .service:hover{background:rgba(255,255,255,.03)}
  .service.link:hover{background:rgba(255,119,44,.07)}
  .service .s-num{font-family:var(--mono);font-size:11px;letter-spacing:.14em;color:rgba(255,255,255,.4)}
  .service h3{
    font-family:var(--serif);font-size:32px;font-weight:400;line-height:1.05;letter-spacing:-.02em;
    color:#fff;margin-top:auto;display:flex;align-items:baseline;gap:10px;
  }
  .service h3 .ext{font-family:var(--mono);font-size:14px;color:var(--accent);font-style:normal}
  .service p{font-size:14px;line-height:1.62;color:rgba(255,255,255,.6);max-width:340px}
  @media (max-width:1000px){ .services{grid-template-columns:repeat(2,1fr)} }
  @media (max-width:560px){ .services{grid-template-columns:1fr} .service{min-height:auto;padding:32px 24px} }

  /* ============ GROUP ============ */
  .group-list{margin-top:32px;border-top:1px solid var(--line)}
  .group-row{
    display:grid;grid-template-columns:80px 1.2fr 2fr 80px;gap:32px;
    padding:32px 0;border-bottom:1px solid var(--line);align-items:center;
    transition:padding .35s var(--ease);
    cursor:default;
  }
  .group-row:hover{padding-left:18px;background:linear-gradient(90deg, rgba(255,119,44,.04), transparent 40%)}
  .group-row .g-num{font-family:var(--mono);font-size:12px;color:var(--mute)}
  .group-row .g-name{font-family:var(--serif);font-size:clamp(28px,3vw,44px);line-height:1.05;letter-spacing:-.02em;font-weight:400}
  .group-row .g-name em{font-style:italic;color:var(--accent)}
  .group-row .g-desc{font-size:15px;line-height:1.6;color:var(--mute);max-width:520px}
  .group-row .g-go{
    width:48px;height:48px;border:1px solid var(--line);border-radius:50%;
    display:grid;place-items:center;justify-self:end;color:var(--mute);
    transition:all .3s var(--ease);
  }
  .group-row:hover .g-go{background:var(--accent);border-color:var(--accent);color:#fff;transform:rotate(-45deg)}
  @media (max-width:900px){
    .group-row{grid-template-columns:60px 1fr;gap:18px}
    .group-row .g-desc, .group-row .g-go{grid-column:1 / -1}
    .group-row .g-desc{padding-left:78px}
    .group-row .g-go{display:none}
  }
  @media (max-width:540px){
    .group-row .g-desc{padding-left:0}
  }

  /* ============ LEADERSHIP ============ */
  .team{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:1px solid var(--line);border-left:1px solid var(--line)}
  .tm{
    padding:36px 32px 40px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);
    display:flex;flex-direction:column;gap:18px;min-height:380px;background:var(--bg);
  }
  .tm.ft{grid-column:span 2;background:#fff}
  .tm-portrait{
    aspect-ratio:1/1;max-width:88px;
    border-radius:50%;
    background:
      conic-gradient(from 220deg, var(--accent) 0deg, var(--ink) 120deg, var(--bg2) 240deg, var(--accent) 360deg);
    position:relative;overflow:hidden;
  }
  .tm-portrait::after{
    content:"";position:absolute;inset:3px;border-radius:50%;
    background:var(--bg2);
  }
  .tm-portrait .initials{
    position:absolute;inset:0;display:grid;place-items:center;z-index:2;
    font-family:var(--serif);font-style:italic;font-size:32px;color:var(--ink);letter-spacing:-.02em;
  }
  .tm.ft .tm-portrait{max-width:120px}
  .tm.ft .tm-portrait .initials{font-size:44px}
  .tm h3{font-family:var(--serif);font-size:24px;font-weight:400;line-height:1.15;letter-spacing:-.015em}
  .tm.ft h3{font-size:32px}
  .tm .role{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--accent)}
  .tm p{font-size:13.5px;line-height:1.6;color:var(--mute)}
  @media (max-width:900px){ .team{grid-template-columns:repeat(2,1fr)} .tm.ft{grid-column:span 2} }
  @media (max-width:540px){ .team{grid-template-columns:1fr} .tm.ft{grid-column:span 1} }

  /* ============ CLIENTS ============ */
  .clients-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:1px solid var(--line);border-left:1px solid var(--line)}
  .cli-col{
    padding:40px 36px 44px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);
    background:var(--bg);
  }
  .cli-col h3{
    font-family:var(--serif);font-size:28px;font-weight:400;letter-spacing:-.015em;
    padding-bottom:20px;border-bottom:1px solid var(--line);margin-bottom:24px;
    display:flex;justify-content:space-between;align-items:baseline;
  }
  .cli-col h3 .ct{font-family:var(--mono);font-size:11px;color:var(--mute);letter-spacing:.1em}
  .cli-col ul{list-style:none;display:flex;flex-direction:column;gap:14px}
  .cli-col li{font-size:15px;line-height:1.45;color:var(--ink);display:flex;align-items:baseline;gap:10px;letter-spacing:-.005em}
  .cli-col li::before{content:"";width:5px;height:1px;background:var(--accent);display:inline-block;flex-shrink:0;position:relative;top:-5px}
  @media (max-width:900px){ .clients-grid{grid-template-columns:1fr} }

  /* ============ CONTACT ============ */
  .contact{display:grid;grid-template-columns:1.4fr 1fr;gap:72px;align-items:start}
  .contact h2{margin:18px 0 28px}
  .contact-email{
    display:inline-flex;align-items:center;gap:14px;margin-top:8px;
    font-family:var(--serif);font-size:clamp(28px,3vw,42px);font-style:italic;color:var(--ink);letter-spacing:-.015em;
    padding-bottom:6px;border-bottom:1px solid var(--line);transition:border-color .3s, color .3s;
  }
  .contact-email:hover{color:var(--accent);border-bottom-color:var(--accent)}
  .contact-addr{margin-top:42px;display:grid;grid-template-columns:1fr 1fr;gap:32px;max-width:540px}
  .contact-addr h4{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--mute);margin-bottom:10px}
  .contact-addr p{font-size:15px;line-height:1.6;color:var(--ink)}
  .contact-side{
    border:1px solid var(--line);background:#fff;padding:36px 32px;
    display:flex;flex-direction:column;gap:20px;
  }
  .contact-side h4{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--mute)}
  .contact-side ul{list-style:none;display:flex;flex-direction:column;gap:14px}
  .contact-side li{font-size:15px;display:flex;justify-content:space-between;border-bottom:1px dashed var(--line);padding-bottom:14px}
  .contact-side li:last-child{border:none;padding-bottom:0}
  .contact-side li .v{color:var(--mute);font-family:var(--mono);font-size:12px;letter-spacing:.04em}
  @media (max-width:900px){ .contact{grid-template-columns:1fr;gap:40px} .contact-addr{grid-template-columns:1fr} }

  /* ============ FOOTER ============ */
  footer{background:var(--ink);color:#fff;padding:96px 0 32px}
  footer .ft-top{display:grid;grid-template-columns:2fr 1fr 1fr;gap:48px;padding-bottom:64px;border-bottom:1px solid var(--line-dk)}
  footer .ft-brand .brand-mark{border-color:#fff;color:#fff}
  footer .ft-brand p{font-family:var(--serif);font-style:italic;font-size:22px;line-height:1.4;color:rgba(255,255,255,.85);max-width:380px;margin-top:24px;letter-spacing:-.01em}
  footer h5{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.55);margin-bottom:18px}
  footer ul{list-style:none;display:flex;flex-direction:column;gap:12px}
  footer ul a{font-size:14px;color:rgba(255,255,255,.85);transition:color .25s}
  footer ul a:hover{color:var(--accent)}
  footer .ft-bot{display:flex;justify-content:space-between;align-items:center;padding-top:32px;gap:24px;flex-wrap:wrap}
  footer .ft-bot .meta{font-size:11px;color:rgba(255,255,255,.5)}
  footer .ft-bot .legal{display:flex;gap:24px}
  footer .ft-bot a{font-size:12px;color:rgba(255,255,255,.6);transition:color .25s}
  footer .ft-bot a:hover{color:#fff}
  @media (max-width:900px){ footer .ft-top{grid-template-columns:1fr 1fr;gap:40px 32px} footer .ft-brand{grid-column:span 2} }
  @media (max-width:540px){ footer .ft-top{grid-template-columns:1fr} footer .ft-brand{grid-column:span 1} }

  /* ============ REVEAL ANIM ============ */
  .rv{opacity:0;transform:translateY(18px);transition:opacity .9s var(--ease), transform .9s var(--ease)}
  .rv.in{opacity:1;transform:none}
  @media (prefers-reduced-motion: reduce){
    .rv{opacity:1;transform:none;transition:none}
  }

  /* ============ TWEAKS BIND ============ */
  body[data-palette="sand"]{--accent:#C4783B}
  body[data-palette="ink-blue"]{--accent:#3956E7}
  body[data-palette="emerald"]{--accent:#2F8C5A}
  body[data-type="sans"] .display{font-family:var(--sans);font-weight:300;letter-spacing:-.04em;line-height:.96}
  body[data-type="sans"] .display em{font-style:normal;font-weight:600;color:var(--accent)}
  body[data-type="sans"] .case-title,
  body[data-type="sans"] .group-row .g-name,
  body[data-type="sans"] .more-case h4,
  body[data-type="sans"] .tm h3,
  body[data-type="sans"] .cli-col h3,
  body[data-type="sans"] .service h3,
  body[data-type="sans"] .contact-email,
  body[data-type="sans"] footer .ft-brand p,
  body[data-type="sans"] .lead{font-family:var(--sans);letter-spacing:-.02em;font-weight:400;font-style:normal}
  body[data-type="sans"] .lead{font-weight:400}
  body[data-density="tight"] section.sec{padding:90px 0}
  body[data-density="tight"] .sec-head{margin-bottom:48px;gap:32px}
  body[data-density="tight"] .hero{padding-top:130px}
  body[data-density="tight"] .feat-case{min-height:440px;padding:32px 28px}
  body[data-density="loose"] section.sec{padding:180px 0}
  body[data-density="loose"] .sec-head{margin-bottom:110px}


/* ============ INNER PAGE — SHARED ============ */
.page-hero{padding:180px 0 96px;background:var(--bg);position:relative;overflow:hidden}
.page-hero::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(900px 600px at 95% 12%, rgba(255,119,44,.06), transparent 60%)}
.page-hero .wrap{position:relative;z-index:1}
.back-link{display:inline-flex;align-items:center;gap:10px;font-family:var(--mono);font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--mute);margin-bottom:40px;transition:color .25s, gap .25s}
.back-link:hover{color:var(--accent);gap:14px}
.back-link::before{content:"←";color:var(--accent)}
.page-hero h1{margin-top:18px;max-width:1200px}
.page-hero .intro{font-family:var(--serif);font-style:italic;font-size:clamp(20px,1.8vw,30px);line-height:1.35;color:var(--ink2);max-width:780px;margin-top:48px;letter-spacing:-.01em}
.page-hero .cta-row{margin-top:44px;display:flex;gap:14px;flex-wrap:wrap}

/* ============ SERVICE PAGE ============ */
.svc-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:1px solid var(--line);border-left:1px solid var(--line);margin-bottom:80px}
.svc-stat{padding:36px 32px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--bg);display:flex;flex-direction:column;gap:8px}
.svc-stat .n{font-family:var(--serif);font-size:clamp(48px,5vw,72px);line-height:1;letter-spacing:-.02em;color:var(--ink)}
.svc-stat .n em{font-style:italic;color:var(--accent)}
.svc-stat .l{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--mute)}
@media (max-width:760px){ .svc-stats{grid-template-columns:1fr} }

.offer-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:1px solid var(--line);border-left:1px solid var(--line)}
.offer-item{padding:36px 32px 40px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--bg);display:flex;flex-direction:column;gap:14px;min-height:240px;transition:background .3s}
.offer-item:hover{background:#fff}
.offer-item .n{font-family:var(--mono);font-size:11px;letter-spacing:.12em;color:var(--accent)}
.offer-item h4{font-family:var(--serif);font-size:24px;font-weight:400;line-height:1.15;letter-spacing:-.015em;color:var(--ink)}
.offer-item p{font-size:14px;line-height:1.6;color:var(--mute);margin-top:auto}
@media (max-width:1000px){ .offer-grid{grid-template-columns:repeat(2,1fr)} }
@media (max-width:560px){ .offer-grid{grid-template-columns:1fr} .offer-item{min-height:auto} }

.why-block{margin-top:120px;display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:start}
.why-block .why-copy p{font-size:15.5px;line-height:1.78;color:var(--ink2);margin-bottom:20px}
.why-block .why-copy p:last-child{margin-bottom:0}
.why-block .why-copy p strong{color:var(--ink)}
@media (max-width:900px){ .why-block{grid-template-columns:1fr;gap:32px} }

.faq-list{margin-top:48px;border-top:1px solid var(--line)}
.faq-item{padding:28px 0;border-bottom:1px solid var(--line);display:grid;grid-template-columns:60px 1fr;gap:32px;cursor:pointer;transition:padding .3s}
.faq-item:hover{padding-left:14px}
.faq-item .fq-n{font-family:var(--mono);font-size:12px;color:var(--mute);letter-spacing:.1em;padding-top:4px}
.faq-item h4{font-family:var(--serif);font-size:22px;font-weight:400;line-height:1.25;letter-spacing:-.015em;color:var(--ink);margin-bottom:14px}
.faq-item p{font-size:14.5px;line-height:1.65;color:var(--mute);max-width:760px}
@media (max-width:760px){ .faq-item{grid-template-columns:1fr;gap:8px} }

.cli-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:1px solid var(--line);border-left:1px solid var(--line)}
.cli-cards .cc{padding:28px 24px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--bg);font-family:var(--serif);font-size:20px;font-weight:400;letter-spacing:-.015em;color:var(--ink);min-height:120px;display:flex;align-items:center;transition:background .3s}
.cli-cards .cc:hover{background:#fff}
@media (max-width:900px){ .cli-cards{grid-template-columns:repeat(2,1fr)} }
@media (max-width:540px){ .cli-cards{grid-template-columns:1fr} }

.cta-band{margin-top:0;background:var(--ink);color:#fff;padding:140px 0;text-align:center}
.cta-band h2{font-family:var(--serif);font-size:clamp(40px,5vw,80px);font-weight:400;line-height:1.02;letter-spacing:-.02em;max-width:900px;margin:0 auto 24px}
.cta-band h2 em{font-style:italic;color:var(--accent)}
.cta-band p{font-family:var(--serif);font-style:italic;font-size:22px;color:rgba(255,255,255,.7);max-width:560px;margin:0 auto 36px;line-height:1.4}
.cta-band .btn-primary{background:#fff;color:var(--ink)}
.cta-band .btn-primary:hover{background:var(--accent);color:#fff}

/* ============ CASE STUDY PAGE ============ */
.cs-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:1px solid var(--ink);border-bottom:1px solid var(--line);margin:0 0 96px}
.cs-stat{padding:48px 32px;border-right:1px solid var(--line);background:var(--bg);display:flex;flex-direction:column;gap:10px}
.cs-stat:last-child{border-right:none}
.cs-stat .n{font-family:var(--serif);font-size:clamp(56px,6vw,84px);line-height:1;color:var(--ink);letter-spacing:-.02em}
.cs-stat .n em{font-style:italic;color:var(--accent)}
.cs-stat .l{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--mute)}
@media (max-width:760px){ .cs-stats{grid-template-columns:1fr} .cs-stat{border-right:none;border-bottom:1px solid var(--line)} .cs-stat:last-child{border-bottom:none} }

.cs-section{display:grid;grid-template-columns:240px 1fr;gap:64px;padding:64px 0;border-bottom:1px solid var(--line);align-items:start}
.cs-section:last-child{border-bottom:none}
.cs-section h2{font-family:var(--serif);font-size:clamp(32px,3vw,48px);font-weight:400;line-height:1.05;letter-spacing:-.02em;color:var(--ink);position:sticky;top:120px}
.cs-section .body p{font-size:16.5px;line-height:1.75;color:var(--ink2);margin-bottom:20px}
.cs-section .body p:last-child{margin-bottom:0}
.cs-section .body a{color:var(--accent);border-bottom:1px solid currentColor}
@media (max-width:900px){ .cs-section{grid-template-columns:1fr;gap:20px;padding:48px 0} .cs-section h2{position:static} }

.cs-meta-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin:0 0 96px;border-top:1px solid var(--line);border-left:1px solid var(--line);background:var(--bg)}
.cs-meta-grid .m{padding:24px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
.cs-meta-grid .m h5{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--mute);margin-bottom:10px}
.cs-meta-grid .m p{font-size:14.5px;line-height:1.4;color:var(--ink);letter-spacing:-.005em}
@media (max-width:760px){ .cs-meta-grid{grid-template-columns:repeat(2,1fr)} }

.cs-hero-img{aspect-ratio:21/9;background:repeating-linear-gradient(135deg, rgba(15,14,12,.05) 0 8px, transparent 8px 16px),var(--bg2);border:1px solid var(--line);margin-bottom:96px;display:grid;place-items:center;color:var(--mute2);font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase}

/* ============ BLOG ============ */
.blog-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:0;border-top:1px solid var(--line);border-left:1px solid var(--line)}
.blog-card{padding:48px 40px;background:var(--bg);cursor:pointer;border-right:1px solid var(--line);border-bottom:1px solid var(--line);display:flex;flex-direction:column;gap:18px;min-height:340px;transition:background .3s, transform .3s}
.blog-card:hover{background:#fff}
.blog-card .row{display:flex;justify-content:space-between;align-items:center}
.blog-card .num{font-family:var(--mono);font-size:11px;letter-spacing:.14em;color:var(--mute2)}
.blog-card .tag{font-family:var(--mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--accent);padding:5px 10px;border:1px solid var(--accent);border-radius:999px}
.blog-card h3{font-family:var(--serif);font-size:26px;font-weight:400;line-height:1.15;letter-spacing:-.015em;color:var(--ink)}
.blog-card p{font-size:14.5px;line-height:1.6;color:var(--mute)}
.blog-card .foot{margin-top:auto;display:flex;justify-content:space-between;align-items:center;padding-top:18px;border-top:1px solid var(--line);font-family:var(--mono);font-size:11px;color:var(--mute);letter-spacing:.06em}
.blog-card .foot .ar{color:var(--ink);transition:color .25s, transform .3s}
.blog-card:hover .foot .ar{color:var(--accent);transform:translateX(4px)}
@media (max-width:900px){ .blog-grid{grid-template-columns:1fr} }

.article{max-width:780px;margin:0 auto;padding:0}
.article .article-meta{font-family:var(--mono);font-size:11.5px;letter-spacing:.08em;color:var(--mute);text-transform:uppercase;display:flex;gap:18px;flex-wrap:wrap;margin-bottom:24px}
.article .article-tag{color:var(--accent)}
.article p{font-size:17px;line-height:1.78;color:var(--ink2);margin-bottom:24px}
.article p:first-of-type{font-family:var(--serif);font-size:22px;font-style:italic;line-height:1.45;color:var(--ink);margin-bottom:48px;padding-bottom:36px;border-bottom:1px solid var(--line)}
.article h2{font-family:var(--serif);font-size:clamp(28px,2.6vw,38px);font-weight:400;line-height:1.1;letter-spacing:-.015em;color:var(--ink);margin:56px 0 20px}
.article h3{font-family:var(--serif);font-size:24px;font-weight:400;line-height:1.2;color:var(--ink);margin:40px 0 16px}
.article ul, .article ol{margin:0 0 24px 22px;padding:0}
.article li{font-size:17px;line-height:1.7;color:var(--ink2);margin-bottom:10px}
.article a{color:var(--accent);border-bottom:1px solid rgba(255,119,44,.4);transition:border-color .25s}
.article a:hover{border-bottom-color:var(--accent)}
.article .blog-cta-box{margin:56px 0 0;padding:36px 32px;background:var(--ink);color:#fff;display:flex;flex-direction:column;gap:18px}
.article .blog-cta-box p{font-family:var(--serif);font-style:italic;font-size:22px;line-height:1.4;color:rgba(255,255,255,.9);margin:0}
.article .blog-cta-box .bp{align-self:flex-start;background:var(--accent);color:#fff;padding:13px 24px;font-size:13px;font-weight:500;border-radius:999px;letter-spacing:-.005em}
.article .blog-cta-box .bp:hover{background:#fff;color:var(--ink)}

.read-next{margin-top:120px;padding-top:64px;border-top:1px solid var(--line)}
.read-next h3{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--mute);margin-bottom:32px}
.read-next .blog-grid{margin:0}

/* ============ LEGAL PAGE ============ */
.legal-body{max-width:820px;margin:0 auto}
.legal-body .legal-section{padding:48px 0;border-bottom:1px solid var(--line);display:grid;grid-template-columns:180px 1fr;gap:48px;align-items:start}
.legal-body .legal-section:last-child{border-bottom:none}
.legal-body .legal-section h2{font-family:var(--serif);font-size:22px;font-weight:400;line-height:1.2;color:var(--ink);letter-spacing:-.01em;position:sticky;top:120px}
.legal-body .legal-section h2 .n{display:block;font-family:var(--mono);font-size:11px;color:var(--accent);letter-spacing:.1em;margin-bottom:6px}
.legal-body .legal-section .legal-content p{font-size:15.5px;line-height:1.78;color:var(--ink2);margin-bottom:14px}
.legal-body .legal-section .legal-content ul, .legal-body .legal-section .legal-content ol{margin:0 0 16px 20px}
.legal-body .legal-section .legal-content li{font-size:15.5px;line-height:1.78;color:var(--ink2);margin-bottom:6px}
@media (max-width:760px){ .legal-body .legal-section{grid-template-columns:1fr;gap:14px} .legal-body .legal-section h2{position:static} }

/* ============ RTL / ARABIC ============ */
:root {
  --serif-ar:'IBM Plex Sans Arabic','IBM Plex Sans',sans-serif;
  --sans-ar:'IBM Plex Sans Arabic','IBM Plex Sans',sans-serif;
}
html[dir="rtl"] body { font-family: var(--sans-ar); letter-spacing: 0; }
html[dir="rtl"] .display { font-family: var(--serif-ar); letter-spacing: 0; line-height:1.05; font-weight:400 }
html[dir="rtl"] .display em { font-style: normal; color: var(--accent); font-weight:700 }
html[dir="rtl"] .lead { font-family: var(--serif-ar); font-style: normal; letter-spacing: 0; line-height:1.5 }
html[dir="rtl"] .case-title,
html[dir="rtl"] .group-row .g-name,
html[dir="rtl"] .more-case h4,
html[dir="rtl"] .tm h3,
html[dir="rtl"] .cli-col h3,
html[dir="rtl"] .service h3,
html[dir="rtl"] .contact-email,
html[dir="rtl"] footer .ft-brand p,
html[dir="rtl"] .article h2,
html[dir="rtl"] .article h3,
html[dir="rtl"] .blog-card h3,
html[dir="rtl"] .offer-item h4,
html[dir="rtl"] .faq-item h4,
html[dir="rtl"] .cs-stat .n,
html[dir="rtl"] .svc-stat .n,
html[dir="rtl"] .stat .num,
html[dir="rtl"] .cli-cards .cc,
html[dir="rtl"] .marq-track span,
html[dir="rtl"] .cs-section h2,
html[dir="rtl"] .cta-band h2,
html[dir="rtl"] .legal-body .legal-section h2 { font-family: var(--serif-ar); letter-spacing: 0; font-style:normal; line-height:1.15 }
html[dir="rtl"] .display em,
html[dir="rtl"] .stat .num .plus,
html[dir="rtl"] .stat .num .pct,
html[dir="rtl"] .group-row .g-name em,
html[dir="rtl"] .cs-stat .n em,
html[dir="rtl"] .svc-stat .n em { font-style: normal; font-weight:700 }
html[dir="rtl"] .marq-track span { font-style:normal }
html[dir="rtl"] .marq-track span::after { content:" / "; }
html[dir="rtl"] .marq-track { animation-direction: reverse }

/* Eyebrow + arrow icons */
html[dir="rtl"] .eyebrow::before { display: none }
html[dir="rtl"] .eyebrow::after { content:""; width:24px; height:1px; background:currentColor; display:inline-block; opacity:.45; margin-right:10px; order:-1 }
html[dir="rtl"] .eyebrow { gap: 10px }

html[dir="rtl"] .back-link::before { content:"→"; color:var(--accent) }
html[dir="rtl"] .back-link:hover { gap: 14px }

/* Buttons: flip arrow direction on hover */
html[dir="rtl"] .nav-cta:hover .arrow { transform: translateX(-3px) }
html[dir="rtl"] .btn:hover .arrow { transform: translate(-3px,-3px) }

/* Hero asymmetric indent: right instead of left */
html[dir="rtl"] .hero-headline h1 .row.indent { padding-left: 0; padding-right: 14vw }
html[dir="rtl"] .hero-spork .spork-def { border-left: none; border-right: 1px solid var(--line); padding-left: 0; padding-right: 14px }
html[dir="rtl"] .hero-loc { align-items: flex-start; text-align: left }
html[dir="rtl"] .hero-top { flex-direction: row-reverse }

/* Stats numerals — keep ASCII numerals for clarity */
html[dir="rtl"] .stat .num,
html[dir="rtl"] .svc-stat .n,
html[dir="rtl"] .cs-stat .n { direction: ltr; text-align: right }

/* List bullets flip */
html[dir="rtl"] .cli-col li { flex-direction: row-reverse }

/* Group row chevron */
html[dir="rtl"] .group-row:hover { padding-left: 0; padding-right: 18px; background:linear-gradient(270deg, rgba(255,119,44,.04), transparent 40%) }
html[dir="rtl"] .group-row .g-go { justify-self: start }
html[dir="rtl"] .group-row:hover .g-go { transform: rotate(45deg) }

/* Case section sticky h2 alignment */
html[dir="rtl"] .cs-section h2 { text-align: right }

/* Legal: section number */
html[dir="rtl"] .legal-body .legal-section h2 .n { margin-bottom:6px }

/* Article first letter / lead paragraph */
html[dir="rtl"] .article p:first-of-type { font-style: normal; font-family: var(--serif-ar) }
html[dir="rtl"] .article a { border-bottom-color: rgba(255,119,44,.4) }

/* Hero spork glyph */
html[dir="rtl"] .hero-spork .spork-glyph { font-style: normal }

/* Misc text-align */
html[dir="rtl"] .nav-links { padding-inline-start: 0 }
html[dir="rtl"] .more-label { text-align: right }
html[dir="rtl"] .case-num { direction: ltr }

/* Footer: keep grid but reverse columns for natural Arabic reading order */
html[dir="rtl"] footer .ft-top { direction: rtl }
html[dir="rtl"] footer .ft-bot { direction: rtl }
html[dir="rtl"] footer ul a { direction: rtl }

/* Section head order: title on right, lead on left for RTL */
html[dir="rtl"] .sec-head { direction: rtl }

/* Reverse mb-btn span animation - no impact */

/* Reveal stays the same */


/* ============ BRAND LOGO ============ */
.brand-logo{
  width:36px;height:36px;object-fit:contain;
  flex-shrink:0;display:block;
}
nav.site.scrolled .brand-logo{ width:32px;height:32px }
footer .brand-logo{ filter: brightness(0) invert(1); width:36px;height:36px }
/* Hide old text-based brand-mark if any remains */
.brand-mark{display:none}

/* Force IBM Plex Sans Arabic to display optical for em accent — italic-like via slant */
.display em, .case-title em, .group-row .g-name em,
.cli-col h3 em, .more-case h4 em, .tm h3 em, .article h2 em,
.cta-band h2 em, .hero-spork .spork-glyph em { font-style:normal; color:var(--accent); font-weight:600 }

/* Spork glyph: large display, no italic */
.hero-spork .spork-glyph{ font-family:var(--sans); font-style:normal; font-weight:300 }

/* RTL display: keep sans (no Amiri) */
html[dir="rtl"] .display { font-family:var(--sans-ar); font-weight:300 }
html[dir="rtl"] .lead { font-family:var(--sans-ar); font-weight:300 }
html[dir="rtl"] .display em { font-weight:700; font-style:normal }
html[dir="rtl"] .case-title,
html[dir="rtl"] .group-row .g-name,
html[dir="rtl"] .more-case h4,
html[dir="rtl"] .tm h3,
html[dir="rtl"] .cli-col h3,
html[dir="rtl"] .service h3,
html[dir="rtl"] .contact-email,
html[dir="rtl"] footer .ft-brand p,
html[dir="rtl"] .article h2,
html[dir="rtl"] .article h3,
html[dir="rtl"] .blog-card h3,
html[dir="rtl"] .offer-item h4,
html[dir="rtl"] .faq-item h4,
html[dir="rtl"] .cs-stat .n,
html[dir="rtl"] .svc-stat .n,
html[dir="rtl"] .stat .num,
html[dir="rtl"] .cli-cards .cc,
html[dir="rtl"] .marq-track span,
html[dir="rtl"] .cs-section h2,
html[dir="rtl"] .cta-band h2,
html[dir="rtl"] .legal-body .legal-section h2 { font-family:var(--sans-ar); font-style:normal }

/* Override italic font-style anywhere in light/contact-email */
.contact-email { font-style:normal; font-family:var(--sans); font-weight:300 }
.article p:first-of-type { font-style:normal; font-family:var(--sans); font-weight:400 }
footer .ft-brand p { font-style:normal; font-family:var(--sans); font-weight:300 }
.article .blog-cta-box p { font-style:normal; font-family:var(--sans); font-weight:400 }
.cta-band p { font-style:normal; font-family:var(--sans); font-weight:300 }
.lead { font-style:normal }
.marq-track span { font-style:normal; font-family:var(--sans); font-weight:300 }


/* ============ MOBILE DRAWER ============ */
.mb-drawer{
  position:fixed;inset:0;z-index:200;background:var(--ink);color:#fff;
  display:flex;flex-direction:column;padding:80px 40px 40px;gap:8px;
  opacity:0;pointer-events:none;transform:translateY(-8px);
  transition:opacity .35s var(--ease), transform .35s var(--ease);
  overflow-y:auto;
}
.mb-drawer.open{opacity:1;pointer-events:auto;transform:none}
.mb-drawer .mb-close{
  position:absolute;top:18px;right:22px;background:none;border:none;color:#fff;
  width:44px;height:44px;display:grid;place-items:center;font-size:22px;cursor:pointer;
}
html[dir="rtl"] .mb-drawer .mb-close{right:auto;left:22px}
.mb-drawer a{
  font-family:var(--sans);font-size:24px;font-weight:300;color:#fff;
  padding:18px 0;border-bottom:1px solid rgba(255,255,255,.12);letter-spacing:-.01em;
  display:flex;align-items:center;justify-content:space-between;
}
.mb-drawer a:last-of-type{border-bottom:none}
.mb-drawer a::after{content:"→";opacity:.4;font-size:18px}
html[dir="rtl"] .mb-drawer a::after{content:"←"}
.mb-drawer .mb-cta{
  margin-top:24px;background:var(--accent);color:#fff;padding:18px 24px;
  border-radius:999px;justify-content:center;border-bottom:none;font-weight:500;
}
.mb-drawer .mb-cta::after{display:none}
.mb-drawer .mb-lang{
  margin-top:18px;border:1px solid rgba(255,255,255,.18);padding:14px 24px;
  border-radius:999px;justify-content:center;font-size:13px;letter-spacing:.04em;
  font-family:var(--mono);border-bottom:none;
}
.mb-drawer .mb-lang::after{display:none}
body.mb-open{overflow:hidden}

/* Hide placeholder visual blocks (no real imagery yet) */
.case-img,.cs-hero-img{display:none}
.feat-case{grid-template-rows:auto 1fr auto;min-height:auto;gap:20px}

/* Make brand-logo a bit larger on cleaner cards */
nav.site .brand-logo{transition:width .3s var(--ease), height .3s var(--ease)}


/* ============ UNIFIED CARD CTA ============ */
.card-cta{
  display:inline-flex;align-items:center;gap:8px;
  font-family:var(--sans);font-size:13px;font-weight:500;letter-spacing:-.005em;
  padding:11px 18px;border-radius:999px;
  background:var(--ink);color:#fff;
  border:1px solid var(--ink);
  transition:background .25s, color .25s, border-color .25s, transform .25s var(--ease);
  text-decoration:none;width:max-content;align-self:flex-start;
  min-height:42px;
}
.card-cta .arrow{display:inline-block;transition:transform .3s var(--ease)}
.feat-case:hover .card-cta,
.more-case:hover .card-cta,
.service.link:hover .card-cta,
.blog-card:hover .card-cta,
.card-cta:hover{background:var(--accent);border-color:var(--accent);color:#fff}
.feat-case:hover .card-cta .arrow,
.more-case:hover .card-cta .arrow,
.service.link:hover .card-cta .arrow,
.blog-card:hover .card-cta .arrow,
.card-cta:hover .arrow{transform:translateX(4px)}
html[dir="rtl"] .feat-case:hover .card-cta .arrow,
html[dir="rtl"] .more-case:hover .card-cta .arrow,
html[dir="rtl"] .service.link:hover .card-cta .arrow,
html[dir="rtl"] .blog-card:hover .card-cta .arrow,
html[dir="rtl"] .card-cta:hover .arrow{transform:translateX(-4px)}

/* On dark services section: invert the CTA */
section.sec.dark .card-cta{background:#fff;color:var(--ink);border-color:#fff}
section.sec.dark .service.link:hover .card-cta,
section.sec.dark .card-cta:hover{background:var(--accent);color:#fff;border-color:var(--accent)}

/* When the feat-case is in its dark hover state, invert again */
.feat-case:hover .card-cta{background:#fff;color:var(--ink);border-color:#fff}
.feat-case:hover:hover .card-cta:hover{background:var(--accent);color:#fff;border-color:var(--accent)}

/* Service cards: drop the tiny .ext arrow since we now have a real CTA */
.service h3 .ext{display:none}

/* Blog/case cards: drop the small text affordances that we're replacing */
.feat-case .case-cta{display:none}
.blog-card .foot .ar{display:none}
.blog-card .foot{justify-content:flex-start}

/* Mobile: make CTAs bigger for touch */
@media (max-width:760px){
  .card-cta{font-size:14px;padding:13px 20px;min-height:46px}
}

/* Cards that link should have a subtle persistent indicator */
.service.link,
.feat-case,
.more-case[href],
.blog-card[href]{position:relative}

/* Make sure service cards with .link get the CTA at the bottom */
.service{padding-bottom:90px;position:relative}
.service h3{margin-top:auto}
.service .card-cta{position:absolute;bottom:32px;left:40px;margin-top:0}
html[dir="rtl"] .service .card-cta{left:auto;right:40px}
@media (max-width:560px){
  .service{padding-bottom:80px}
  .service .card-cta{left:24px;bottom:24px}
  html[dir="rtl"] .service .card-cta{left:auto;right:24px}
}

/* More-case cards (currently not linked) shouldn't show a CTA */
.more-case{cursor:default}
.more-case[href]{cursor:pointer}