/* Display preferences stay easy to reach without growing with content. */


html.compact-display-content .about-profile{grid-template-columns:1fr}html.compact-display-content .about-ventures{border-left:0;padding-left:0;border-top:1px solid #ffffff18;padding-top:20px}html.compact-display-content .about-page .about-name{flex-wrap:wrap}html.compact-display-content .about-name>.about-instagram{margin:0}
html.large-display-content .about-metrics>div{display:block}html.large-display-content .about-metrics strong{display:block;margin-bottom:6px}
/* Fit navigation to the viewport even with a manually enlarged reading size. */
body header nav,body.portfolio-page header nav,body.mobile-layout header nav{font-size:min(calc(16px * var(--ui-scale,1)),1.4vw);gap:min(calc(30px * var(--ui-scale,1)),2vw)}
body header .brand img,body.portfolio-page header .brand img,body.mobile-layout header .brand img{width:min(calc(110px * var(--ui-scale,1)),11vw);height:auto;max-height:calc(38px * var(--ui-scale,1))}
#scene-intro .intro-copy h1{font-size:calc(clamp(24px,3.4vw,65px) * var(--home-ui-scale,1))}#scene-intro .intro-copy .specialty{font-size:calc(clamp(8px,1vw,19px) * var(--home-ui-scale,1))}#scene-intro .intro-copy p{font-size:calc(clamp(9px,1.05vw,20px) * var(--home-ui-scale,1))}
@media(max-width:700px){body header nav,body.portfolio-page header nav,body.mobile-layout header nav{font-size:11px;gap:12px}body header .brand img,body.portfolio-page header .brand img,body.mobile-layout header .brand img{width:75px;max-height:28px}body header,body.portfolio-page header,body.mobile-layout header{height:52px;padding:7px 4vw}.about-page .about-name{gap:16px}.about-page .page-services,.about-page .page-tools{grid-template-columns:1fr}.about-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.contact-detail-row{grid-template-columns:1fr}.contact-write{grid-column:1}.work-page .page-reels{grid-auto-columns:min(calc(150px * var(--ui-scale,1)),70vw)}}

/* The new 21:9 photograph and its lamp coordinates share one geometry. */
.contact-page{--cover-height:min(37vw,52dvh)}
.contact-environment:before{height:calc(var(--contact-art-width)*.42424242);background-image:url('contact-kuwait-v8.webp')}
.searchlight-left{left:calc(50% - var(--contact-art-width)*.2975);top:calc(var(--contact-art-top) + var(--contact-art-width)*.1485)}
.searchlight-right{left:calc(50% + var(--contact-art-width)*.3193);top:calc(var(--contact-art-top) + var(--contact-art-width)*.1485)}
@media(max-width:700px){.contact-page{--cover-height:350px}}

body header,body.portfolio-page header,body.mobile-layout header{background:rgba(5,13,19,.82);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid #ffffff0b}

#scene-intro-portrait .intro-portrait{transform:none}

.dragon-journey-button{position:relative;left:50%;transform:translateX(-50%);width:max-content;max-width:85vw;padding:8px 16px}
.dragon-journey-button>.dragon-journey-label{width:auto;font-size:calc(clamp(14px,.9vw,18px) * var(--ui-scale,1));font-weight:700;line-height:1.3}
.dragon-journey-label small{font-size:calc(13px * var(--ui-scale,1));font-weight:300;margin-top:4px;line-height:1.3}
@media(max-width:700px){.dragon-journey-button{padding:8px 12px}.dragon-journey-button>.dragon-journey-label{font-size:calc(14px * var(--ui-scale,1))}.dragon-journey-label small{font-size:calc(11px * var(--ui-scale,1))}}

.contact-searchlight{width:calc(var(--contact-art-width)*.26);height:calc(var(--contact-art-width)*.38);margin-left:calc(var(--contact-art-width)*-.13)}
@keyframes searchlight-left-sweep{from{transform:rotate(-90deg)}to{transform:rotate(-72deg)}}
@keyframes searchlight-right-sweep{from{transform:rotate(72deg)}to{transform:rotate(90deg)}}
@media(prefers-reduced-motion:reduce){.searchlight-left{transform:rotate(-81deg)}.searchlight-right{transform:rotate(81deg)}}

.contact-environment:before{mask-image:linear-gradient(to bottom,#000 42%,#000f 50%,#000d 60%,#0009 72%,#0004 85%,transparent 100%);-webkit-mask-image:linear-gradient(to bottom,#000 42%,#000f 50%,#000d 60%,#0009 72%,#0004 85%,transparent 100%)}
.contact-page:after{background:linear-gradient(to bottom,#080f1400 0px,#080f1430 100px,#080f1470 220px,#080f14b0 360px,#080f14e0 520px,#080f14 750px)}

#scene-intro .intro-actions{margin-top:calc(22px * var(--ui-scale,1))}

#scene-contact .contact-details .socials{gap:calc(12px * var(--ui-scale,1));margin-top:calc(10px * var(--ui-scale,1))}
#scene-contact .contact-details .socials a{width:calc(34px * var(--ui-scale,1));height:calc(34px * var(--ui-scale,1));flex:0 0 auto}
#scene-contact .contact-details .socials img{width:calc(17px * var(--ui-scale,1));height:calc(17px * var(--ui-scale,1))}
#scene-clients .client-logo{width:calc(56px * var(--ui-scale,1));height:calc(56px * var(--ui-scale,1));max-width:100%;border-radius:8px}
#scene-clients .client-name{font-size:calc(10px * var(--ui-scale,1));line-height:1.35}
#scene-clients .client-grid{gap:calc(12px * var(--ui-scale,1)) 8px}
#scene-clients h2{font-size:calc(26px * var(--ui-scale,1));margin-bottom:calc(16px * var(--ui-scale,1))}
#scene-work h2,#scene-reels h2{font-size:calc(26px * var(--ui-scale,1));line-height:1.25}
@media(max-width:700px){#scene-contact .contact-details .socials{gap:10px}#scene-contact .contact-details .socials a{width:30px;height:30px}#scene-contact .contact-details .socials img{width:15px;height:15px}body.mobile-layout #scene-clients .client-logo,.portrait-preview #scene-clients .client-logo{width:40px;height:40px;max-width:100%}body.mobile-layout #scene-clients .client-name,.portrait-preview #scene-clients .client-name{font-size:9px}body.mobile-layout #scene-clients h2,#scene-work h2,#scene-reels h2{font-size:22px}}

/* Fit the dragon and burning floor into the opening view without a detached cover. */
.work-page{--work-art-width:min(82vw,100dvh);--work-art-offset:0px}
.work-page:before{z-index:-3;background:#08131c url('work-continuous-approved-v6.webp') center top/100vw auto no-repeat;filter:blur(18px) brightness(.6)}
.work-environment{position:absolute;inset:0;z-index:-2;pointer-events:none;overflow:hidden}
.work-environment:before{content:'';position:absolute;left:0;top:0;width:100%;height:calc(var(--work-art-width)*1.490625);background:url('work-continuous-approved-v6.webp') center var(--work-art-offset)/var(--work-art-width) auto no-repeat;mask-image:linear-gradient(90deg,transparent,#000 17%,#000 83%,transparent),linear-gradient(#000 55%,transparent);mask-composite:intersect;-webkit-mask-image:linear-gradient(90deg,transparent,#000 17%,#000 83%,transparent),linear-gradient(#000 55%,transparent);-webkit-mask-composite:source-in}
.work-page:after{top:calc(var(--cover-height) - 110px);background:linear-gradient(to bottom,#080f1400,#080f1420 110px,#080f1490 260px,#080f14d9 520px,#080f14 950px)}
@media(max-width:700px){.work-page{--work-art-width:560px;--work-art-offset:18px}.work-page:before{background-size:560px auto}.work-environment:before{mask-image:linear-gradient(#000 55%,transparent);-webkit-mask-image:linear-gradient(#000 55%,transparent)}}

/* Slightly taller portfolio cards. */
.work-page .project-tile{display:flex;flex-direction:column;aspect-ratio:4/5}.work-page .project-tile>img{height:66%;aspect-ratio:auto;object-fit:cover;flex:none}.work-page .project-copy{flex:1;padding:calc(16px * var(--ui-scale,1))}.work-page .project-copy h3{-webkit-line-clamp:3;min-height:0}


/* Generated seamless cave and mountain panorama. */
.work-page{--work-panorama-width:max(100vw,179dvh);--work-art-width:calc(var(--work-panorama-width)*.56);--work-art-offset:0px}.work-page:before{background:#080f14;filter:none}.work-environment:before{height:calc(var(--work-panorama-width)/3 + 1px);background:url('work-panorama-v9.webp') center top/var(--work-panorama-width) auto no-repeat;mask-image:linear-gradient(#000 63%,#000e 75%,#0008 88%,transparent 100%);-webkit-mask-image:linear-gradient(#000 63%,#000e 75%,#0008 88%,transparent 100%);mask-composite:add;-webkit-mask-composite:source-over}
@media(max-width:700px){.work-page{--work-panorama-width:1000px;--work-art-width:560px;--work-art-offset:18px}.work-environment:before{background-position:center 18px;height:352px}}

.about-name h1,.about-title-block h1,.contact-editorial h1,.work-page .page-hero h1{font-size:clamp(calc(30px * var(--ui-scale,1)),calc(2.4vw * var(--ui-scale,1)),calc(40px * var(--ui-scale,1)))}
body header nav,body.portfolio-page header nav{font-size:min(calc(16px * var(--ui-scale,1)),2vw)}
@media(max-width:700px){body header nav,body.portfolio-page header nav{font-size:11px}.about-title-block h1,.contact-editorial h1,.work-page .page-hero h1{font-size:calc(28px * var(--ui-scale,1))}}


/* Larger covers blend gradually behind the opening content. */
.work-page{--work-panorama-width:max(112vw,200dvh)}
.work-environment:before{mask-image:linear-gradient(to bottom,#000 38%,#000f 48%,#000d 60%,#0009 74%,#0004 89%,transparent 100%);-webkit-mask-image:linear-gradient(to bottom,#000 38%,#000f 48%,#000d 60%,#0009 74%,#0004 89%,transparent 100%)}
.work-page:after{top:calc(var(--cover-height) - 80px);background:linear-gradient(to bottom,#080f1400,#080f1418 150px,#080f1450 320px,#080f1490 540px,#080f14dc 850px,#080f14 1150px)}
.about-page{--work-art-width:max(112vw,1344px)}
.about-environment:after{mask-image:linear-gradient(to bottom,#000 35%,#000f 45%,#000d 57%,#0009 72%,#0004 88%,transparent 100%);-webkit-mask-image:linear-gradient(to bottom,#000 35%,#000f 45%,#000d 57%,#0009 72%,#0004 88%,transparent 100%)}
.about-page:after{top:calc(var(--cover-height) - 110px);background:linear-gradient(to bottom,#080f1400,#080f1418 170px,#080f1455 350px,#080f1499 600px,#080f14dc 950px,#080f14 1300px)}
@media(max-width:700px){.work-page{--work-panorama-width:1120px;--work-art-width:627.2px}.work-environment:before{height:392px}.about-page{--work-art-width:1344px}}