/* SEVEN — Final bilingual content layer. V5 premium interaction system remains authoritative. */
:root{--brand-wine:#7f1730;--brand-rose:#98233f}
.brand{width:178px}.header.scrolled .brand{width:160px}.brand img{max-height:54px;object-fit:contain}
.header .nav{background:rgba(8,9,11,.12)}
.header.scrolled .nav{background:rgba(10,11,13,.78)}

/* Real media */
.hero-media video{object-position:center center;filter:saturate(.98) contrast(1.08) brightness(.72)}
.feature-media.real-media,.page-hero-card.real-media{padding:0;background:#121318;border-color:rgba(255,255,255,.14)}
.feature-media.real-media img,.page-hero-card.real-media img{width:100%;height:100%;object-fit:cover}
.feature-media.real-media::after,.page-hero-card.real-media::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(5,6,8,.55),transparent 55%);pointer-events:none}
.page-hero-card.real-media{min-height:520px}
.page-hero-card.real-media img{position:absolute;inset:0}

/* Founders */
.founders-section{background:var(--paper);color:var(--ink)}
.founders-head{display:grid;grid-template-columns:1fr .8fr;gap:clamp(2rem,7vw,7rem);align-items:end;margin-bottom:54px}
.founders-head .lead{color:#5d5753;margin-bottom:4px}
.founder-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.founder-card{overflow:hidden;border-radius:30px;background:#fff;border:1px solid rgba(32,33,36,.11);box-shadow:0 28px 70px rgba(31,31,31,.08)}
.founder-media{aspect-ratio:4/5;overflow:hidden;background:#d9d3cf;position:relative}
.founder-media img{width:100%;height:100%;object-fit:cover}
.founder-card.hussain .founder-media img{object-position:center 8%}
.founder-card.yousif .founder-media img{object-position:center 18%}
.founder-body{padding:clamp(26px,4vw,42px)}
.founder-role{display:block;font-size:.69rem;letter-spacing:.14em;text-transform:uppercase;font-weight:800;color:var(--wine)}
.founder-body h3{font-size:clamp(2rem,3.8vw,4rem);line-height:.98;letter-spacing:-.055em;margin:12px 0 18px}
.founder-body p{color:#5b5552;line-height:1.75;margin:0}
.partnership-note{margin-top:18px;padding:clamp(28px,4vw,44px);border-radius:28px;background:var(--ink);color:#fff;display:grid;grid-template-columns:.65fr 1.35fr;gap:40px;align-items:start}
.partnership-note h3{font-size:clamp(1.8rem,3.2vw,3.5rem);line-height:1;letter-spacing:-.045em;margin:0}
.partnership-note p{margin:0;color:rgba(255,255,255,.66);line-height:1.75}

/* Client names until approved logos are inserted */
.logo-slot::before{display:none}.logo-slot{min-width:220px;font-size:.83rem;letter-spacing:.08em;color:rgba(255,255,255,.72);padding:18px 26px;border:1px solid rgba(255,255,255,.12);border-radius:999px;background:rgba(255,255,255,.035)}

/* Real work gallery */
.work-card{padding:0;justify-content:flex-end;background:#17181c!important;color:#fff!important}
.work-card::before{z-index:1;background:linear-gradient(0deg,rgba(5,6,8,.95),rgba(5,6,8,.08) 68%)!important;opacity:1}
.work-card .work-image{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease-expo),filter .9s var(--ease-expo)}
.work-card:hover .work-image{transform:scale(1.045);filter:saturate(1.06)}
.work-card .work-copy{position:relative;z-index:2;padding:clamp(25px,3.4vw,42px)}
.work-card .asset-label{position:static;display:inline-block;margin-bottom:14px;color:#ff8b97!important}
.work-card h3{color:#fff!important}.work-card p{color:rgba(255,255,255,.68)!important}
.work-card.project-wide{grid-column:span 8;min-height:610px}.work-card.project-tall{grid-column:span 4;min-height:610px}
.work-card.project-five{grid-column:span 5;min-height:470px}.work-card.project-three{grid-column:span 3;min-height:470px}.work-card.project-four{grid-column:span 4;min-height:470px}
.work-card.project-six{grid-column:span 6;min-height:500px}
.work-card .project-metrics{display:flex;gap:24px;margin-top:18px;flex-wrap:wrap}.project-metrics b{font-size:1.5rem}.project-metrics span{display:block;font-size:.6rem;letter-spacing:.11em;text-transform:uppercase;color:rgba(255,255,255,.55)}

/* Dedicated pages */
.page-hero{background:#090a0c}.page-hero::before{background:radial-gradient(circle at 76% 40%,rgba(180,18,31,.22),transparent 30%),linear-gradient(115deg,#090a0c,#17181c 52%,#2b0710)}
.service-card h3,.case-copy h3{color:#fff}.service-card p,.case-copy p{color:rgba(255,255,255,.64)}
.case-stack{display:grid;gap:18px;margin-top:52px}.case-block{display:grid;grid-template-columns:1fr 1fr;gap:18px}.case-block.reverse .case-media{order:2}.case-block.reverse .case-copy{order:1}
.case-media{min-height:600px;border-radius:30px;overflow:hidden}.case-media img{width:100%;height:100%;object-fit:cover}.case-copy{border-radius:30px;padding:clamp(34px,5vw,62px);background:#17181c;display:flex;flex-direction:column;justify-content:center}
.case-copy .eyebrow{margin-bottom:8px}.case-copy h3{font-size:clamp(2.5rem,4.6vw,5rem);line-height:.95;letter-spacing:-.055em;margin:12px 0 20px}
.case-copy .tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px}.case-copy .tags span{font-size:.62rem;letter-spacing:.09em;text-transform:uppercase;border:1px solid rgba(255,255,255,.14);padding:9px 11px;border-radius:999px;color:rgba(255,255,255,.72)}
.gallery.real-gallery figure{position:relative}.gallery.real-gallery img{width:100%;height:100%;object-fit:cover}
.fact-row{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line-dark);border-bottom:1px solid var(--line-dark);margin-top:50px}.fact{padding:28px 20px;border-right:1px solid var(--line-dark)}.fact:last-child{border-right:0}.fact strong{display:block;font-size:clamp(2rem,4vw,4rem);letter-spacing:-.055em}.fact span{display:block;margin-top:6px;color:rgba(255,255,255,.5);font-size:.65rem;text-transform:uppercase;letter-spacing:.11em}
.section-paper .fact-row{border-color:rgba(32,33,36,.14)}.section-paper .fact{border-color:rgba(32,33,36,.14)}.section-paper .fact span{color:#6b6460}
.section-paper .physical-card h3{color:var(--ink)!important}.section-paper .physical-card p,.section-paper .physical-card li{color:#5d5753!important}
.section-dark-2 .service-card h3{color:#fff!important}

/* RTL/localisation */
[dir="rtl"] .founders-head,[dir="rtl"] .partnership-note,[dir="rtl"] .case-block{direction:rtl}
[dir="rtl"] .founder-role,[dir="rtl"] .work-card .asset-label,[dir="rtl"] .case-copy .tags span{letter-spacing:.02em;text-transform:none}
[dir="rtl"] .founder-body h3,[dir="rtl"] .case-copy h3{letter-spacing:-.035em}
[dir="rtl"] .work-card .work-copy,[dir="rtl"] .founder-body,[dir="rtl"] .case-copy{text-align:right}
[dir="rtl"] .founder-card.hussain .founder-media img{object-position:center 8%}
[dir="rtl"] .fact{border-right:0;border-left:1px solid var(--line-dark)}[dir="rtl"] .fact:last-child{border-left:0}
[dir="rtl"] .section-paper .fact{border-left-color:rgba(32,33,36,.14)}
[dir="rtl"] .project-metrics{direction:rtl}

@media(max-width:980px){.founders-head,.founder-grid,.case-block,.partnership-note{grid-template-columns:1fr}.case-block.reverse .case-media,.case-block.reverse .case-copy{order:initial}.work-card.project-wide,.work-card.project-tall,.work-card.project-five,.work-card.project-three,.work-card.project-four,.work-card.project-six{grid-column:span 6;min-height:500px}.fact-row{grid-template-columns:repeat(2,1fr)}.fact:nth-child(2){border-right:0}.fact:nth-child(-n+2){border-bottom:1px solid var(--line-dark)}}
@media(max-width:720px){.founder-grid{gap:14px}.founder-card{border-radius:26px}.founder-media{aspect-ratio:4/5}.partnership-note{border-radius:26px}.work-card.project-wide,.work-card.project-tall,.work-card.project-five,.work-card.project-three,.work-card.project-four,.work-card.project-six{grid-column:span 12;min-height:480px}.page-hero-card.real-media{min-height:430px}.case-media{min-height:440px}.fact:nth-child(2){border-right:0}[dir="rtl"] .fact:nth-child(2){border-left:0}}


/* V8 English launch refinements — preserve V5/V7 system */
.capability-manifesto{display:grid;gap:.08em;max-width:100%;text-wrap:initial;overflow:visible}
.capability-manifesto .cap-line{display:block;max-width:100%;overflow:visible}
.capability-manifesto .cap-line-major{font-size:1em;line-height:.9}
.capability-manifesto .cap-line-support{font-size:clamp(.46em,.57em,.62em);line-height:1.02;letter-spacing:-.035em;margin:.12em 0 .08em}
@media(max-width:1180px) and (min-width:981px){
  #capabilities>.shell{grid-template-columns:minmax(320px,.72fr) minmax(0,1.28fr);gap:clamp(3rem,5vw,5.5rem)}
  .capability-manifesto{font-size:clamp(2.65rem,4.55vw,4.75rem)}
}
@media(max-width:980px){
  .capability-manifesto{max-width:760px}
  .capability-manifesto .cap-line-support{font-size:.58em}
}
@media(max-width:520px){
  .capability-manifesto{font-size:clamp(2.55rem,13vw,4rem);gap:.12em}
  .capability-manifesto .cap-line-support{font-size:.5em;line-height:1.08;letter-spacing:-.025em}
}

/* Mobile layout-width correction — prevents the homepage problem grid from
   forcing a desktop-width canvas on phones and pushing fixed UI off-screen. */
@media (max-width: 980px) {
  .problem-layout {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  .problem-layout > * {
    min-width: 0;
  }
}

/* V9 live-motion and mobile navigation patch — preserves the approved layout. */
.work-card .work-video{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  opacity:0;
  transform:scale(1.015);
  transition:opacity .42s ease, transform 1.1s var(--ease-expo);
  pointer-events:none;
  z-index:0;
  background:#111216;
}
.work-card.video-card.is-playing .work-video{opacity:1;transform:scale(1)}
.work-card.video-card.is-playing .work-image{opacity:0;transform:scale(1.015)}
.work-card .work-image{opacity:1}

/* Cinematic push/pull for genuine still photography only.
   More perceptible than the previous pass while remaining premium. */
.work-card.still-card .work-image{
  will-change:transform,filter;
  transform-origin:50% 46%;
}
.work-card.still-card:nth-child(even) .work-image{transform-origin:54% 48%}
.work-card.still-card:nth-child(3) .work-image{transform-origin:50% 34%}
.work-card.still-card:nth-child(5) .work-image{transform-origin:48% 48%}
@media (prefers-reduced-motion:no-preference){
  .work-card.still-card.is-in-view .work-image{
    animation:sevenStillPush 8.5s cubic-bezier(.42,0,.18,1) infinite alternate both;
  }
  .work-card.still-card:nth-child(even).is-in-view .work-image{animation-name:sevenStillPull}
  @keyframes sevenStillPush{
    from{transform:scale(1.012) translate3d(0,0,0);filter:saturate(1)}
    to{transform:scale(1.108) translate3d(-1.25%,-.75%,0);filter:saturate(1.055)}
  }
  @keyframes sevenStillPull{
    from{transform:scale(1.108) translate3d(1.1%,-.55%,0);filter:saturate(1.055)}
    to{transform:scale(1.012) translate3d(0,0,0);filter:saturate(1)}
  }
  .work-card.still-card:hover .work-image{animation-play-state:running}
}
/* Reduced-motion devices receive one restrained, non-looping push instead of no visual response. */
@media (prefers-reduced-motion:reduce){
  .work-card.still-card.is-in-view .work-image{
    animation:sevenStillReduced 5.5s ease-out 1 both!important;
  }
  @keyframes sevenStillReduced{
    from{transform:scale(1.01)}
    to{transform:scale(1.065)}
  }
}

/* Mobile navigation: constrained premium glass surface with readable links. */
@media (max-width:980px){
  .nav-links{
    inset:82px 14px auto 14px!important;
    width:auto;
    max-height:calc(100dvh - 104px);
    overflow:auto;
    padding:22px 18px 24px!important;
    border:1px solid rgba(255,255,255,.16);
    border-radius:26px;
    background:linear-gradient(145deg,rgba(25,26,31,.92),rgba(8,9,12,.86))!important;
    -webkit-backdrop-filter:blur(28px) saturate(145%);
    backdrop-filter:blur(28px) saturate(145%);
    box-shadow:0 28px 90px rgba(0,0,0,.52),inset 0 1px 0 rgba(255,255,255,.08);
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transform:translateY(-12px) scale(.985)!important;
    transform-origin:top center;
    transition:opacity .26s ease,transform .42s var(--ease-expo),visibility 0s linear .42s!important;
    z-index:1200;
  }
  .nav-links.open{
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transform:none!important;
    transition:opacity .26s ease,transform .42s var(--ease-expo),visibility 0s!important;
  }
  .nav-links>a:not(.btn){
    color:rgba(255,255,255,.86)!important;
    border-bottom:1px solid rgba(255,255,255,.1)!important;
    text-shadow:0 1px 16px rgba(0,0,0,.42);
  }
  .nav-links>a:not(.btn):hover,.nav-links>a:not(.btn):focus-visible{color:#fff!important}
  .nav-links .btn{width:100%;justify-content:center}
  .menu-btn{position:relative;z-index:1300;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}
}
@media (max-width:520px){
  .nav-links{inset:76px 10px auto 10px!important;border-radius:22px;padding:18px 16px 20px!important}
}

/* Keep the mobile hero media present. Autoplay is attempted by JS; poster remains as fallback. */
@media (prefers-reduced-motion:reduce){
  .hero-media video{display:block!important;transform:scale(1.04)!important}
}




/* Mobile-first source order: Selected Work is physically after the hero in HTML.
   Desktop alone restores the approved long-form editorial sequence. */
@media (max-width:980px){
  .home-page main#main{display:block!important}
}
@media (min-width:981px){
  .home-page main#main{display:flex!important;flex-direction:column}
  .home-page main#main > *{order:3}
  .home-page main#main > .hero{order:1}
  .home-page main#main > .logo-marquee{order:9}
  .home-page main#main > #work{order:10}
  .home-page main#main > #contact{order:11}
}