.portfolio-hero,.portfolio-showcase{width:min(calc(100% - 40px),1180px);margin:auto}.portfolio-hero{padding:120px 0 48px}.portfolio-hero>span{color:#f3a0c6;font-size:.88rem;font-weight:700}.portfolio-hero h1{margin:18px 0 14px;font-size:clamp(3rem,6vw,6.25rem);line-height:.98;letter-spacing:-.05em}.portfolio-hero h1 b{background:linear-gradient(105deg,#b985ea,#f191bf 53%,#ff9677);background-clip:text;color:transparent}.portfolio-hero p{max-width:520px;margin:0;color:#b9b0c9;line-height:1.9}.portfolio-showcase{padding:18px 0 115px}.portfolio-toolbar{display:flex;justify-content:space-between;align-items:end;gap:20px;padding-top:25px;border-top:1px solid rgba(232,218,255,.16);margin-bottom:34px}.portfolio-toolbar>p{margin:0;color:#c8bdd8}.portfolio-filters{justify-content:flex-start;margin:0;gap:7px}.portfolio-filters .filter{background:rgba(255,255,255,.025);font-size:.86rem}.portfolio-filters i{font-size:.62rem;font-style:normal;color:#e9a8cf;margin-left:5px}.portfolio-filters .filter.active{background:rgba(141,62,151,.2);border-color:#d984bd}.portfolio-orbit-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:18px}.project-card{grid-column:span 4;height:350px;border:0!important;border-radius:0!important;background:none!important;overflow:visible!important;cursor:pointer}.project-card.wide{grid-column:span 8}.project-card.tall{height:510px}.project-art{position:relative;height:calc(100% - 77px);overflow:hidden;background:linear-gradient(135deg,var(--a),var(--b) 63%,var(--c));box-shadow:inset 0 0 0 1px rgba(255,255,255,.15),0 18px 38px rgba(0,0,0,.2);transition:.35s}.project-card:hover .project-art{transform:translateY(-7px);box-shadow:inset 0 0 0 1px rgba(255,230,249,.42),0 28px 50px rgba(0,0,0,.3)}.project-art:before{content:'';position:absolute;inset:0;background:linear-gradient(145deg,rgba(255,255,255,.12),transparent 36%,rgba(5,2,13,.22))}.project-art em{position:absolute;top:18px;right:18px;color:rgba(255,255,255,.55);font-style:normal;font-size:.75rem}.project-art strong{position:absolute;z-index:1;bottom:14%;left:9%;font-size:clamp(2.2rem,4vw,4.6rem);letter-spacing:-.07em}.project-card footer{display:grid;grid-template-columns:1fr auto;gap:3px 12px;padding:14px 3px}.project-card footer small{color:#c5b9d2}.project-card footer h2{margin:0;font-size:1.2rem}.project-card footer b{grid-row:span 2;display:grid;place-items:center;width:38px;height:38px;border:1px solid rgba(255,255,255,.25);border-radius:50%;transition:.25s}.project-card:hover footer b{background:linear-gradient(135deg,#9c4ac4,#ef8a86);border-color:transparent;transform:rotate(45deg)}.orbit-art:after{content:'';position:absolute;width:62%;aspect-ratio:1;left:19%;top:14%;border:1px solid rgba(255,255,255,.45);border-radius:50%;box-shadow:0 0 0 28px rgba(255,255,255,.04)}.orbit-art img{position:absolute;z-index:1;width:125px;left:50%;top:50%;transform:translate(-50%,-50%)}.screen-art:after{content:'';position:absolute;inset:18% 15%;border:1px solid rgba(255,255,255,.3);background:linear-gradient(90deg,transparent 49%,rgba(255,255,255,.13) 50% 51%,transparent 52%),linear-gradient(0deg,transparent 33%,rgba(255,255,255,.13) 34% 35%,transparent 36%)}.letter-art strong{left:50%;top:50%;bottom:auto;transform:translate(-50%,-50%);font-size:9rem}.studio-art:after{content:'';position:absolute;width:52%;height:120%;left:25%;top:-25%;transform:rotate(28deg);background:linear-gradient(180deg,rgba(255,220,184,.66),transparent 72%);filter:blur(16px)}.data-art:after{content:'';position:absolute;inset:24%;background:radial-gradient(circle at 18% 22%,#ffd1d0 0 6px,transparent 7px),radial-gradient(circle at 76% 40%,#ff9f86 0 7px,transparent 8px),radial-gradient(circle at 42% 75%,#c79cff 0 6px,transparent 7px);border:1px solid rgba(255,255,255,.3)}.sun-art:after{content:'';position:absolute;width:45%;aspect-ratio:1;left:28%;top:22%;border-radius:50%;background:radial-gradient(circle at 38% 35%,#fff5df,#ffb08a 24%,#ed6b87 50%,transparent 70%);filter:drop-shadow(0 0 24px rgba(255,150,120,.5))}.portfolio-page .work.video:after{content:'▶';z-index:2;inset:50% auto auto 50%;width:52px;height:52px;transform:translate(-50%,-50%);font-size:1rem;border:1px solid rgba(255,255,255,.42);border-radius:50%;background:rgba(10,5,28,.25);backdrop-filter:blur(5px)}@media(max-width:850px){.portfolio-orbit-grid{grid-template-columns:repeat(2,1fr)}.project-card,.project-card.wide{grid-column:span 1}.project-card.tall{height:380px}.portfolio-toolbar{align-items:start;flex-direction:column}}@media(max-width:560px){.portfolio-hero,.portfolio-showcase{width:min(calc(100% - 28px),1180px)}.portfolio-hero{padding-top:85px}.portfolio-orbit-grid{grid-template-columns:1fr}.project-card,.project-card.wide{grid-column:span 1;height:330px}.project-card.tall{height:400px}}
@media (min-width:851px){.portfolio-orbit-grid .project-card,.portfolio-orbit-grid .project-card.wide,.portfolio-orbit-grid .project-card.tall{grid-column:span 4;height:350px}}
/* Final portfolio alignment and interaction refinements. */
.portfolio-orbit-grid{direction:rtl;column-gap:28px;row-gap:34px}.portfolio-toolbar{align-items:center;padding:28px 0;margin-bottom:42px}.portfolio-toolbar>p{margin:0;white-space:nowrap}.portfolio-filters{direction:rtl;align-items:center}.project-card{transition:transform .32s cubic-bezier(.2,.8,.2,1),filter .32s ease}.project-card:hover{transform:scale(1.02);filter:drop-shadow(0 18px 26px rgba(194,91,178,.16))}.project-card:hover .project-art{transform:none;box-shadow:inset 0 0 0 1px rgba(255,230,249,.52),0 20px 44px rgba(0,0,0,.28)}.project-card footer{padding:20px 4px 2px;gap:6px 12px}.project-card footer small{line-height:1.45}.project-card footer h2{line-height:1.4}@media(max-width:850px){.portfolio-toolbar>p{white-space:normal}.portfolio-orbit-grid{gap:28px 20px}}
.portfolio-orbit-grid .project-card{box-sizing:border-box;padding:13px;border:1px solid rgba(215,179,255,.17)!important;border-radius:20px!important;background:linear-gradient(145deg,rgba(30,22,58,.64),rgba(10,8,27,.42))!important;backdrop-filter:blur(10px);box-shadow:inset 0 1px 0 rgba(255,255,255,.05)}.portfolio-orbit-grid .project-art{border-radius:12px;overflow:hidden}.portfolio-orbit-grid .project-art em{top:17px;right:17px}.portfolio-orbit-grid .project-card footer{padding:18px 5px 4px}.portfolio-page .work.video:after{content:'▶';display:grid;place-items:center;position:absolute;z-index:8;inset:auto;left:50%;top:calc((100% - 77px) / 2);width:64px;height:64px;transform:translate(-50%,-50%);border:1px solid transparent;border-radius:50%;background:linear-gradient(rgba(15,8,34,.42),rgba(15,8,34,.42)) padding-box,linear-gradient(135deg,#b879e5,#ef91c1,#ff9b7c) border-box;color:#fff;font-size:1rem;text-shadow:none;box-shadow:0 0 0 9px rgba(255,255,255,.045),0 0 24px rgba(213,109,192,.28);backdrop-filter:blur(8px);transition:transform .28s ease,box-shadow .28s ease}.portfolio-page .work.video:hover:after{transform:translate(-50%,-50%) scale(1.1);box-shadow:0 0 0 12px rgba(255,255,255,.06),0 0 34px rgba(222,123,202,.42)}
.portfolio-orbit-grid .project-card{overflow:hidden!important;border-radius:20px!important}.portfolio-orbit-grid .project-art{border-radius:12px!important}.portfolio-orbit-grid .project-card:before{display:none}.portfolio-orbit-grid .project-card footer{display:block;border-radius:0 0 12px 12px}.portfolio-orbit-grid .project-card footer b{display:none}
.portfolio-orbit-grid .project-card{animation:portfolio-card-reveal .7s cubic-bezier(.2,.8,.2,1) both}.portfolio-orbit-grid .project-card:nth-child(2){animation-delay:.07s}.portfolio-orbit-grid .project-card:nth-child(3){animation-delay:.14s}.portfolio-orbit-grid .project-card:nth-child(4){animation-delay:.21s}.portfolio-orbit-grid .project-card:nth-child(5){animation-delay:.28s}.portfolio-orbit-grid .project-card:nth-child(6){animation-delay:.35s}.portfolio-orbit-grid .project-card footer{position:relative;background:linear-gradient(145deg,rgba(37,24,61,.5),rgba(11,8,27,.18))}.portfolio-orbit-grid .project-card footer small{display:inline-flex;align-items:center;padding:5px 9px;border:1px solid rgba(255,214,240,.15);border-radius:999px;background:rgba(255,255,255,.035);color:#e6c6e5;font-size:.72rem}.portfolio-orbit-grid .project-card footer h2{margin-top:8px;color:#fff;text-shadow:0 3px 16px rgba(0,0,0,.25)}.portfolio-orbit-grid .project-card:hover{border-color:rgba(240,155,205,.42)!important;background:linear-gradient(145deg,rgba(59,31,84,.78),rgba(17,10,39,.55))!important}.portfolio-orbit-grid .project-card:hover footer small{border-color:rgba(255,175,213,.42);color:#fff}.portfolio-orbit-grid .project-card:hover .project-art:before{background:linear-gradient(145deg,rgba(255,255,255,.18),transparent 35%,rgba(79,31,111,.2))}@keyframes portfolio-card-reveal{from{opacity:0;transform:translateY(22px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}@media(prefers-reduced-motion:reduce){.portfolio-orbit-grid .project-card{animation:none}}
.portfolio-toolbar{flex-direction:column;align-items:center;justify-content:center;gap:17px;padding:34px 0 30px;margin-bottom:30px}.portfolio-toolbar>p{text-align:center;color:#d2c5df}.portfolio-filters{justify-content:center;gap:10px}.portfolio-filters .filter{min-height:42px;padding:9px 17px;border:1px solid rgba(217,190,255,.22);border-radius:999px;background:linear-gradient(145deg,rgba(30,24,57,.7),rgba(12,9,29,.46));box-shadow:inset 0 1px 0 rgba(255,255,255,.06);color:#d8ccdf;transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease,background .22s ease}.portfolio-filters .filter:hover{transform:translateY(-2px);border-color:rgba(243,162,208,.62);background:linear-gradient(145deg,rgba(77,39,105,.62),rgba(25,14,51,.62));box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 0 19px rgba(192,90,178,.16)}.portfolio-filters .filter.active{border-color:transparent;background:linear-gradient(105deg,#7e3baa,#c35a94 53%,#ef806b);box-shadow:0 8px 24px rgba(183,73,157,.28),inset 0 1px 0 rgba(255,255,255,.23);color:#fff}.portfolio-filters .filter.active i{color:#fff}@media(max-width:560px){.portfolio-filters{gap:8px}.portfolio-filters .filter{padding:8px 12px;font-size:.8rem}}
.portfolio-orbit-grid{direction:rtl;grid-auto-flow:row}.portfolio-orbit-grid .project-card{order:initial}
.portfolio-toolbar{gap:28px;padding:38px 0 36px;margin-bottom:38px}.portfolio-filters{flex-wrap:nowrap;max-width:100%;overflow-x:auto;padding:3px 4px;scrollbar-width:none}.portfolio-filters::-webkit-scrollbar{display:none}.portfolio-page .work.video:after{width:68px;height:68px;border-width:1px;box-shadow:0 0 0 10px rgba(255,255,255,.05),0 0 28px rgba(219,118,196,.34),inset 0 1px 0 rgba(255,255,255,.2);background:linear-gradient(rgba(20,10,43,.34),rgba(20,10,43,.34)) padding-box,linear-gradient(135deg,#b879e5,#f093c2 54%,#ff9e7d) border-box;animation:play-glow 2.8s ease-in-out infinite}.portfolio-page .work.video:hover:after{box-shadow:0 0 0 13px rgba(255,255,255,.06),0 0 42px rgba(231,130,203,.5),inset 0 1px 0 rgba(255,255,255,.3)}@keyframes play-glow{0%,100%{filter:brightness(1)}50%{filter:brightness(1.16)}}@media(max-width:560px){.portfolio-toolbar{gap:22px;padding:30px 0}.portfolio-filters{justify-content:flex-start}.portfolio-showcase{padding-top:8px}}
.portfolio-orbit-grid .project-card{padding:20px}.portfolio-orbit-grid .project-art{height:calc(100% - 90px)}.portfolio-orbit-grid .project-art em{top:20px;right:20px}.portfolio-orbit-grid .project-card footer{display:flex;padding:18px 6px 2px;flex-direction:column;gap:0}.portfolio-orbit-grid .project-card footer h2{order:1;margin:0}.portfolio-orbit-grid .project-card footer small{order:2;margin-top:9px}.portfolio-page .work.video:after{top:calc((100% - 90px) / 2)}
.portfolio-page .main-nav a.active{position:relative;color:#fff;text-shadow:0 0 14px rgba(196,167,255,.55)}.portfolio-page .main-nav a.active::after{content:'';position:absolute;right:0;bottom:-8px;width:100%;height:2px;border-radius:999px;background:linear-gradient(90deg,#ff8a76,#c47ceb);box-shadow:0 0 10px rgba(224,120,190,.35)}.portfolio-hero{padding-bottom:70px}.portfolio-toolbar{align-items:flex-start;text-align:right}.portfolio-toolbar>p{text-align:right}.portfolio-filters{justify-content:flex-start}@media(max-width:560px){.portfolio-hero{padding-bottom:54px}.portfolio-toolbar{align-items:flex-start}}
.portfolio-orbit-grid .project-card footer{background:transparent!important;padding:18px 2px 0!important;border-radius:0}.portfolio-orbit-grid .project-card footer small{background:transparent;border-color:transparent;padding:0;color:#d8c7df}.portfolio-orbit-grid .project-card:hover footer small{border-color:transparent;color:#f2d8eb}
.portfolio-hero{padding-bottom:88px}.portfolio-toolbar{padding-top:46px}.portfolio-toolbar,.portfolio-toolbar>p,.portfolio-filters{align-items:flex-start;text-align:right}
.portfolio-hero>span{display:inline-flex;align-items:center;gap:9px;margin-bottom:2px;letter-spacing:.05em}.portfolio-hero>span::before{content:'';width:29px;height:1px;background:linear-gradient(90deg,#b878e6,#f194bf,#ff9b7b)}
/* Keep the English portfolio naturally left-to-right, including the project order. */
html[lang=en] .portfolio-hero,html[lang=en] .portfolio-hero>span,html[lang=en] .portfolio-hero h1,html[lang=en] .portfolio-hero p,html[lang=en] .portfolio-toolbar,html[lang=en] .portfolio-toolbar>p,html[lang=en] .portfolio-filters,html[lang=en] .project-card,html[lang=en] .project-card footer{direction:ltr!important;text-align:left!important}
html[lang=en] .portfolio-hero p{margin-left:0!important;margin-right:auto!important}
html[lang=en] .portfolio-toolbar{align-items:flex-start!important}
html[lang=en] .portfolio-filters{justify-content:flex-start!important}
html[lang=en] .portfolio-orbit-grid{direction:ltr!important}

/* Portfolio keeps the same softened Enmar spectrum as every other page heading. */
.portfolio-hero h1 b{background:var(--enmar-heading-gradient)!important;-webkit-background-clip:text!important;background-clip:text!important;color:transparent!important;-webkit-text-fill-color:transparent!important}
html[lang=en] .portfolio-filters i{margin-left:0;margin-right:5px}
html[lang=en] .portfolio-orbit-grid .project-art em{left:20px;right:auto}

/* Project-specific case-study imagery replaces the abstract placeholders. */
.portfolio-orbit-grid .project-art{
    background-color:#151122!important;
    background-repeat:no-repeat!important;
    background-position:center!important;
    background-size:cover!important;
}
.portfolio-orbit-grid .orbit-art{background-image:url('../assets/images/portfolio/madar-campaign.webp')!important}
.portfolio-orbit-grid .screen-art{background-image:url('../assets/images/portfolio/afaq-film-motion.webp')!important}
.portfolio-orbit-grid .letter-art{background-image:url('../assets/images/portfolio/nawa-brand.webp')!important}
.portfolio-orbit-grid .studio-art{background-image:url('../assets/images/portfolio/laqta-studio-motion.webp')!important}
.portfolio-orbit-grid .data-art{background-image:url('../assets/images/portfolio/roya-platform.webp')!important}
.portfolio-orbit-grid .sun-art{background-image:url('../assets/images/portfolio/ishraq-content.webp')!important}
.portfolio-orbit-grid .project-art strong,
.portfolio-orbit-grid .orbit-art img{display:none}
.portfolio-orbit-grid .orbit-art::after,
.portfolio-orbit-grid .screen-art::after,
.portfolio-orbit-grid .studio-art::after,
.portfolio-orbit-grid .data-art::after,
.portfolio-orbit-grid .sun-art::after{display:none}
.portfolio-orbit-grid .project-art::before{
    z-index:1;
    background:linear-gradient(180deg,rgba(4,3,12,.03) 42%,rgba(7,4,18,.34) 100%);
}
.portfolio-orbit-grid .project-art em{z-index:2;color:rgba(255,255,255,.86);text-shadow:0 2px 12px rgba(0,0,0,.55)}

/* Compact glass play control that preserves the project thumbnail. */
.portfolio-page .work.video::after{
    width:48px;
    height:48px;
    border:1px solid rgba(255,255,255,.42);
    background:rgba(11,8,25,.24);
    color:rgba(255,255,255,.94);
    font-size:.72rem;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 8px 24px rgba(3,2,12,.18),0 0 12px rgba(194,132,224,.12);
    backdrop-filter:blur(5px) saturate(1.15);
    -webkit-backdrop-filter:blur(5px) saturate(1.15);
    animation:none;
}
.portfolio-page .work.video:hover::after{
    transform:translate(-50%,-50%) scale(1.07);
    border-color:rgba(255,255,255,.64);
    background:rgba(19,13,38,.32);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.28),0 10px 26px rgba(3,2,12,.22),0 0 16px rgba(212,149,231,.18);
}
@media(max-width:560px){.portfolio-page .work.video::after{width:44px;height:44px;font-size:.68rem}}