@font-face{font-family:Bargim;src:url('/assets/uploads/2023/09/Bargim.woff2') format('woff2'),url('/assets/uploads/2023/09/Bargim.woff') format('woff');font-weight:400;font-style:normal;font-display:block}
@font-face{font-family:Denver;src:url('/assets/uploads/2023/09/Denver-Serial-Regular.woff2') format('woff2'),url('/assets/uploads/2023/09/Denver-Serial-Regular.woff') format('woff');font-weight:400;font-style:normal;font-display:block}
@font-face{font-family:Denver;src:url('/assets/uploads/2023/09/Denver-Serial-RegularItalic.woff') format('woff');font-weight:400;font-style:italic;font-display:block}
@font-face{font-family:Nimbus;src:url('/assets/uploads/2023/09/NimbusSanL-Reg.woff2') format('woff2'),url('/assets/uploads/2023/09/NimbusSanL-Reg.woff') format('woff');font-weight:400;font-style:normal;font-display:block}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--font-copy);background:#070707;color:#fff;overflow-x:hidden}
a{color:inherit;text-decoration:none;transition:color .18s ease}
a:hover{color:var(--pink)}
img{max-width:100%;display:block}
.desktop-only{display:block}
.home-hero::after{content:'';position:absolute;inset:0;background:rgba(0,134,255,.02);z-index:1;pointer-events:none}
.hero-buttons{display:flex;gap:72px;justify-content:center;align-items:center}
.scroll-arrow,.about-arrow,.project-arrow{font-family:Arial,sans-serif;color:#fff;font-size:92px;line-height:1;display:inline-block;text-shadow:0 0 3px rgba(0,0,0,.15)}
.scroll-arrow{display:none;margin-top:62px}
.side-social-inner a:hover,.footer-social a:hover{color:var(--pink)}
.work-grid-section{background:#000;position:relative}
.work-nav{position:sticky;top:0;height:0;z-index:20}
.project-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:0}
.project-card{height:clamp(460px,35.7vw,610px);background-size:cover;background-position:center;position:relative;overflow:hidden}
.topnav-inner{position:relative;height:82px;display:flex;align-items:center;justify-content:space-between;pointer-events:auto}
.topnav .nav-logo img{width:100%}
.nav-left{min-width:170px}
.work-nav .nav-left{visibility:hidden}
.cv-link a:hover{color:var(--pink)}
.video iframe{width:100%;height:100%;border:0}
.gallery{width:min(1240px,86vw);margin:0 auto;padding:0 0 86px;text-align:center}
.gallery-stack{display:flex;flex-direction:column;gap:70px}
.gallery-stack img{width:100%;height:auto;margin:0 auto}
.flip-card-block{width:min(560px,86vw);margin:0 auto 90px;text-align:center;perspective:1400px}
.flip-card{appearance:none;border:0;background:transparent;padding:0;cursor:pointer;width:100%;display:block}
.flip-card-inner{position:relative;display:block;width:100%;transform-style:preserve-3d;transition:transform .7s ease}
.flip-card.is-flipped .flip-card-inner{transform:rotateY(180deg)}
.flip-card img{width:100%;border-radius:16px;backface-visibility:hidden;box-shadow:0 20px 50px rgba(0,0,0,.45)}
.flip-back{position:absolute;inset:0;transform:rotateY(180deg)}
.rel-left{left:14px}
.rel-right{right:14px}
.footer-sky{background:#19a3f5 var(--sky) center/cover no-repeat;color:#fff}
.footer-black{background:#070707 var(--black-texture) center/auto repeat;color:#fff}
.footer-contact span{color:var(--pink)}
.mobile-break{display:none}
.contact-page{min-height:100vh;background:var(--sky) center/cover no-repeat;display:flex;align-items:flex-end;justify-content:center}
@media (max-width:760px){
.desktop-only{display:none!important}
body{background:#070707 var(--black-texture) center top/auto repeat}
.home-hero{min-height:100vh;align-items:flex-start;padding:205px 0 38px}
.hero-center{transform:none;width:100%}
.hero-logo{width:92vw;margin-bottom:24px}
.hero-title-img{width:73vw;margin-bottom:62px}
.hero-buttons{flex-direction:column;gap:34px}
.hero-buttons a{width:305px}
.scroll-arrow{display:inline-block;font-size:88px;margin-top:72px}
.work-nav{display:none}
.project-grid{grid-template-columns:1fr}
.project-card{height:345px;background-position:center}
.project-card::after{opacity:1;background:linear-gradient(transparent 42%,rgba(0,0,0,.9))}
.project-overlay{opacity:1;left:31px;bottom:28px;gap:4px}
.project-overlay b{font-size:24px;line-height:.95}
.project-overlay em{font-size:26px;line-height:.98}
.topnav{padding:26px 30px 0}
.topnav-inner{height:70px}
.topnav a{font-size:26px}
.topnav .nav-logo{width:176px}
.nav-left,.nav-right{min-width:92px}
.nav-right{gap:0;display:block}
.work-nav .nav-left{visibility:visible}
.work-nav .nav-right{position:static;transform:none}
.about-hero{padding:94px 0 54px;min-height:100vh}
.about-image{width:100%;margin-bottom:34px}
.about-intro{font-size:28px;line-height:1.48;width:86vw;color:#3e3e3e}
.about-arrow{font-size:82px}
.about-content{width:90vw;padding:58px 0 20px}
.about-section{margin-bottom:72px}
.about-section h2{font-size:60px;margin-bottom:30px;line-height:.95}
.about-role,.about-list,.about-year{font-size:24px;line-height:1.33;margin-bottom:26px}
.cv-link{margin:72px 0}
.cv-link a{font-size:46px}
.project-hero{min-height:100vh;height:100vh;background-position:center;align-items:center}
.project-title-wrap{margin-top:190px;width:100%;padding:0 26px}
.project-title-wrap p{font-size:38px}
.project-title-wrap h1{font-size:50px;line-height:.98}
.project-arrow{bottom:122px;font-size:70px}
.project-body{padding-top:54px}
.claim{font-size:29px;width:88vw;margin-bottom:64px;line-height:1.16}
.claim span{display:none}
.project-info{display:block;width:90vw;margin-bottom:60px}
.project-desc p,.awards p{font-size:25px;line-height:1.56}
.awards{margin-top:46px}
.awards h3{font-size:34px;margin-bottom:14px}
.video{width:90vw;margin-bottom:58px;border-radius:7px}
.gallery{width:90vw;padding-bottom:50px}
.gallery h2,.related h2{font-size:78px;text-align:left;margin-bottom:40px}
.gallery-stack{gap:56px}
.flip-card-block{width:78vw;margin-bottom:70px}
.flip-touch{width:74px}
.related{width:90vw;padding:0 0 70px}
.related-track{gap:0;scroll-snap-type:x mandatory}
.related-card{min-width:100%;height:310px;scroll-snap-align:start;border-radius:14px}
.related-card:nth-child(n+2){display:none}
.rel-arrow{display:block}
.footer{padding:64px 20px 72px}
.footer-contact{font-size:48px;line-height:1.05;margin-bottom:54px}
.footer-contact a{display:block;font-size:33px;margin-top:8px}
.footer-social{gap:34px;margin-bottom:72px}
.footer-social a{width:54px;height:54px}
.footer-social svg{width:46px;height:46px}
.copyright{font-size:28px;line-height:1.6}
.mobile-break{display:block}
}
@media (min-width:761px) and (max-width:1100px){
.project-info{grid-template-columns:1fr;gap:45px}
.hero-buttons{gap:35px}
.related-card{flex-basis:calc((100% - 18px)/2)}
}
/* v3 visual corrections from side-by-side review */
/* HOME: the composite logo image already contains the title */
.hero-title-img{width:min(520px,64vw);margin:0 auto 56px;display:none!important}
.hero-center{position:relative;z-index:2;width:min(980px,92vw);text-align:center;transform:translateY(3.2vh)}
/* Navigation: closer to original; no shadow, smaller and cleaner */
.topnav{position:fixed;top:0;left:0;right:0;z-index:50;padding:30px 5.55vw 0;pointer-events:none}
.topnav a{font-size:var(--nav-font-size);font-weight:900;color:#fff;text-transform:uppercase;text-shadow:none!important;line-height:1;font-family:var(--font-copy);letter-spacing:-.03em}
.topnav-project .nav-left{visibility:hidden}
.topnav-project .nav-right{position:absolute;right:0;top:50%;transform:translateY(-50%)}
.work-nav .topnav{position:absolute;top:0;width:100%;background:transparent;padding-top:34px}
.work-nav .nav-logo{width:180px}
.work-nav .nav-right{position:absolute;right:0;top:50%;transform:translateY(-50%)}
.work-nav .topnav a{font-size:25px;text-shadow:none!important}
/* Work hover: original is white text, no pink inheritance, with darker lower gradient */
.project-card:hover{color:#fff}
.project-overlay b,.project-overlay em{color:#fff!important}
/* Footer: transparent over current page background, not a separate static sky block */
.footer>*{position:relative;z-index:2}
.footer-video{background:#19a3f5!important}
.footer-bg-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.footer-video::after{content:'';position:absolute;inset:0;background:rgba(0,134,255,.02);z-index:1}
.footer-transparent{background:transparent!important}
/* About page: static fixed cloud background; no sticky menu; sizes closer to original */
.about-main{background:var(--sky) center top/cover fixed no-repeat;color:#fff;min-height:100vh}
.about-arrow{font-size:78px;margin-top:10px;display:none!important}
.about-role strong,.about-year strong{font-weight:900}
/* Related projects: one normal carousel with side arrows only */
.related-top{position:relative}
.rel-arrow{display:none!important;position:absolute;z-index:3;top:50%;transform:translateY(-50%);width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,.85);color:#ddd;font-size:55px;line-height:36px;text-align:center}
.related-arrow:hover{color:var(--pink);background:#fff}
@media (max-width:760px){
.hero-logo{width:92vw;margin-bottom:58px}
.hero-center{transform:none}
.hero-buttons a{width:305px}
.topnav{padding:26px 30px 0}
.topnav a{font-size:26px;text-shadow:none!important}
.topnav .nav-logo{width:176px}
.topnav-project .nav-left{visibility:visible}
.topnav-project .nav-right{position:static;transform:none}
.project-overlay{left:31px;bottom:28px;gap:4px}
.project-overlay b{font-size:24px}
.project-overlay em{font-size:25px}
.footer{padding:64px 20px 72px}
.footer-contact{font-size:44px;line-height:1.05;margin-bottom:54px}
.footer-contact a{display:block;font-size:31px;margin-top:8px}
.footer-social{gap:34px;margin-bottom:72px}
.footer-social a{width:54px;height:54px}
.footer-social svg{width:46px;height:46px}
.copyright{font-size:28px;line-height:1.6}
.about-main{background:var(--sky) center top/cover fixed no-repeat}
.about-hero{padding:0 0 42px;min-height:auto}
.about-image{width:100%;margin-bottom:34px}
.about-intro{font-size:27px;line-height:1.48;width:86vw;margin-bottom:44px}
.about-content{width:90vw;padding:50px 0 20px}
.about-section{margin-bottom:66px}
.about-section h2{font-size:54px;margin-bottom:28px}
.about-role,.about-list,.about-year{font-size:22px;line-height:1.34;margin-bottom:24px}
.cv-link a{font-size:42px}
.related{width:90vw;padding:0 0 70px}
.related-track{gap:0;scroll-snap-type:x mandatory}
.related-card{min-width:100%;height:310px;scroll-snap-align:start;border-radius:14px}
.related-card:nth-child(n+2){display:block}
.related-arrow{width:48px;height:48px;font-size:62px;top:54%}
.related-arrow-left{left:12px}
.related-arrow-right{right:12px}
}
/* v4 refinements based on latest review */
/* HOME */
.hero-logo{width:min(900px,88vw);margin:0 auto 66px}
.side-social{position:absolute;left:38px;top:33%;z-index:3}
.side-social-inner{display:flex;flex-direction:column;gap:96px}
.side-social-inner a{width:54px;height:54px;display:grid;place-items:center;color:#fff}
.side-social-inner svg{width:40px;height:40px;fill:currentColor}
.side-email{position:absolute;right:28px;top:29%;z-index:4;width:46px;height:430px;background:url('/assets/img/vertical-email.png') center/contain no-repeat;font-size:0;color:transparent}
.hero-buttons a{display:block;width:285px}
.hero-buttons img{width:100%;height:auto;display:block;transition:filter .18s ease}
.hero-buttons a:hover img{filter:brightness(0) saturate(100%) invert(10%) sepia(100%) saturate(7482%) hue-rotate(336deg) brightness(97%) contrast(112%)}
/* NAV / work top buttons */
.topnav a,.work-nav .topnav a{font-family:var(--font-copy);font-size:27px;font-weight:700;letter-spacing:-.04em;text-transform:uppercase}
.topnav a:hover,.work-nav .topnav a:hover{color:var(--pink)!important}
.topnav .nav-logo{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:182px}
.nav-right{min-width:245px;text-align:right;display:flex;gap:52px;justify-content:flex-end}
/* Work cards on home */
.project-overlay b{font-size:23px;font-weight:700;line-height:1.02;text-transform:uppercase;font-family:var(--font-copy);letter-spacing:-.04em}
.project-overlay em{font-family:var(--font-serif);font-size:25px;font-style:normal;line-height:1}
/* Footer */
.footer{text-align:center;padding:64px 20px 72px;position:relative;overflow:hidden;background:transparent!important;color:#fff}
.footer-contact{font-family:var(--font-serif);font-size:var(--footer-contact-size);line-height:.92;margin-bottom:58px;margin:0 0 44px}
.footer-contact a{color:#fff;font-size:var(--footer-email-size);line-height:.92;font-family:var(--font-serif)}
.footer-social svg{width:42px;height:42px;fill:currentColor}
.copyright{font-size:22px;margin:0;line-height:1.35;color:#fff}
.footer-black,.footer-transparent{background:transparent!important}
/* About */
.about-hero{min-height:auto;padding:36px 0 28px;display:flex;flex-direction:column;align-items:center;text-align:center;position:relative}
.about-home-link{position:absolute;left:7.5vw;top:68%;transform:translateY(-50%);width:128px;z-index:3}
.about-home-link img{width:100%;display:block;transition:filter .18s ease}
.about-home-link:hover img{filter:brightness(0) saturate(100%) invert(10%) sepia(100%) saturate(7482%) hue-rotate(336deg) brightness(97%) contrast(112%)}
.about-image{width:min(1120px,96vw);margin:0 auto 18px}
.about-intro{width:min(760px,86vw);font-family:var(--font-denver);font-size:clamp(21px,1.45vw,28px);line-height:1.12;color:#3e3e3e;margin:0 auto 56px}
.about-content{width:min(980px,82vw);margin:0 auto;padding:24px 0 40px}
.about-section{margin-bottom:58px}
.about-section h2{font-family:var(--font-serif);color:var(--pink);font-size:clamp(54px,4.8vw,78px);font-weight:400;line-height:.9;margin:0 0 26px}
.about-role,.about-list,.about-year{font-size:clamp(20px,1.55vw,30px);line-height:1.14;margin:0 0 18px;color:#fff}
.about-year{margin-bottom:6px}
.about-list{margin-bottom:18px}
.cv-link{text-align:center;margin:46px 0 36px}
.cv-link a{font-family:var(--font-denver);font-size:clamp(36px,2.8vw,52px);text-decoration:underline;color:#fff;line-height:1}
/* Project pages */
.project-hero{height:100vh;min-height:720px;background-size:cover;background-position:center!important;position:relative;display:flex;align-items:center;justify-content:center;text-align:center}
.project-title-wrap{margin-top:82px;text-shadow:none}
.project-title-wrap p{font-family:var(--font-serif);font-size:clamp(34px,2.5vw,54px);line-height:.95;margin:0 0 10px}
.project-title-wrap h1{font-family:var(--font-serif);font-size:clamp(58px,4.7vw,92px);line-height:.92;margin:0;text-transform:uppercase;color:#fff}
.project-arrow{position:absolute;bottom:76px;left:50%;transform:translateX(-50%);font-size:58px}
.project-body{background:#070707 var(--black-texture) center top/auto repeat;color:#fff;padding:70px 0 0}
.claim{display:flex;align-items:center;justify-content:center;gap:14px;font-family:var(--font-denver);font-size:clamp(26px,2.25vw,40px);font-style:italic;text-align:center;margin:0 auto 56px;width:min(980px,90vw);line-height:1.05}
.claim span{height:3px;background:var(--pink);width:74px;display:inline-block}
.project-info{width:min(1080px,74vw);margin:0 auto 58px;display:grid;grid-template-columns:1fr 1fr;gap:62px;align-items:start}
.project-desc p,.awards p{font-size:clamp(17px,1.02vw,20px);line-height:1.52;margin:0;white-space:normal}
.awards h3{font-family:var(--font-serif);color:var(--pink);font-size:clamp(28px,2.05vw,40px);font-weight:400;line-height:.95;margin:0 0 12px}
.video{width:min(1080px,74vw);margin:0 auto 68px;aspect-ratio:16/9;border-radius:9px;overflow:hidden;background:#000}
.gallery h2,.related h2{font-family:var(--font-serif);color:var(--pink);font-size:clamp(56px,4.8vw,82px);font-weight:400;line-height:.9;margin:0 0 42px}
.related{width:min(1520px,92vw);margin:0 auto;padding:8px 0 72px;position:relative}
.related h2{font-size:clamp(44px,3.4vw,62px)}
.related-track{display:flex;gap:12px;overflow:hidden;scroll-behavior:smooth}
.related-card{flex:0 0 calc((100% - 24px)/3);height:242px;border-radius:12px;background-size:cover;background-position:center;position:relative;overflow:hidden;display:block;transition:transform .24s ease}
.related-card:hover{transform:translateY(-2px)}
.related-card::after{content:'';position:absolute;inset:0;background:linear-gradient(transparent 56%,rgba(0,0,0,.46))}
.related-copy{display:block;position:absolute;left:24px;bottom:18px;z-index:2;color:#fff;text-shadow:none}
.related-copy b{display:block;font-family:var(--font-copy);font-size:16px;line-height:1.02;font-weight:700;letter-spacing:-.03em;text-transform:uppercase;margin-bottom:2px}
.related-copy em{display:block;font-family:var(--font-serif);font-size:15px;line-height:1;font-style:normal}
.related-arrow{position:absolute;z-index:5;top:55%;transform:translateY(-50%);width:52px;height:52px;border:0;border-radius:50%;background:rgba(255,255,255,.75);color:#d6d6d6;font-family:Arial,sans-serif;font-size:56px;font-weight:900;line-height:1;text-align:center;display:grid;place-items:center;padding:0;cursor:pointer}
.related-arrow-left{left:-6px}
.related-arrow-right{right:-6px}
.flip-touch{width:58px;margin:24px auto 0}
@media (max-width:760px){
.hero-logo{width:94vw;margin-bottom:30px}
.side-email,.side-social{display:none!important}
.hero-buttons a{width:300px}
.project-overlay{left:28px;bottom:24px;opacity:1}
.project-overlay b{font-size:16px}
.project-overlay em{font-size:18px}
.footer{padding:58px 20px 68px}
.footer-contact{font-size:44px;line-height:.98}
.footer-contact a{display:block;font-size:40px;margin-top:4px}
.footer-social a{width:50px;height:50px}
.footer-social svg{width:38px;height:38px}
.about-hero{padding:0 0 16px}
.about-home-link{left:7vw;top:73%;width:104px}
.about-image{width:100%;margin-bottom:16px}
.about-intro{width:84vw;font-size:18px;line-height:1.18;margin-bottom:38px}
.about-content{width:84vw;padding:10px 0 10px}
.about-section h2{font-size:48px;margin-bottom:22px}
.about-role,.about-list,.about-year{font-size:16px;line-height:1.18;margin-bottom:14px}
.about-year{margin-bottom:4px}
.cv-link a{font-size:34px}
.project-title-wrap{margin-top:160px;padding:0 20px}
.project-title-wrap p{font-size:28px}
.project-title-wrap h1{font-size:48px}
.project-arrow{font-size:60px;bottom:112px}
.claim{font-size:22px;margin-bottom:42px}
.claim span{display:inline-block;width:38px;height:2px}
.project-info{width:88vw;display:block;margin-bottom:48px}
.project-desc p,.awards p{font-size:15px;line-height:1.5}
.awards{margin-top:30px}
.awards h3{font-size:24px}
.video{width:88vw;margin-bottom:48px}
.gallery{width:88vw;padding-bottom:40px}
.gallery h2,.related h2{text-align:left;font-size:54px;margin-bottom:28px}
.related{width:88vw;padding-bottom:54px}
.related-track{gap:0}
.related-card{min-width:100%;height:250px}
.related-copy{left:18px;bottom:16px}
.related-copy b{font-size:14px}
.related-copy em{font-size:15px}
.related-arrow{top:50%;width:44px;height:44px;font-size:46px}
.related-arrow-left{left:8px}
.related-arrow-right{right:8px}
}
/* v6 home corrections: clean video load, larger logo, softer work hover, visual footer icon alignment */
.home-hero{min-height:100vh;position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;background:#19a3f5 var(--sky) center/cover no-repeat!important}
.hero-bg-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;background:#19a3f5 var(--sky) center/cover no-repeat;opacity:1}
@media (min-width:761px){
.hero-center{width:min(1200px,92vw)!important}
.hero-logo{width:min(1200px,92vw)!important;margin-left:auto;margin-right:auto}
}
.project-card::after{content:''!important;position:absolute;inset:0;background:rgba(0,0,0,.24)!important;opacity:0;transition:opacity .28s ease!important;display:block!important;z-index:2;pointer-events:none}
.project-card:hover::after{opacity:1!important;display:block!important}
.project-overlay{position:absolute;left:86px;bottom:40px;z-index:3;opacity:0;transition:opacity .28s ease,transform .28s ease!important;display:flex;flex-direction:column;gap:2px;color:#fff!important;text-shadow:none;transform:translateY(8px)}
.project-card:hover .project-overlay{opacity:1!important;transform:translateY(0)}
.footer-social{display:flex;justify-content:center;gap:28px;margin-bottom:56px;align-items:center!important}
.footer-social a{width:54px;height:54px;display:flex!important;place-items:center;color:#fff;align-items:center!important;justify-content:center!important}
.footer-social a[aria-label="LinkedIn"] svg{width:41px;height:41px;transform:translate(1px,-1px)}
.footer-social a[aria-label="YouTube"] svg{width:56px;height:56px;transform:translate(0,1px)}
.footer-social a[aria-label="Instagram"] svg{width:47px;height:47px;transform:translate(0,0)}
@media (max-width:760px){
.project-card::after{opacity:.18!important}
.project-card:hover::after{opacity:.18!important}
.project-overlay{transform:none}
.footer-social a[aria-label="LinkedIn"] svg{width:38px;height:38px;transform:translate(1px,-1px)}
.footer-social a[aria-label="YouTube"] svg{width:52px;height:52px;transform:translate(0,1px)}
.footer-social a[aria-label="Instagram"] svg{width:44px;height:44px;transform:translate(0,0)}
}
/* v7 home typography corrections: Denver / Bargim / Nimbus */
.home-page .work-nav .topnav a,.home-page .topnav a{font-family:Nimbus, Arial, sans-serif!important;font-size:24px!important;font-weight:700!important;letter-spacing:-.035em!important;line-height:1!important;text-transform:uppercase!important}
.home-page .work-nav .topnav a:hover,.home-page .topnav a:hover{color:var(--pink)!important}
.home-page .project-overlay b{font-family:Nimbus, Arial, sans-serif!important;font-size:24px!important;font-weight:700!important;letter-spacing:-.035em!important;line-height:1.08!important;text-transform:uppercase!important}
.home-page .project-overlay em{font-family:Denver, Georgia, serif!important;font-size:32px!important;font-weight:400!important;font-style:normal!important;letter-spacing:0!important;line-height:.98!important}
.home-page .footer-contact,.home-page .footer-contact span,.home-page .footer-contact strong{font-family:Denver, Georgia, serif!important;font-size:64px!important;font-weight:400!important;line-height:.95!important;color:var(--pink)!important}
.home-page .footer-contact a{font-family:Bargim, Georgia, serif!important;font-size:40px!important;font-weight:400!important;line-height:1!important;color:#fff!important;vertical-align:baseline}
@media (max-width:760px){
.home-page .work-nav .topnav a,.home-page .topnav a{font-size:24px!important}
.home-page .project-overlay b{font-size:24px!important}
.home-page .project-overlay em{font-size:32px!important}
.home-page .footer-contact,.home-page .footer-contact span,.home-page .footer-contact strong{font-size:44px!important}
.home-page .footer-contact a{display:block;font-size:40px!important;margin-top:4px}
}
/* v12 about home button alignment: keep art centered and place HOME over the about image, visually aligned with ABOUT ILU */
@media (max-width:760px){
.about-page .about-home-link{left:calc(50% - min(245px, 38vw))!important;top:72%!important;width:104px!important}
}
/* v13 project pages: original boxed width, italic claim, cover fade */
.project-page .project-info{width:min(1140px, calc(100% - 40px))!important;max-width:1140px!important;margin-left:auto!important;margin-right:auto!important}
.project-page .claim em{font-family:Denver, Georgia, serif!important;font-style:italic!important;font-weight:400!important;line-height:1.05!important}
.project-page .project-hero{overflow:hidden!important;isolation:isolate}
.project-page .project-hero::after{content:'';position:absolute;left:0;right:0;bottom:0;height:34%;background:linear-gradient(to bottom, rgba(7,7,7,0) 0%, rgba(7,7,7,.72) 68%, #070707 100%);z-index:1;pointer-events:none}
.project-page .project-hero .topnav,.project-page .project-hero .project-title-wrap,.project-page .project-hero .project-arrow{position:relative;z-index:2}
@media (max-width:760px){
.project-page .project-info{width:88vw!important;max-width:none!important}
.project-page .project-hero::after{height:42%}
}
/* v14 fixes: project selector class actually present + About HOME button visible */
body.project-body-class.project-page .project-info,.project-page-main .project-info{width:min(1140px, calc(100% - 40px))!important;max-width:1140px!important;margin-left:auto!important;margin-right:auto!important}
body.project-body-class.project-page .video,body.project-body-class.project-page .gallery,.project-page-main .video,.project-page-main .gallery{width:min(1140px, calc(100% - 40px))!important;max-width:1140px!important}
.about-page .about-image{position:relative!important;z-index:1!important}
.about-page .about-home-link:hover{color:var(--pink)!important;border-color:var(--pink)!important}
@media (max-width:760px){
body.project-body-class.project-page .project-info,.project-page-main .project-info{width:88vw!important;max-width:none!important}
body.project-body-class.project-page .video,body.project-body-class.project-page .gallery,.project-page-main .video,.project-page-main .gallery{width:90vw!important;max-width:none!important}
body.project-body-class.project-page .project-hero::after,.project-page-main .project-hero::after{height:42%!important}
.about-page .about-home-link{left:7vw!important;top:73%!important;width:108px!important;height:44px!important;font-size:20px!important;border-width:2px!important}
}
/* v15 corrections: restore original About HOME image + constrain project content container */
body.project-body-class.project-page .claim,.project-page-main .claim,body.project-body-class.project-page .project-info,.project-page-main .project-info,body.project-body-class.project-page .video,.project-page-main .video,body.project-body-class.project-page .gallery,.project-page-main .gallery,body.project-body-class.project-page .related,.project-page-main .related{width:100%!important;max-width:1140px!important;margin-left:auto!important;margin-right:auto!important}
@media (max-width:760px){
body.project-body-class.project-page .project-body,.project-page-main > .project-body{width:90vw!important;max-width:none!important}
body.project-body-class.project-page .claim,.project-page-main .claim,body.project-body-class.project-page .project-info,.project-page-main .project-info,body.project-body-class.project-page .video,.project-page-main .video,body.project-body-class.project-page .gallery,.project-page-main .gallery,body.project-body-class.project-page .related,.project-page-main .related{width:100%!important;max-width:none!important}
.about-page .about-home-link{left:7vw!important;top:73%!important;width:104px!important}
}
/* v16 About HOME: exact uploaded image asset, no CSS reconstruction */
.about-page .about-home-link{display:block!important;position:absolute!important;left:calc(50% - min(440px, 38vw))!important;top:68%!important;width:134px!important;transform:translateY(-50%)!important;z-index:50!important;opacity:1!important;pointer-events:auto!important;align-items:center!important;justify-content:center!important;height:52px!important;box-sizing:border-box!important;border:0!important;border-radius:0!important;color:transparent!important;background:transparent!important;font-family:Nimbus, Arial, sans-serif!important;font-size:0!important;font-weight:900!important;line-height:1!important;text-transform:uppercase!important;text-decoration:none!important;letter-spacing:-1px!important;text-shadow:none!important;box-shadow:none!important;padding:0!important;margin:0!important;overflow:visible!important}
.about-page .about-home-link img{display:block!important;width:134px!important;height:52px!important;opacity:1!important;filter:none!important;visibility:visible!important;transform:none!important;max-width:none!important;object-fit:contain!important}
.about-page .about-home-link:hover img{filter:none!important;transform:none!important}
@media (max-width:760px){
.about-page .about-home-link{left:7vw!important;top:73%!important;width:104px!important;height:auto!important}
.about-page .about-home-link img{width:104px!important;height:auto!important}
}
/* v17 About HOME: stable image placement inside the About artwork */
@media (min-width:1024px) and (max-width:1280px){
.about-page .about-media .about-home-link{left:22.2%!important;top:79.2%!important;width:clamp(108px, 11vw, 126px)!important}
}
@media (min-width:1281px) and (max-width:1700px){
.about-page .about-media .about-home-link{left:22.8%!important;top:79.5%!important}
}
@media (min-width:1701px){
.about-page .about-media .about-home-link{left:22.8%!important;top:79.5%!important;width:134px!important}
}
@media (max-width:760px){
.about-page .about-media{width:100%!important;margin-bottom:34px!important}
.about-page .about-media .about-home-link{left:22.6%!important;top:79.5%!important;width:clamp(76px, 22vw, 104px)!important}
}
/* v18 About HOME + image button hover fix: no filter interpolation, no overlap with title */
/* Home hero image buttons: use a solid masked hover layer instead of animated CSS filters */
.home-page .hero-buttons.image-buttons a:first-child::after{-webkit-mask-image:url('/assets/uploads/2023/12/work_icon.svg')!important;mask-image:url('/assets/uploads/2023/12/work_icon.svg')!important}
.home-page .hero-buttons.image-buttons a:nth-child(2)::after{-webkit-mask-image:url('/assets/uploads/2023/12/about_icon.svg')!important;mask-image:url('/assets/uploads/2023/12/about_icon.svg')!important}
.home-page .hero-buttons.image-buttons a:hover::after,.home-page .hero-buttons.image-buttons a:focus-visible::after{opacity:1!important}
/* About HOME: exact uploaded PNG, positioned safely away from ABOUT ILU title */
@media (min-width:1024px) and (max-width:1280px){
.about-page .about-media .about-home-link{left:12.8%!important;top:79.4%!important;width:12%!important;min-width:90px!important;max-width:124px!important}
}
@media (min-width:1701px){
.about-page .about-media .about-home-link{left:13.2%!important;top:79.4%!important;width:134px!important;min-width:134px!important;max-width:134px!important}
}
@media (max-width:760px){
.about-page .about-media .about-home-link{left:13%!important;top:79.4%!important;width:18%!important;min-width:70px!important;max-width:104px!important}
}
/* v19 About alignment + home button hover restore
   - About HOME aligned vertically with the ABOUT ILU artwork text.
   - Home hero buttons recover hover without filter interpolation/colour tween. */
@media (min-width:1024px) and (max-width:1280px){
.about-page .about-media .about-home-link{left:22.8%!important;top:84.8%!important;width:clamp(104px, 11vw, 124px)!important;min-width:104px!important;max-width:124px!important}
}
@media (min-width:1701px){
.about-page .about-media .about-home-link{left:22.8%!important;top:84.8%!important;width:134px!important;min-width:134px!important;max-width:134px!important}
}
@media (max-width:760px){
.about-page .about-media .about-home-link{left:22.8%!important;top:84.8%!important;width:clamp(74px, 19vw, 104px)!important;min-width:74px!important;max-width:104px!important}
}
/* The previous masked hover can fail with remote SVG masks, so use a direct instant filter fallback for home buttons only. */
.home-page .hero-buttons.image-buttons a:hover img,.home-page .hero-buttons.image-buttons a:focus-visible img{filter:brightness(0) saturate(100%) invert(10%) sepia(100%) saturate(7482%) hue-rotate(336deg) brightness(97%) contrast(112%)!important;transition:none!important}
/* v20 critical fix: About HOME placement + reliable instant hover
   The About HOME image is positioned in the empty space left of the ABOUT ILU artwork,
   vertically centered with the ABOUT ILU title and kept away from the letter A across desktop widths. */
.about-page .about-media .about-home-link img{display:block!important;width:100%!important;height:auto!important;max-width:none!important;object-fit:contain!important;opacity:1!important;visibility:visible!important;filter:none!important;transform:none!important;transition:none!important;will-change:filter!important}
.about-page .about-media .about-home-link::after{content:''!important;position:absolute!important;inset:0!important;display:block!important;background:var(--button-hover-pink,#F5004B)!important;opacity:0!important;pointer-events:none!important;transition:opacity .08s linear!important;-webkit-mask:url('/assets/img/about-home-button.png') center/contain no-repeat!important;mask:url('/assets/img/about-home-button.png') center/contain no-repeat!important}
.about-page .about-media .about-home-link:hover::after,.about-page .about-media .about-home-link:focus-visible::after{opacity:1!important}
.about-page .about-media .about-home-link:hover img,.about-page .about-media .about-home-link:focus-visible img{filter:none!important}
@media (min-width:761px) and (max-width:1180px){
.about-page .about-media .about-home-link{left:14.2%!important;top:84.8%!important;width:clamp(100px, 11vw, 124px)!important;min-width:100px!important;max-width:124px!important}
}
@media (min-width:1701px){
.about-page .about-media .about-home-link{left:14.2%!important;top:84.8%!important;width:134px!important;min-width:134px!important;max-width:134px!important}
}
@media (max-width:760px){
.about-page .about-media .about-home-link{left:14.2%!important;top:84.8%!important;width:clamp(70px, 18vw, 104px)!important;min-width:70px!important;max-width:104px!important}
}
/* v20: Home buttons recover hover using the actual image and no animated colour interpolation. */
.home-page .hero-buttons.image-buttons a{position:relative!important;display:block!important;line-height:0!important;transition:none!important;cursor:pointer!important}
.home-page .hero-buttons.image-buttons img{display:block!important;width:100%!important;height:auto!important;filter:none!important;transition:none!important;transform:none!important;will-change:filter!important}
.home-page .hero-buttons.image-buttons a::after{content:''!important;position:absolute!important;inset:0!important;display:none!important;background:var(--button-hover-pink)!important;opacity:0!important;pointer-events:none!important;transition:none!important;-webkit-mask-position:center!important;mask-position:center!important;-webkit-mask-repeat:no-repeat!important;mask-repeat:no-repeat!important;-webkit-mask-size:contain!important;mask-size:contain!important}
.home-page .hero-buttons.image-buttons a:hover img,.home-page .hero-buttons.image-buttons a:focus-visible img,.home-page .hero-buttons.image-buttons a.is-hovered img{filter:brightness(0) saturate(100%) invert(10%) sepia(100%) saturate(7482%) hue-rotate(336deg) brightness(97%) contrast(112%)!important;transition:none!important}
/* v21: Home vertical email hover in solid pink using the actual PNG as mask. */
.home-page .side-email{position:absolute!important;display:block!important;color:transparent!important;overflow:visible!important}
.home-page .side-email::after{content:''!important;position:absolute!important;inset:0!important;display:block!important;background:var(--button-hover-pink,var(--pink,#F5004B))!important;opacity:0!important;pointer-events:none!important;transition:opacity .08s linear!important;-webkit-mask:url('/assets/img/vertical-email.png') center/contain no-repeat!important;mask:url('/assets/img/vertical-email.png') center/contain no-repeat!important}
.home-page .side-email:hover::after,.home-page .side-email:focus-visible::after{opacity:1!important}
/* v21: smoother in-page movement to Work, driven by JS with this duration/ease. */
.home-page{scroll-behavior:auto}
/* v22: Footer email hover in pink, matching the rest of the site links. */
.footer-contact > a,.home-page .footer-contact > a{transition:color .12s linear!important}
.footer-contact > a:hover,.footer-contact > a:focus-visible,.home-page .footer-contact > a:hover,.home-page .footer-contact > a:focus-visible{color:var(--button-hover-pink,var(--pink,#F5004B))!important}
/* v22: JS owns the Home -> Work animation, so browser native smooth scroll cannot mask it. */
.home-page,.home-page html{scroll-behavior:auto!important}
html:has(body.home-page){scroll-behavior:auto!important}
/* v23: hash-free in-page scroll triggers keep the visual style of links without using href="#...". */
[data-scroll-target]{cursor:pointer}
[data-scroll-target]:focus-visible{outline:2px solid var(--pink);outline-offset:6px}
.footer-contact a:hover,.footer-contact a:focus-visible{color:var(--button-hover-pink,var(--pink,#F5004B))!important}
/* v26: About awards year-to-list spacing matched to role line breaks */
.about-page .about-hero{position:relative!important;padding-top:0!important;padding-bottom:28px!important}
.about-page .about-media{position:relative!important;width:min(1120px,96vw)!important;max-width:1120px!important;margin:0 auto!important;line-height:0!important;isolation:isolate!important;padding-top:30px!important;padding-bottom:50px!important;box-sizing:border-box!important}
.about-page .about-media .about-image{display:block!important;width:103%!important;max-width:none!important;height:auto!important;margin:0 0 0 50%!important;position:relative!important;z-index:1!important;transform:translateX(-50%)!important}
.about-page .about-media .about-home-link{display:block!important;position:absolute!important;left:12.95%!important;top:calc(84.8% - 38px)!important;width:clamp(112px, 12vw, 134px)!important;height:auto!important;padding:0!important;margin:0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;text-shadow:none!important;transform:translate(-50%, -50%)!important;z-index:10!important;opacity:1!important;pointer-events:auto!important;overflow:visible!important;font-size:0!important;color:transparent!important;line-height:0!important;min-width:112px!important;max-width:134px!important;transition:none!important}
.about-page .about-intro{width:min(900px,86vw)!important;max-width:900px!important;font-size:32px!important;line-height:1.12!important;margin:0 auto 100px!important}
.about-page .about-content{width:min(980px,82vw)!important;padding-top:0!important}
.about-page .about-section{margin-bottom:80px!important}
.about-page .about-section h2{font-size:64px!important;line-height:.92!important;margin:0 0 32px!important}
.about-page .about-role,.about-page .about-list,.about-page .about-year{font-size:32px!important;line-height:1.18!important;margin:0 0 32px!important}
.about-page .about-year{margin-bottom:0!important}
.about-page .about-list + .about-year{margin-top:32px!important}
.about-page .cv-link{margin-top:80px!important}
@media (min-width:1701px){
.about-page .about-media .about-home-link{left:12.95%!important;top:calc(84.8% - 38px)!important;width:134px!important;min-width:134px!important;max-width:134px!important}
}
@media (min-width:761px) and (max-width:1180px){
.about-page .about-media .about-home-link{left:12.95%!important;top:calc(84.8% - 38px)!important;width:clamp(100px, 11vw, 124px)!important;min-width:100px!important;max-width:124px!important}
}
@media (max-width:760px){
.about-page .about-media{width:100vw!important;padding-top:24px!important;padding-bottom:58px!important}
.about-page .about-media .about-image{width:103%!important}
.about-page .about-media .about-home-link{left:12.95%!important;top:calc(84.8% - 29px)!important;width:clamp(70px,18vw,104px)!important;min-width:70px!important;max-width:104px!important}
.about-page .about-intro{width:86vw!important;font-size:22px!important;line-height:1.16!important;margin-bottom:72px!important}
.about-page .about-content{width:84vw!important}
.about-page .about-section{margin-bottom:64px!important}
.about-page .about-section h2{font-size:48px!important;margin-bottom:26px!important}
.about-page .about-role,.about-page .about-list,.about-page .about-year{font-size:20px!important;line-height:1.18!important;margin-bottom:26px!important}
.about-page .about-year{margin-bottom:0!important}
.about-page .about-list + .about-year{margin-top:26px!important}
.about-page .cv-link{margin-top:64px!important}
}
/* v27 project pages: hero gradients, claim position and typography */
@media (max-width:760px){
body.project-body-class.project-page .project-hero::before,.project-page-main .project-hero::before{height:18%!important}
body.project-body-class.project-page .project-hero::after,.project-page-main .project-hero::after{height:34%!important}
body.project-body-class.project-page .project-arrow,.project-page-main .project-arrow{bottom:108px!important;font-size:72px!important}
body.project-body-class.project-page .claim,.project-page-main .claim{width:90vw!important;max-width:none!important;margin:-24px auto 48px!important;font-size:24px!important;gap:10px!important}
body.project-body-class.project-page .claim em,.project-page-main .claim em{font-size:24px!important}
body.project-body-class.project-page .claim span,.project-page-main .claim span{width:52px!important;height:2px!important}
body.project-body-class.project-page .awards h3,.project-page-main .awards h3{font-size:28px!important}
body.project-body-class.project-page .gallery h2,body.project-body-class.project-page .related h2,.project-page-main .gallery h2,.project-page-main .related h2{font-size:42px!important;margin-bottom:28px!important}
}
/* v28 project pages: real image-to-texture fade, visible white arrow, exact text sizes, footer font for red titles */
/* The image itself is now a masked layer, so the bottom fades to transparent and reveals the textured page background. */
/* Remove the previous flat black band. */
/* Force the white arrow to render visibly and consistently. */
/* Claim sits on the fade area, not below a hard hero edge. */
/* White project body text: exact 18px, not clamp up to ~20px. */
body.project-body-class.project-page .project-desc p,body.project-body-class.project-page .awards p,.project-page-main .project-desc p,.project-page-main .awards p{font-size:18px!important;line-height:1.52!important}
/* Red project titles use the same display font as the footer. */
body.project-body-class.project-page .awards h3,body.project-body-class.project-page .gallery h2,body.project-body-class.project-page .related h2,.project-page-main .awards h3,.project-page-main .gallery h2,.project-page-main .related h2{font-family:var(--font-serif)!important;color:var(--pink)!important;font-weight:400!important}
@media (max-width:760px){
body.project-body-class.project-page .project-hero::before,.project-page-main .project-hero::before{-webkit-mask-image:linear-gradient(to bottom, #000 0%, #000 70%, rgba(0,0,0,.68) 82%, rgba(0,0,0,0) 100%)!important;mask-image:linear-gradient(to bottom, #000 0%, #000 70%, rgba(0,0,0,.68) 82%, rgba(0,0,0,0) 100%)!important}
body.project-body-class.project-page .project-arrow,.project-page-main .project-arrow{bottom:108px!important;width:64px!important;height:64px!important}
body.project-body-class.project-page .project-arrow::before,.project-page-main .project-arrow::before{font-size:70px!important}
body.project-body-class.project-page .claim,.project-page-main .claim{width:90vw!important;max-width:none!important;margin:-24px auto 48px!important;font-size:24px!important;gap:10px!important}
body.project-body-class.project-page .claim em,.project-page-main .claim em{font-size:24px!important}
body.project-body-class.project-page .claim span,.project-page-main .claim span{width:52px!important;height:2px!important}
body.project-body-class.project-page .project-desc p,body.project-body-class.project-page .awards p,.project-page-main .project-desc p,.project-page-main .awards p{font-size:18px!important}
body.project-body-class.project-page .awards h3,.project-page-main .awards h3{font-size:28px!important}
body.project-body-class.project-page .gallery h2,body.project-body-class.project-page .related h2,.project-page-main .gallery h2,.project-page-main .related h2{font-size:42px!important;margin-bottom:28px!important}
}
/* v29 project pages: restore full hero image, fade overlay to texture, SVG arrow */
body.project-body-class.project-page,.project-page-main{background:#070707 var(--black-texture) center top/auto repeat!important}
/* Restore the hero image as the real full-height background. v28 had moved it into a masked layer and it visually collapsed into the top area when scrolling. */
/* Subtle top darkening only, not a full black overlay. */
/* Real fade into the same textured black background: the texture is overlaid progressively only at the bottom. */
/* Use the supplied SVG arrow, same shape as the reference. */
/* Keep the claim sitting on the transition area without pushing the whole hero/title down. */
body.project-body-class.project-page .project-body,.project-page-main > .project-body{width:min(1140px, calc(100% - 40px))!important;max-width:1140px!important;margin-left:auto!important;margin-right:auto!important;padding-left:0!important;padding-right:0!important;box-sizing:border-box!important;padding-top:0!important}
body.project-body-class.project-page .claim em,.project-page-main .claim em{font-family:var(--font-denver)!important;font-style:italic!important;font-weight:400!important;line-height:1.08!important;font-size:32px!important}
body.project-body-class.project-page .claim span,.project-page-main .claim span{width:88px!important;height:3px!important;background:var(--pink)!important}
/* Exact white body text size. */
body.project-body-class.project-page .project-info .project-desc p,body.project-body-class.project-page .project-info .awards p,.project-page-main .project-info .project-desc p,.project-page-main .project-info .awards p{font-size:18px!important;line-height:1.52!important}
/* Pink project titles: same display family used by the footer. */
body.project-body-class.project-page .project-info .awards h3,body.project-body-class.project-page .gallery h2,body.project-body-class.project-page .related h2,.project-page-main .project-info .awards h3,.project-page-main .gallery h2,.project-page-main .related h2{font-family:var(--font-serif)!important;color:var(--pink)!important;font-weight:400!important}
body.project-body-class.project-page .project-info .awards h3,.project-page-main .project-info .awards h3{font-size:32px!important;line-height:.95!important;margin:0 0 14px!important}
body.project-body-class.project-page .gallery h2,body.project-body-class.project-page .related h2,.project-page-main .gallery h2,.project-page-main .related h2{font-size:64px!important;line-height:.92!important;margin:0 0 48px!important}
@media (max-width:760px){
body.project-body-class.project-page .project-hero,.project-page-main .project-hero{background-position:center!important}
body.project-body-class.project-page .project-hero::before,.project-page-main .project-hero::before{height:20%!important}
body.project-body-class.project-page .project-hero::after,.project-page-main .project-hero::after{height:38%!important;-webkit-mask-image:linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,.22) 40%, #000 100%)!important;mask-image:linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,.22) 40%, #000 100%)!important}
body.project-body-class.project-page .project-arrow,.project-page-main .project-arrow{bottom:108px!important;width:36px!important;height:36px!important}
body.project-body-class.project-page .claim,.project-page-main .claim{width:90vw!important;max-width:none!important;margin:-28px auto 48px!important;font-size:24px!important;gap:10px!important}
body.project-body-class.project-page .claim em,.project-page-main .claim em{font-size:24px!important}
body.project-body-class.project-page .claim span,.project-page-main .claim span{width:52px!important;height:2px!important}
body.project-body-class.project-page .project-info .project-desc p,body.project-body-class.project-page .project-info .awards p,.project-page-main .project-info .project-desc p,.project-page-main .project-info .awards p{font-size:18px!important}
body.project-body-class.project-page .project-info .awards h3,.project-page-main .project-info .awards h3{font-size:28px!important}
body.project-body-class.project-page .gallery h2,body.project-body-class.project-page .related h2,.project-page-main .gallery h2,.project-page-main .related h2{font-size:42px!important;margin-bottom:28px!important}
}
/* v30 project arrow: vertically centered between title and claim + pink hover */
body.project-body-class.project-page .project-arrow::after,.project-page-main .project-arrow::after{content:''!important;position:absolute!important;inset:0!important;display:block!important;background:#fff!important;-webkit-mask:url('/assets/img/project-arrow.svg') center/contain no-repeat!important;mask:url('/assets/img/project-arrow.svg') center/contain no-repeat!important;transition:background-color .18s ease!important}
body.project-body-class.project-page .project-arrow:hover::after,body.project-body-class.project-page .project-arrow:focus-visible::after,.project-page-main .project-arrow:hover::after,.project-page-main .project-arrow:focus-visible::after{background:var(--pink)!important}
@media (max-width:760px){
body.project-body-class.project-page .project-arrow,.project-page-main .project-arrow{bottom:150px!important;width:38px!important;height:38px!important}
}
/* v31 Redeem card: smaller desktop card, desktop hover flip, mobile click flip */
/* Desktop: hover flips the card. */
@media (hover:hover) and (pointer:fine){
body.project-body-class.project-page .flip-card:hover .flip-card-inner,body.project-body-class.project-page .flip-card:focus-visible .flip-card-inner,.project-page-main .flip-card:hover .flip-card-inner,.project-page-main .flip-card:focus-visible .flip-card-inner{transform:rotateY(180deg)!important}
body.project-body-class.project-page .flip-card.is-flipped .flip-card-inner,.project-page-main .flip-card.is-flipped .flip-card-inner{transform:none!important}
}
/* Mobile/coarse pointers: click/tap keeps using the is-flipped class. */
@media (hover:none), (pointer:coarse), (max-width:760px){
body.project-body-class.project-page .flip-card.is-flipped .flip-card-inner,.project-page-main .flip-card.is-flipped .flip-card-inner{transform:rotateY(180deg)!important}
}
body.project-body-class.project-page .flip-card img,.project-page-main .flip-card img{border-radius:0!important;box-shadow:none!important}
body.project-body-class.project-page .flip-touch,.project-page-main .flip-touch{display:none!important}
@media (max-width:760px){
body.project-body-class.project-page .flip-card-block,.project-page-main .flip-card-block{width:78vw!important;max-width:360px!important;margin:0 auto 70px!important}
body.project-body-class.project-page .flip-hover-icon,.project-page-main .flip-hover-icon{display:none!important}
body.project-body-class.project-page .flip-touch,.project-page-main .flip-touch{display:block!important;width:74px!important;margin:24px auto 0!important}
}
/* v32 Redeem card: 120% visual width + supplied desktop SVG icon forced */
body.project-body-class.project-page .flip-card-block,.project-page-main .flip-card-block{max-width:350px!important;width:min(350px, 24vw)!important;margin:0 auto 92px!important;text-align:center!important;perspective:1400px!important;overflow:visible!important}
body.project-body-class.project-page .flip-card,.project-page-main .flip-card{width:120%!important;display:block!important;margin:0 auto!important;max-width:none!important;margin-left:50%!important;transform:translateX(-50%)!important}
body.project-body-class.project-page .flip-card-inner,.project-page-main .flip-card-inner{transition:transform .72s ease!important;transform-style:preserve-3d!important;width:100%!important}
body.project-body-class.project-page .flip-card img.flip-front,body.project-body-class.project-page .flip-card img.flip-back,.project-page-main .flip-card img.flip-front,.project-page-main .flip-card img.flip-back{width:100%!important;max-width:none!important}
body.project-body-class.project-page .flip-hover-icon,.project-page-main .flip-hover-icon{display:block!important;width:42px!important;height:auto!important;margin:18px auto 0!important;opacity:1!important;visibility:visible!important;content:url('/assets/img/redeem-flip-arrows.svg')!important}
@media (hover:hover) and (pointer:fine){
body.project-body-class.project-page .flip-hover-icon,.project-page-main .flip-hover-icon{display:block!important}
body.project-body-class.project-page .flip-touch,.project-page-main .flip-touch{display:none!important}
}
@media (max-width:760px){
body.project-body-class.project-page .flip-card-block,.project-page-main .flip-card-block{width:78vw!important;max-width:360px!important}
body.project-body-class.project-page .flip-card,.project-page-main .flip-card{width:100%!important;margin-left:auto!important;transform:none!important}
body.project-body-class.project-page .flip-hover-icon,.project-page-main .flip-hover-icon{display:none!important}
body.project-body-class.project-page .flip-touch,.project-page-main .flip-touch{display:block!important}
}
/* v33 See other projects carousel: full-width layout, clean arrows, home thumbnails and smooth visual behavior */
body.project-body-class.project-page .related-card::after,.project-page-main .related-card::after{content:''!important;position:absolute!important;inset:0!important;z-index:1!important;background:linear-gradient(to bottom, rgba(0,0,0,0) 38%, rgba(0,0,0,.24) 62%, rgba(0,0,0,.86) 100%)!important;opacity:1!important;pointer-events:none!important}
body.project-body-class.project-page .related-arrow-left,.project-page-main .related-arrow-left{left:16px!important}
body.project-body-class.project-page .related-arrow-right,.project-page-main .related-arrow-right{right:16px!important}
body.project-body-class.project-page .related-arrow:hover,body.project-body-class.project-page .related-arrow:focus-visible,.project-page-main .related-arrow:hover,.project-page-main .related-arrow:focus-visible{background:#fff!important}
@media (max-width:760px){
body.project-body-class.project-page .related,.project-page-main .related{width:90vw!important;padding-bottom:35px!important}
body.project-body-class.project-page .related h2,.project-page-main .related h2{font-size:38px!important;margin-bottom:15px!important}
body.project-body-class.project-page .related-track,.project-page-main .related-track{gap:12px!important;overflow-x:hidden!important}
body.project-body-class.project-page .related-card,.project-page-main .related-card{flex:0 0 100%!important;min-width:100%!important;height:260px!important}
body.project-body-class.project-page .related-copy,.project-page-main .related-copy{left:22px!important;bottom:20px!important}
body.project-body-class.project-page .related-arrow,.project-page-main .related-arrow{top:calc(15px + 130px + 38px)!important;width:38px!important;height:38px!important}
body.project-body-class.project-page .related-arrow-left,.project-page-main .related-arrow-left{left:12px!important}
body.project-body-class.project-page .related-arrow-right,.project-page-main .related-arrow-right{right:12px!important}
}
/* v34 related carousel: working arrows + Home hover typography */
body.project-body-class.project-page .related-arrow *,.project-page-main .related-arrow *{pointer-events:none!important}
@media (max-width:760px){
body.project-body-class.project-page .related-copy,.project-page-main .related-copy{left:22px!important;right:22px!important;max-width:calc(100% - 44px)!important}
body.project-body-class.project-page .related-copy b,.project-page-main .related-copy b{font-size:20px!important}
body.project-body-class.project-page .related-copy em,.project-page-main .related-copy em{font-size:18px!important}
}
/* v35 related carousel: centered viewport layout + smooth transform movement + subtitle size */
body.project-body-class.project-page .related-top,.project-page-main .related-top{width:100%!important;margin:0!important}
body.project-body-class.project-page .related-card,.project-page-main .related-card{flex:0 0 calc((100vw - 204px) / 3)!important;height:270px!important;border-radius:10px!important;background-size:cover!important;background-position:center!important;position:relative!important;overflow:hidden!important;display:block!important;color:#fff!important;width:calc((100vw - 204px) / 3)!important;max-width:none!important}
@media (max-width:760px){
body.project-body-class.project-page .related,.project-page-main .related{left:auto!important;transform:none!important;width:90vw!important;margin:0 auto!important;padding-bottom:35px!important;overflow:hidden!important}
body.project-body-class.project-page .related-card,.project-page-main .related-card{flex:0 0 100%!important;width:100%!important;min-width:100%!important}
body.project-body-class.project-page .related-copy em,.project-page-main .related-copy em{font-size:12px!important;margin-top:8px!important}
}
/* v36 carousel arrows: solid circle with transparent cutout arrow */
body.project-body-class.project-page .related-arrow::before,.project-page-main .related-arrow::before{content:''!important;position:absolute!important;top:50%!important;left:50%!important;width:100%!important;height:100%!important;border-top:4px solid #d7d7d7!important;border-left:4px solid #d7d7d7!important;background:rgba(255,255,255,.90)!important;transform-origin:center!important;inset:0!important;border:0!important;transform:none!important;transition:background-color .18s ease, opacity .18s ease!important;pointer-events:none!important}
body.project-body-class.project-page .related-arrow-left::before,.project-page-main .related-arrow-left::before{-webkit-mask:url('/assets/img/carousel-arrow-left-cutout.svg') center/contain no-repeat!important;mask:url('/assets/img/carousel-arrow-left-cutout.svg') center/contain no-repeat!important}
body.project-body-class.project-page .related-arrow-right::before,.project-page-main .related-arrow-right::before{-webkit-mask:url('/assets/img/carousel-arrow-right-cutout.svg') center/contain no-repeat!important;mask:url('/assets/img/carousel-arrow-right-cutout.svg') center/contain no-repeat!important}
body.project-body-class.project-page .related-arrow::after,.project-page-main .related-arrow::after{content:none!important;display:none!important}
body.project-body-class.project-page .related-arrow:hover::before,body.project-body-class.project-page .related-arrow:focus-visible::before,.project-page-main .related-arrow:hover::before,.project-page-main .related-arrow:focus-visible::before{border-color:var(--pink)!important;background:var(--pink)!important}
/* v37 infinite related carousel */
/* v38 true loop carousel: invisible reset, no long animated jumps */
/* v39 DOM-loop carousel: one-card wheel, no clone visual mismatch */
body.project-body-class.project-page .related-track,.project-page-main .related-track{display:flex!important;gap:12px!important;overflow-x:hidden!important;overflow-y:hidden!important;scroll-behavior:auto!important;width:max-content!important;max-width:none!important;will-change:transform!important;position:relative!important;overflow:visible!important;transition:transform .58s cubic-bezier(.22,.61,.36,1)!important;transform:translate3d(0,0,0)}
body.project-body-class.project-page .related-track.is-jump-reset,.project-page-main .related-track.is-jump-reset{transition:none!important}
body.project-body-class.project-page .related-card[data-carousel-clone="true"],.project-page-main .related-card[data-carousel-clone="true"]{pointer-events:none!important;display:none!important}
/* v40 projects without awards: description spans the full text+awards area */
body.project-body-class.project-page .project-info.project-info-no-awards,.project-page-main .project-info.project-info-no-awards{display:block!important;width:min(1120px, calc(100% - 40px))!important;max-width:1120px!important;margin-left:auto!important;margin-right:auto!important;text-align:center!important}
body.project-body-class.project-page .project-info.project-info-no-awards .project-desc,.project-page-main .project-info.project-info-no-awards .project-desc{width:100%!important;max-width:none!important;margin:0 auto!important}
body.project-body-class.project-page .project-info.project-info-no-awards .project-desc p,.project-page-main .project-info.project-info-no-awards .project-desc p{width:100%!important;max-width:none!important;margin:0 auto!important;text-align:center!important}
@media (max-width:760px){
body.project-body-class.project-page .project-info.project-info-no-awards,.project-page-main .project-info.project-info-no-awards{width:90vw!important;max-width:none!important}
}
/* v41 global back-to-top button */
.back-to-top:hover,.back-to-top:focus-visible{background:var(--pink)!important;transform:translateY(-2px)!important}
@media (max-width:760px){
.back-to-top{right:18px!important;bottom:18px!important;width:44px!important;height:44px!important}
.back-to-top::before{width:12px!important;height:12px!important;border-width:4px!important}
}
/* v42 carousel readiness + no-JS fallback */
.js body.project-body-class.project-page .related-track,.js .project-page-main .related-track{transition:transform .58s cubic-bezier(.22,.61,.36,1)!important;will-change:transform!important}
.js body.project-body-class.project-page .related-track.is-jump-reset,.js .project-page-main .related-track.is-jump-reset{transition:none!important}
/* If JS fails, keep carousel usable as a normal horizontal scroller. */
.no-js body.project-body-class.project-page .related,.no-js .project-page-main .related{overflow:visible!important}
.no-js body.project-body-class.project-page .related-track,.no-js .project-page-main .related-track{overflow-x:auto!important;overflow-y:hidden!important;scroll-behavior:smooth!important;transform:none!important;width:100%!important;max-width:100%!important;-webkit-overflow-scrolling:touch!important;scroll-snap-type:x mandatory!important;padding-bottom:8px!important}
.no-js body.project-body-class.project-page .related-card,.no-js .project-page-main .related-card{scroll-snap-align:start!important}
.no-js body.project-body-class.project-page .related-arrow,.no-js .project-page-main .related-arrow,.no-js .back-to-top{display:none!important}
/* Hide scrollbar where possible but leave the scroller usable if JS is disabled. */
.no-js body.project-body-class.project-page .related-track::-webkit-scrollbar,.no-js .project-page-main .related-track::-webkit-scrollbar{height:8px!important}
.no-js body.project-body-class.project-page .related-track::-webkit-scrollbar-thumb,.no-js .project-page-main .related-track::-webkit-scrollbar-thumb{background:rgba(255,255,255,.28)!important;border-radius:999px!important}
/* v43 back-to-top: hidden until scroll + smaller and softer */
@media (max-width:760px){
.back-to-top{right:16px!important;bottom:16px!important;width:38px!important;height:38px!important}
.back-to-top::before{width:10px!important;height:10px!important;border-top-width:3px!important;border-left-width:3px!important}
}
/* v44 back-to-top opacity restore: still hidden until scroll, but visible state is clear again */
.back-to-top{position:fixed!important;right:26px!important;bottom:26px!important;z-index:120!important;width:40px!important;height:40px!important;padding:0!important;border:0!important;border-radius:999px!important;background:rgba(255,255,255,.92)!important;box-shadow:none!important;cursor:pointer!important;display:block!important;opacity:0!important;visibility:hidden!important;transition:opacity .18s ease, visibility .18s ease, background-color .18s ease, transform .18s ease!important;pointer-events:none!important;transform:translateY(8px)!important}
.back-to-top.is-visible{opacity:1!important;visibility:visible!important;pointer-events:auto!important;transform:translateY(0)!important;background:rgba(255,255,255,.92)!important}
.back-to-top.is-visible:hover,.back-to-top.is-visible:focus-visible{opacity:1!important;background:var(--pink)!important;transform:translateY(-2px)!important}
.back-to-top::before{content:''!important;position:absolute!important;left:50%!important;top:50%!important;width:11px!important;height:11px!important;border-top:4px solid #d7d7d7!important;border-left:4px solid #d7d7d7!important;transform:translate(-50%, -32%) rotate(45deg)!important;transition:border-color .18s ease!important;border-top-width:3px!important;border-left-width:3px!important;border-color:#d7d7d7!important}
.back-to-top:hover::before,.back-to-top:focus-visible::before{border-color:#fff!important}
/* v51 about red titles spacing
   Keep the exact v50 display typography, only reduce bottom spacing. */
body.about-page .about-section h2,body.about-page .about-content .about-section h2{margin-bottom:16px!important}
/* v52 vertical media layout
   - Gallery images detected as vertical are shown 2 per row at 49%.
   - Marked vertical YouTube embeds use the same 2-up rhythm.
   v53: restore the original 70px vertical rhythm between media rows. */
body.project-body-class.project-page .gallery-stack,.project-page-main .gallery-stack{display:flex!important;flex-direction:row!important;flex-wrap:wrap!important;align-items:flex-start!important;justify-content:space-between!important;gap:70px 2%!important}
body.project-body-class.project-page .gallery-stack img,.project-page-main .gallery-stack img{flex:0 0 100%!important;width:100%!important;max-width:100%!important;height:auto!important;margin:0!important}
body.project-body-class.project-page .gallery-stack img.is-vertical-media,.project-page-main .gallery-stack img.is-vertical-media{flex-basis:49%!important;width:49%!important;max-width:49%!important}
body.project-body-class.project-page .video-grid-vertical,.project-page-main .video-grid-vertical{width:100%!important;max-width:1140px!important;margin:0 auto 68px!important;display:flex!important;flex-wrap:wrap!important;align-items:flex-start!important;justify-content:space-between!important;gap:70px 2%!important}
body.project-body-class.project-page .video-grid-vertical .video,.project-page-main .video-grid-vertical .video{flex:0 0 49%!important;width:49%!important;max-width:49%!important;margin:0!important;aspect-ratio:2/3!important;border-radius:9px!important;overflow:hidden!important;background:#000!important}
body.project-body-class.project-page .video-grid-vertical .video iframe,.project-page-main .video-grid-vertical .video iframe{width:100%!important;height:100%!important;border:0!important}
@media (max-width:760px){
body.project-body-class.project-page .gallery-stack,.project-page-main .gallery-stack,body.project-body-class.project-page .video-grid-vertical,.project-page-main .video-grid-vertical{gap:56px 0!important}
body.project-body-class.project-page .gallery-stack img.is-vertical-media,.project-page-main .gallery-stack img.is-vertical-media,body.project-body-class.project-page .video-grid-vertical .video,.project-page-main .video-grid-vertical .video{flex-basis:100%!important;width:100%!important;max-width:100%!important}
}
/* v59 mobile-only home hero tuning
   Keep desktop untouched. On mobile:
   - slightly smaller home buttons with a bit more space above
   - rounded chevron scroll cue with a slow continuous pulse */
@keyframes mobileScrollPulse{
  0%,100%{transform:scale(0.96);opacity:.86;}
  50%{transform:scale(1.08);opacity:1;}
}
@media (max-width:760px){
.home-page .hero-buttons.image-buttons{margin-top:18px!important;gap:28px!important}
.home-page .hero-buttons.image-buttons a{width:min(278px, 74vw)!important}
.home-page .scroll-arrow{position:relative!important;display:block!important;width:96px!important;height:64px!important;margin:88px auto 0!important;font-size:0!important;line-height:0!important;color:transparent!important;text-shadow:none!important;animation:mobileScrollPulse 2.35s ease-in-out infinite!important;transform-origin:center center!important}
.home-page .scroll-arrow::before,.home-page .scroll-arrow::after{content:''!important;position:absolute!important;bottom:16px!important;width:44px!important;height:8px!important;background:#fff!important;border-radius:999px!important;box-shadow:0 0 3px rgba(0,0,0,.12)!important}
.home-page .scroll-arrow::before{left:11px!important;transform:rotate(45deg)!important;transform-origin:right center!important}
.home-page .scroll-arrow::after{right:11px!important;transform:rotate(-45deg)!important;transform-origin:left center!important}
}
/* v60 mobile-only home hero refinement
   Desktop stays untouched.
   - use uploaded arrow gif, visually re-centered because source art sits slightly to the right
   - buttons noticeably smaller with more space above
   - arrow pinned to the lower area of the first screen
   - side email removed on mobile
   - first view fills the visible mobile viewport */
@media (max-width:760px){
.home-page .home-hero{min-height:100svh!important;height:100svh!important;align-items:stretch!important;padding:0 0 14px!important;overflow:hidden!important}
.home-page .hero-center{width:100%!important;min-height:100%!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:flex-start!important;box-sizing:border-box!important;padding-top:138px!important;padding-bottom:0!important;transform:none!important}
.home-page .hero-logo{width:92vw!important;margin-bottom:0!important}
.home-page .hero-buttons.image-buttons{margin-top:52px!important;gap:20px!important}
.home-page .hero-buttons.image-buttons a{width:min(232px, 62vw)!important}
.home-page .scroll-arrow{display:block!important;flex:0 0 auto!important;width:106px!important;height:72px!important;margin:auto auto 6px!important;font-size:0!important;line-height:0!important;color:transparent!important;text-shadow:none!important;background:url('/assets/img/mobile-scroll-arrow-v60.gif') 44% 50%/contain no-repeat!important;animation:none!important;transform:none!important}
.home-page .scroll-arrow::before,.home-page .scroll-arrow::after{content:none!important;display:none!important}
.home-page .side-email,.home-page .desktop-only.side-email{display:none!important}
}
@supports (height: 100dvh){
  @media (max-width:760px){
    .home-page .home-hero{
      min-height:100dvh!important;
      height:100dvh!important;
    }
  }
}
/* v61 mobile-only refinements
   Desktop remains untouched.
   - Bigger uploaded scroll arrow.
   - Mobile work cards use PC-like title/subtitle hierarchy, scaled to fit.
   - Home footer typography/icon spacing resized to match the mobile reference. */
@media (max-width:760px){
.home-page .scroll-arrow{width:124px!important;height:84px!important;margin:auto auto 4px!important;background-position:44% 50%!important;background-size:contain!important}
.home-page .project-overlay{left:24px!important;right:24px!important;bottom:24px!important;max-width:calc(100% - 48px)!important;opacity:1!important;gap:2px!important;color:#fff!important;text-shadow:0 1px 3px rgba(0,0,0,.28)!important}
.home-page .project-overlay b{display:block!important;max-width:100%!important;font-family:Nimbus, Arial, sans-serif!important;font-size:clamp(14px, 3.85vw, 16px)!important;font-weight:700!important;line-height:1.02!important;letter-spacing:-.045em!important;text-transform:uppercase!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:clip!important}
.home-page .project-overlay em{display:block!important;max-width:100%!important;font-family:Denver, Georgia, serif!important;font-size:clamp(13px, 3.65vw, 16px)!important;font-weight:700!important;font-style:normal!important;line-height:1.02!important;letter-spacing:-.7px!important;transform-origin:left center!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:clip!important}
body.home-page .footer,body.home-page .footer-video{padding:50px 18px 58px!important}
body.home-page .footer .footer-contact,body.home-page .footer-video .footer-contact{margin:0 0 30px!important;line-height:1.08!important}
body.home-page .footer .footer-contact > strong,body.home-page .footer-video .footer-contact > strong{font-size:30px!important;line-height:1!important;letter-spacing:-1px!important;transform-origin:center center!important}
body.home-page .footer .footer-contact > a,body.home-page .footer-video .footer-contact > a{display:block!important;font-size:20px!important;line-height:1.05!important;margin-top:9px!important}
body.home-page .footer .footer-social,body.home-page .footer-video .footer-social{gap:18px!important;margin-bottom:34px!important}
body.home-page .footer .footer-social a,body.home-page .footer-video .footer-social a{width:32px!important;height:32px!important}
body.home-page .footer .footer-social svg,body.home-page .footer-video .footer-social svg{width:28px!important;height:28px!important}
body.home-page .footer .copyright,body.home-page .footer-video .copyright{font-size:15px!important;line-height:1.35!important;margin:0!important}
}
/* v62 mobile-only work-card readability
   Add a subtle black bottom gradient so project titles/subtitles read better on thumbnails.
   Desktop remains untouched. */
@media (max-width:760px){
.home-page .project-card::after{opacity:1!important;background:linear-gradient(
      to bottom,
      rgba(0,0,0,0) 44%,
      rgba(0,0,0,.10) 58%,
      rgba(0,0,0,.32) 72%,
      rgba(0,0,0,.62) 88%,
      rgba(0,0,0,.82) 100%
    )!important}
}
/* v63 mobile-only project page redesign
   Desktop remains untouched.
   Goals:
   - smaller top menu with HOME on the left, ABOUT on the right, logo centered
   - first screen fills the viewport while showing subtitle, title, arrow and claim
   - body copy and awards sized like the mobile reference
   - video/gallery/flip card nearly full width with small usability margins
   - related carousel shows one project at a time on mobile
   - project footers reuse the same mobile footer sizing language as home */
@media (max-width:760px){
body.project-body-class.project-page .topnav,.project-page-main ~ .footer + .back-to-top ~ .topnav,.project-page .topnav{padding:18px 18px 0!important}
body.project-body-class.project-page .topnav-inner,.project-page-main .topnav-inner,.project-page .topnav-inner{height:48px!important;align-items:center!important}
body.project-body-class.project-page .topnav a,.project-page-main .topnav a,.project-page .topnav a{font-family:var(--font-copy)!important;font-size:18px!important;font-weight:700!important;letter-spacing:-.04em!important;line-height:1!important;text-shadow:none!important}
body.project-body-class.project-page .topnav .nav-logo,.project-page-main .topnav .nav-logo,.project-page .topnav .nav-logo{width:124px!important}
body.project-body-class.project-page .topnav .nav-left,body.project-body-class.project-page .topnav .nav-right,.project-page .topnav .nav-left,.project-page .topnav .nav-right{min-width:74px!important}
body.project-body-class.project-page .topnav-project .nav-left,.project-page .topnav-project .nav-left{visibility:visible!important;display:block!important}
body.project-body-class.project-page .topnav-project .nav-right,.project-page .topnav-project .nav-right{position:static!important;transform:none!important;display:block!important;min-width:74px!important;text-align:right!important}
body.project-body-class.project-page .topnav-project .nav-right a:first-child,.project-page .topnav-project .nav-right a:first-child{display:none!important}
body.project-body-class.project-page .project-hero,.project-page-main .project-hero{min-height:100svh!important;height:100svh!important;background-position:center center!important}
body.project-body-class.project-page .project-title-wrap,.project-page-main .project-title-wrap{width:100%!important;padding:0 26px!important;margin-top:168px!important}
body.project-body-class.project-page .project-title-wrap p,.project-page-main .project-title-wrap p{font-size:28px!important;line-height:.98!important;margin:0 0 8px!important}
body.project-body-class.project-page .project-title-wrap h1,.project-page-main .project-title-wrap h1{font-size:clamp(34px, 9.7vw, 52px)!important;line-height:.93!important;letter-spacing:-.03em!important;margin:0!important}
body.project-body-class.project-page .project-arrow,.project-page-main .project-arrow{bottom:140px!important;font-size:62px!important;line-height:1!important}
body.project-body-class.project-page .project-body,.project-page-main .project-body{padding-top:18px!important;position:relative!important}
body.project-body-class.project-page .claim,.project-page-main .claim{width:82vw!important;margin:-108px auto 34px!important;display:block!important;text-align:left!important;font-size:19px!important;line-height:1.08!important;position:relative!important;z-index:3!important}
body.project-body-class.project-page .claim span,.project-page-main .claim span{display:none!important}
body.project-body-class.project-page .claim em,.project-page-main .claim em{display:block!important;font-family:var(--font-denver)!important;font-style:italic!important;font-weight:400!important}
body.project-body-class.project-page .project-info,.project-page-main .project-info{width:82vw!important;display:block!important;margin:0 auto 40px!important}
body.project-body-class.project-page .project-desc p,body.project-body-class.project-page .awards p,.project-page-main .project-desc p,.project-page-main .awards p{font-size:17px!important;line-height:1.58!important;margin:0!important}
body.project-body-class.project-page .awards,.project-page-main .awards{margin-top:28px!important}
body.project-body-class.project-page .awards h3,.project-page-main .awards h3{font-size:26px!important;line-height:.95!important;margin:0 0 10px!important}
body.project-body-class.project-page .video,body.project-body-class.project-page .gallery,body.project-body-class.project-page .flip-card-block,body.project-body-class.project-page .video-grid-vertical,body.project-body-class.project-page .video-featured-vertical,.project-page-main .video,.project-page-main .gallery,.project-page-main .flip-card-block,.project-page-main .video-grid-vertical,.project-page-main .video-featured-vertical{width:90vw!important;max-width:90vw!important}
body.project-body-class.project-page .video,.project-page-main .video{margin:0 auto 40px!important;border-radius:6px!important}
body.project-body-class.project-page .gallery,.project-page-main .gallery{padding-bottom:34px!important}
body.project-body-class.project-page .gallery h2,body.project-body-class.project-page .related h2,.project-page-main .gallery h2,.project-page-main .related h2{text-align:left!important;font-size:52px!important;line-height:.92!important;margin:0 0 26px!important}
body.project-body-class.project-page .gallery-stack,.project-page-main .gallery-stack{gap:26px!important}
body.project-body-class.project-page .flip-card-block,.project-page-main .flip-card-block{margin:0 auto 52px!important}
body.project-body-class.project-page .flip-touch,.project-page-main .flip-touch{width:58px!important;margin:22px auto 0!important}
body.project-body-class.project-page .related,.project-page-main .related{width:90vw!important;padding:0 0 34px!important;margin:0 auto!important}
body.project-body-class.project-page .related-track,.project-page-main .related-track{gap:0!important;scroll-snap-type:x mandatory!important}
body.project-body-class.project-page .related-card,.project-page-main .related-card{min-width:100%!important;flex:0 0 100%!important;height:220px!important;scroll-snap-align:start!important;border-radius:18px!important}
body.project-body-class.project-page .related-copy,.project-page-main .related-copy{left:18px!important;bottom:16px!important}
body.project-body-class.project-page .related-copy b,.project-page-main .related-copy b{font-size:14px!important;line-height:1.02!important}
body.project-body-class.project-page .related-copy em,.project-page-main .related-copy em{font-size:14px!important;line-height:1.02!important}
body.project-body-class.project-page .related-arrow,.project-page-main .related-arrow{top:58%!important;width:46px!important;height:46px!important;font-size:54px!important;background:rgba(255,255,255,.66)!important}
body.project-body-class.project-page .related-arrow-left,.project-page-main .related-arrow-left{left:8px!important}
body.project-body-class.project-page .related-arrow-right,.project-page-main .related-arrow-right{right:8px!important}
body.project-body-class.project-page .footer,body.project-body-class.project-page .footer-black,body.project-body-class.project-page .footer-transparent,.project-page-main + .footer,.project-page-main + .footer-black,.project-page-main + .footer-transparent{padding:50px 18px 58px!important}
body.project-body-class.project-page .footer .footer-contact,body.project-body-class.project-page .footer-black .footer-contact,body.project-body-class.project-page .footer-transparent .footer-contact,.project-page-main + .footer .footer-contact,.project-page-main + .footer-black .footer-contact,.project-page-main + .footer-transparent .footer-contact{margin:0 0 30px!important;line-height:1.08!important}
body.project-body-class.project-page .footer .footer-contact > span,body.project-body-class.project-page .footer-black .footer-contact > span,body.project-body-class.project-page .footer-transparent .footer-contact > span,.project-page-main + .footer .footer-contact > span,.project-page-main + .footer-black .footer-contact > span,.project-page-main + .footer-transparent .footer-contact > span{display:block!important;font-size:30px!important;line-height:1!important;letter-spacing:-1px!important;transform-origin:center center!important}
body.project-body-class.project-page .footer .footer-contact > a,body.project-body-class.project-page .footer-black .footer-contact > a,body.project-body-class.project-page .footer-transparent .footer-contact > a,.project-page-main + .footer .footer-contact > a,.project-page-main + .footer-black .footer-contact > a,.project-page-main + .footer-transparent .footer-contact > a{display:block!important;font-size:20px!important;line-height:1.05!important;margin-top:9px!important}
body.project-body-class.project-page .footer .footer-social,body.project-body-class.project-page .footer-black .footer-social,body.project-body-class.project-page .footer-transparent .footer-social,.project-page-main + .footer .footer-social,.project-page-main + .footer-black .footer-social,.project-page-main + .footer-transparent .footer-social{gap:18px!important;margin-bottom:34px!important}
body.project-body-class.project-page .footer .footer-social a,body.project-body-class.project-page .footer-black .footer-social a,body.project-body-class.project-page .footer-transparent .footer-social a,.project-page-main + .footer .footer-social a,.project-page-main + .footer-black .footer-social a,.project-page-main + .footer-transparent .footer-social a{width:32px!important;height:32px!important}
body.project-body-class.project-page .footer .footer-social svg,body.project-body-class.project-page .footer-black .footer-social svg,body.project-body-class.project-page .footer-transparent .footer-social svg,.project-page-main + .footer .footer-social svg,.project-page-main + .footer-black .footer-social svg,.project-page-main + .footer-transparent .footer-social svg{width:28px!important;height:28px!important}
body.project-body-class.project-page .footer .copyright,body.project-body-class.project-page .footer-black .copyright,body.project-body-class.project-page .footer-transparent .copyright,.project-page-main + .footer .copyright,.project-page-main + .footer-black .copyright,.project-page-main + .footer-transparent .copyright{font-size:15px!important;line-height:1.35!important;margin:0!important}
}
@supports (height: 100dvh){
  @media (max-width:760px){
    body.project-body-class.project-page .project-hero,
    .project-page-main .project-hero{
      min-height:100dvh!important;
      height:100dvh!important;
    }
  }
}
/* v64 mobile-only project page corrections after review
   Desktop untouched. Tighten project pages to match the mobile references more closely. */
@media (max-width:760px){
/* Header: smaller, same menu type, visually centered between logo and edges */
body.project-body-class.project-page .topnav,.project-page .topnav{padding:18px 14px 0!important}
body.project-body-class.project-page .topnav-inner,.project-page .topnav-inner{display:grid!important;grid-template-columns:1fr auto 1fr!important;align-items:center!important;height:44px!important;position:relative!important}
body.project-body-class.project-page .topnav .nav-left,body.project-body-class.project-page .topnav .nav-right,.project-page .topnav .nav-left,.project-page .topnav .nav-right{min-width:0!important;display:flex!important;align-items:center!important;justify-content:center!important}
body.project-body-class.project-page .topnav .nav-right,.project-page .topnav .nav-right{justify-content:center!important}
body.project-body-class.project-page .topnav-project .nav-right a:first-child,.project-page .topnav-project .nav-right a:first-child{display:none!important}
body.project-body-class.project-page .topnav a,.project-page .topnav a{font-family:var(--font-copy)!important;font-size:16px!important;font-weight:700!important;letter-spacing:-.04em!important;line-height:1!important;text-shadow:none!important}
body.project-body-class.project-page .topnav .nav-logo,.project-page .topnav .nav-logo{position:static!important;transform:none!important;width:116px!important;justify-self:center!important}
/* Hero: centered image column with full-screen height */
body.project-body-class.project-page .project-hero,.project-page-main .project-hero{width:calc(100vw - 32px)!important;margin:0 auto!important;min-height:100svh!important;height:100svh!important;background-position:center center!important;border-radius:0!important}
body.project-body-class.project-page .project-title-wrap,.project-page-main .project-title-wrap{width:100%!important;padding:0 16px!important;margin-top:182px!important;text-align:center!important}
body.project-body-class.project-page .project-title-wrap p,.project-page-main .project-title-wrap p{font-family:var(--font-denver)!important;font-size:18px!important;line-height:1!important;margin:0 0 8px!important;text-align:center!important}
body.project-body-class.project-page .project-title-wrap h1,.project-page-main .project-title-wrap h1{font-family:var(--font-serif)!important;font-size:clamp(26px, 7.3vw, 34px)!important;line-height:.94!important;letter-spacing:-.02em!important;white-space:nowrap!important;margin:0 auto!important;text-align:center!important}
/* Same animated arrow asset as home */
body.project-body-class.project-page .project-arrow,.project-page-main .project-arrow{position:absolute!important;left:50%!important;bottom:134px!important;transform:translateX(-50%)!important;z-index:4!important;display:block!important;width:106px!important;height:72px!important;margin:0!important;font-size:0!important;line-height:0!important;color:transparent!important;text-shadow:none!important;background:url('/assets/img/mobile-scroll-arrow-v60.gif') 44% 50%/contain no-repeat!important}
body.project-body-class.project-page .project-arrow::before,body.project-body-class.project-page .project-arrow::after,.project-page-main .project-arrow::before,.project-page-main .project-arrow::after{content:none!important;display:none!important}
body.project-body-class.project-page .project-body,.project-page-main .project-body{padding-top:0!important}
/* Claim: smaller, readable, centered, not chopped */
body.project-body-class.project-page .claim,.project-page-main .claim{width:78vw!important;max-width:none!important;margin:-86px auto 56px!important;display:block!important;text-align:center!important;font-size:15px!important;line-height:1.14!important;letter-spacing:0!important;position:relative!important;z-index:3!important}
body.project-body-class.project-page .claim em,.project-page-main .claim em{display:block!important;font-family:var(--font-denver)!important;font-size:15px!important;line-height:1.14!important;font-style:italic!important;font-weight:400!important}
body.project-body-class.project-page .claim span,.project-page-main .claim span{display:none!important}
/* Content spacing */
body.project-body-class.project-page .project-info,.project-page-main .project-info{width:82vw!important;display:block!important;margin:0 auto 44px!important}
body.project-body-class.project-page .project-desc p,body.project-body-class.project-page .awards p,.project-page-main .project-desc p,.project-page-main .awards p{font-size:16px!important;line-height:1.62!important;margin:0!important}
body.project-body-class.project-page .project-desc,.project-page-main .project-desc{margin-bottom:44px!important}
body.project-body-class.project-page .awards,.project-page-main .awards{margin-top:8px!important}
body.project-body-class.project-page .awards h3,.project-page-main .awards h3{font-family:var(--font-serif)!important;font-size:23px!important;line-height:.95!important;margin:0 0 12px!important;color:var(--pink)!important;text-align:left!important}
/* Media widths */
body.project-body-class.project-page .video,body.project-body-class.project-page .gallery,body.project-body-class.project-page .flip-card-block,.project-page-main .video,.project-page-main .gallery,.project-page-main .flip-card-block{width:92vw!important;max-width:92vw!important}
body.project-body-class.project-page .video,.project-page-main .video{margin:0 auto 54px!important;border-radius:6px!important}
/* Gallery heading matches desktop type and is centered */
body.project-body-class.project-page .gallery,.project-page-main .gallery{padding:8px 0 36px!important}
body.project-body-class.project-page .gallery h2,.project-page-main .gallery h2{font-family:var(--font-serif)!important;font-size:clamp(38px, 12vw, 54px)!important;line-height:.92!important;text-align:center!important;margin:0 0 24px!important;color:var(--pink)!important}
body.project-body-class.project-page .gallery-stack,.project-page-main .gallery-stack{gap:28px!important}
body.project-body-class.project-page .flip-card-block,.project-page-main .flip-card-block{margin:0 auto 44px!important}
body.project-body-class.project-page .flip-touch,.project-page-main .flip-touch{width:44px!important;margin:18px auto 0!important}
/* Related: same type as desktop, centered and smaller */
body.project-body-class.project-page .related,.project-page-main .related{width:92vw!important;padding:0 0 34px!important;margin:0 auto!important}
body.project-body-class.project-page .related h2,.project-page-main .related h2{font-family:var(--font-serif)!important;font-size:clamp(32px, 10vw, 42px)!important;line-height:.94!important;text-align:center!important;margin:0 0 18px!important;color:var(--pink)!important}
body.project-body-class.project-page .related-track,.project-page-main .related-track{display:flex!important;gap:0!important;overflow:hidden!important;scroll-snap-type:x mandatory!important;width:100%!important}
body.project-body-class.project-page .related-card,.project-page-main .related-card{display:block!important;min-width:100%!important;flex:0 0 100%!important;width:100%!important;height:180px!important;scroll-snap-align:start!important;border-radius:14px!important;background-size:cover!important;background-position:center!important}
body.project-body-class.project-page .related-card::after,.project-page-main .related-card::after{content:''!important;position:absolute!important;inset:0!important;background:linear-gradient(to bottom, rgba(0,0,0,0) 44%, rgba(0,0,0,.18) 58%, rgba(0,0,0,.42) 72%, rgba(0,0,0,.72) 100%)!important}
body.project-body-class.project-page .related-copy,.project-page-main .related-copy{display:block!important;left:14px!important;bottom:12px!important;z-index:2!important}
body.project-body-class.project-page .related-copy b,.project-page-main .related-copy b{font-family:var(--font-copy)!important;font-size:12px!important;line-height:1.02!important;margin-bottom:1px!important}
body.project-body-class.project-page .related-copy em,.project-page-main .related-copy em{font-family:var(--font-denver)!important;font-size:11px!important;line-height:1.02!important;font-style:normal!important}
body.project-body-class.project-page .related-arrow,.project-page-main .related-arrow{display:grid!important;place-items:center!important;top:57%!important;width:38px!important;height:38px!important;font-size:44px!important;background:rgba(255,255,255,.62)!important}
body.project-body-class.project-page .related-arrow-left,.project-page-main .related-arrow-left{left:8px!important}
body.project-body-class.project-page .related-arrow-right,.project-page-main .related-arrow-right{right:8px!important}
/* Project footer = same mobile language as home */
body.project-body-class.project-page .footer,body.project-body-class.project-page .footer-black,body.project-body-class.project-page .footer-transparent,.project-page-main + .footer,.project-page-main + .footer-black,.project-page-main + .footer-transparent{padding:50px 18px 58px!important}
body.project-body-class.project-page .footer .footer-contact,body.project-body-class.project-page .footer-black .footer-contact,body.project-body-class.project-page .footer-transparent .footer-contact,.project-page-main + .footer .footer-contact,.project-page-main + .footer-black .footer-contact,.project-page-main + .footer-transparent .footer-contact{margin:0 0 30px!important;line-height:1.08!important;text-align:center!important}
body.project-body-class.project-page .footer .footer-contact > span,body.project-body-class.project-page .footer .footer-contact > strong,body.project-body-class.project-page .footer-black .footer-contact > span,body.project-body-class.project-page .footer-black .footer-contact > strong,body.project-body-class.project-page .footer-transparent .footer-contact > span,body.project-body-class.project-page .footer-transparent .footer-contact > strong,.project-page-main + .footer .footer-contact > span,.project-page-main + .footer .footer-contact > strong,.project-page-main + .footer-black .footer-contact > span,.project-page-main + .footer-black .footer-contact > strong,.project-page-main + .footer-transparent .footer-contact > span,.project-page-main + .footer-transparent .footer-contact > strong{display:block!important;font-size:30px!important;line-height:1!important;letter-spacing:-1px!important;transform-origin:center center!important}
body.project-body-class.project-page .footer .footer-contact > a,body.project-body-class.project-page .footer-black .footer-contact > a,body.project-body-class.project-page .footer-transparent .footer-contact > a,.project-page-main + .footer .footer-contact > a,.project-page-main + .footer-black .footer-contact > a,.project-page-main + .footer-transparent .footer-contact > a{display:block!important;font-size:20px!important;line-height:1.05!important;margin-top:9px!important}
body.project-body-class.project-page .footer .footer-social,body.project-body-class.project-page .footer-black .footer-social,body.project-body-class.project-page .footer-transparent .footer-social,.project-page-main + .footer .footer-social,.project-page-main + .footer-black .footer-social,.project-page-main + .footer-transparent .footer-social{gap:18px!important;margin-bottom:34px!important}
body.project-body-class.project-page .footer .footer-social a,body.project-body-class.project-page .footer-black .footer-social a,body.project-body-class.project-page .footer-transparent .footer-social a,.project-page-main + .footer .footer-social a,.project-page-main + .footer-black .footer-social a,.project-page-main + .footer-transparent .footer-social a{width:32px!important;height:32px!important}
body.project-body-class.project-page .footer .footer-social svg,body.project-body-class.project-page .footer-black .footer-social svg,body.project-body-class.project-page .footer-transparent .footer-social svg,.project-page-main + .footer .footer-social svg,.project-page-main + .footer-black .footer-social svg,.project-page-main + .footer-transparent .footer-social svg{width:28px!important;height:28px!important}
body.project-body-class.project-page .footer .copyright,body.project-body-class.project-page .footer-black .copyright,body.project-body-class.project-page .footer-transparent .copyright,.project-page-main + .footer .copyright,.project-page-main + .footer-black .copyright,.project-page-main + .footer-transparent .copyright{font-size:15px!important;line-height:1.35!important;margin:0!important;text-align:center!important}
}
@supports (height: 100dvh){
  @media (max-width:760px){
    body.project-body-class.project-page .project-hero,
    .project-page-main .project-hero{
      min-height:100dvh!important;
      height:100dvh!important;
    }
  }
}
/* v66 mobile-only project layout corrections
   Desktop remains untouched.
   - Project hero image full width.
   - HOME / ABOUT slightly larger and balanced around centered logo.
   - Hero title/subtitle moved up and centered on the image.
   - Claim stays at the bottom, with arrow between title and claim.
   - Project text uses the same lateral width as media.
   - Related title slightly closer, left aligned.
   - Related arrows aligned to the middle of the card.
   - Mobile carousel shows one card cleanly. */
@media (max-width:760px){
body.project-body-class.project-page .topnav a,.project-page .topnav a{font-size:18px!important}
body.project-body-class.project-page .project-hero,.project-page-main .project-hero{width:100vw!important;max-width:100vw!important;margin:0!important;left:50%!important;transform:translateX(-50%)!important;min-height:100svh!important;height:100svh!important}
body.project-body-class.project-page .project-title-wrap,.project-page-main .project-title-wrap{position:absolute!important;left:0!important;right:0!important;top:39%!important;width:100%!important;margin:0!important;padding:0 18px!important;transform:translateY(-50%)!important;text-align:center!important;z-index:3!important}
body.project-body-class.project-page .project-title-wrap p,.project-page-main .project-title-wrap p{margin:0 0 8px!important}
body.project-body-class.project-page .project-title-wrap h1,.project-page-main .project-title-wrap h1{white-space:nowrap!important;font-size:clamp(25px, 7vw, 33px)!important}
body.project-body-class.project-page .project-arrow,.project-page-main .project-arrow{bottom:156px!important}
body.project-body-class.project-page .claim,.project-page-main .claim{width:84vw!important;margin:-96px auto 72px!important;font-size:14px!important;line-height:1.16!important;text-align:center!important}
body.project-body-class.project-page .claim em,.project-page-main .claim em{font-size:14px!important;line-height:1.16!important}
body.project-body-class.project-page .project-info,.project-page-main .project-info{width:92vw!important;max-width:92vw!important;margin:0 auto 48px!important}
body.project-body-class.project-page .project-desc,.project-page-main .project-desc{margin-bottom:50px!important}
body.project-body-class.project-page .awards,.project-page-main .awards{margin-top:0!important}
body.project-body-class.project-page .video,body.project-body-class.project-page .gallery,body.project-body-class.project-page .flip-card-block,body.project-body-class.project-page .video-grid-vertical,.project-page-main .video,.project-page-main .gallery,.project-page-main .flip-card-block,.project-page-main .video-grid-vertical{width:92vw!important;max-width:92vw!important}
body.project-body-class.project-page .related,.project-page-main .related{width:92vw!important;max-width:92vw!important;padding-top:36px!important}
body.project-body-class.project-page .related h2,.project-page-main .related h2{text-align:left!important;margin:0 0 22px!important}
body.project-body-class.project-page .related-track,.project-page-main .related-track{overflow:hidden!important;width:100%!important;transform:none!important}
body.project-body-class.project-page .related-card,.project-page-main .related-card{flex:0 0 100%!important;min-width:100%!important;max-width:100%!important;width:100%!important}
body.project-body-class.project-page .related-arrow,.project-page-main .related-arrow{top:148px!important;transform:translateY(-50%)!important}
}
@supports (height: 100dvh){
  @media (max-width:760px){
    body.project-body-class.project-page .project-hero,
    .project-page-main .project-hero{
      min-height:100dvh!important;
      height:100dvh!important;
    }
  }
}
/* v67 mobile project interaction fixes
   Desktop untouched.
   - Arrow placed geometrically between hero title and bottom claim.
   - Remove blue tap highlight/flicker from flip card.
   - Related carousel arrows get JS-aligned to card center, with CSS fallback. */
@media (max-width:760px){
body.project-body-class.project-page .project-arrow,.project-page-main .project-arrow{top:63%!important;bottom:auto!important;left:50%!important;transform:translate(-50%, -50%)!important}
body.project-body-class.project-page .flip-card,body.project-body-class.project-page .flip-card *,body.project-body-class.project-page .flip-card-block,body.project-body-class.project-page .flip-card-block *,.project-page-main .flip-card,.project-page-main .flip-card *,.project-page-main .flip-card-block,.project-page-main .flip-card-block *{-webkit-tap-highlight-color:rgba(0,0,0,0)!important;tap-highlight-color:rgba(0,0,0,0)!important;-webkit-touch-callout:none!important;-webkit-user-select:none!important;user-select:none!important}
body.project-body-class.project-page .flip-card,.project-page-main .flip-card{outline:none!important;background:transparent!important;border:0!important;-webkit-appearance:none!important;appearance:none!important;touch-action:manipulation!important}
body.project-body-class.project-page .flip-card:focus,body.project-body-class.project-page .flip-card:focus-visible,body.project-body-class.project-page .flip-card:active,.project-page-main .flip-card:focus,.project-page-main .flip-card:focus-visible,.project-page-main .flip-card:active{outline:none!important;box-shadow:none!important;background:transparent!important}
body.project-body-class.project-page .flip-card img,.project-page-main .flip-card img{-webkit-user-drag:none!important;user-drag:none!important}
body.project-body-class.project-page .related-arrow,.project-page-main .related-arrow{top:184px!important;transform:translateY(-50%)!important;z-index:8!important;pointer-events:auto!important;touch-action:manipulation!important;-webkit-tap-highlight-color:rgba(0,0,0,0)!important}
body.project-body-class.project-page .related-arrow:focus,body.project-body-class.project-page .related-arrow:focus-visible,body.project-body-class.project-page .related-arrow:active,.project-page-main .related-arrow:focus,.project-page-main .related-arrow:focus-visible,.project-page-main .related-arrow:active{outline:none!important;box-shadow:none!important}
}
/* v68 mobile related carousel hard fix + spacing cleanup
   Desktop untouched.
   - Use classes with !important to override older nth-child mobile hiding rules.
   - Arrow turns pink only while actively pressed, then returns to white.
   - Related arrows are centered by JS on the visible card.
   - Normalize mobile lateral margins to avoid left/right imbalance. */
@media (max-width:760px){
body.project-body-class.project-page,body.project-body-class.project-page .project-page-main{overflow-x:hidden!important}
body.project-body-class.project-page .project-hero,.project-page-main .project-hero{width:100%!important;max-width:100%!important;left:auto!important;right:auto!important;margin-left:0!important;margin-right:0!important;transform:none!important}
body.project-body-class.project-page .project-info,body.project-body-class.project-page .video,body.project-body-class.project-page .gallery,body.project-body-class.project-page .flip-card-block,body.project-body-class.project-page .video-grid-vertical,body.project-body-class.project-page .related,.project-page-main .project-info,.project-page-main .video,.project-page-main .gallery,.project-page-main .flip-card-block,.project-page-main .video-grid-vertical,.project-page-main .related{width:calc(100vw - 32px)!important;max-width:calc(100vw - 32px)!important;margin-left:auto!important;margin-right:auto!important;box-sizing:border-box!important}
body.project-body-class.project-page .related{position:relative!important;overflow:visible!important}
body.project-body-class.project-page .related-track,.project-page-main .related-track{display:block!important;width:100%!important;max-width:100%!important;overflow:hidden!important;transform:none!important;transition:none!important;scroll-behavior:auto!important}
body.project-body-class.project-page .related-card,.project-page-main .related-card{width:100%!important;max-width:100%!important;min-width:100%!important;height:180px!important;flex:none!important;border-radius:14px!important;background-size:cover!important;background-position:center!important}
body.project-body-class.project-page .related-card.is-mobile-related-hidden,.project-page-main .related-card.is-mobile-related-hidden{display:none!important;visibility:hidden!important;opacity:0!important}
body.project-body-class.project-page .related-card.is-mobile-related-visible,.project-page-main .related-card.is-mobile-related-visible{display:block!important;visibility:visible!important;opacity:1!important}
body.project-body-class.project-page .related-arrow,.project-page-main .related-arrow{position:absolute!important;z-index:50!important;pointer-events:auto!important;touch-action:manipulation!important;transform:translateY(-50%)!important;-webkit-tap-highlight-color:rgba(0,0,0,0)!important;outline:none!important;box-shadow:none!important}
body.project-body-class.project-page .related-arrow::before,.project-page-main .related-arrow::before{background:rgba(255,255,255,.90)!important;transition:none!important}
body.project-body-class.project-page .related-arrow:hover::before,body.project-body-class.project-page .related-arrow:focus-visible::before,.project-page-main .related-arrow:hover::before,.project-page-main .related-arrow:focus-visible::before{background:rgba(255,255,255,.90)!important}
body.project-body-class.project-page .related-arrow:active::before,.project-page-main .related-arrow:active::before,body.project-body-class.project-page .related-arrow.is-pressed::before,.project-page-main .related-arrow.is-pressed::before{background:var(--pink)!important}
}
/* v69 mobile related carousel animation + margin correction
   Desktop untouched.
   - Animated one-card carousel instead of instant swap.
   - Arrows stay white on tap/release; no pink/focus residue.
   - Equal lateral gutters using explicit margins, not auto/viewport mix. */
@media (max-width:760px){
body.project-body-class.project-page{--mobile-project-gutter:20px;overflow-x:hidden!important}
body.project-body-class.project-page .project-info,body.project-body-class.project-page .video,body.project-body-class.project-page .gallery,body.project-body-class.project-page .flip-card-block,body.project-body-class.project-page .video-grid-vertical,body.project-body-class.project-page .related,.project-page-main .project-info,.project-page-main .video,.project-page-main .gallery,.project-page-main .flip-card-block,.project-page-main .video-grid-vertical,.project-page-main .related{width:auto!important;max-width:none!important;margin-left:var(--mobile-project-gutter)!important;margin-right:var(--mobile-project-gutter)!important;box-sizing:border-box!important;left:auto!important;right:auto!important;transform:none!important}
body.project-body-class.project-page .related,.project-page-main .related{position:relative!important;overflow:visible!important}
body.project-body-class.project-page .related-track,.project-page-main .related-track{position:relative!important;display:block!important;width:100%!important;max-width:100%!important;height:180px!important;overflow:hidden!important;transform:none!important;transition:none!important;scroll-behavior:auto!important}
body.project-body-class.project-page .related-card,.project-page-main .related-card{position:absolute!important;inset:0!important;display:block!important;width:100%!important;max-width:100%!important;min-width:100%!important;height:180px!important;flex:none!important;border-radius:14px!important;background-size:cover!important;background-position:center!important;opacity:0!important;visibility:hidden!important;pointer-events:none!important;transform:translate3d(0,0,0)!important;transition:transform .38s cubic-bezier(.22,.61,.36,1), opacity .38s cubic-bezier(.22,.61,.36,1)!important;will-change:transform, opacity!important}
body.project-body-class.project-page .related-card.is-mobile-related-visible,.project-page-main .related-card.is-mobile-related-visible{opacity:1!important;visibility:visible!important;pointer-events:auto!important;transform:translate3d(0,0,0)!important;z-index:2!important}
body.project-body-class.project-page .related-card.is-mobile-related-hidden,.project-page-main .related-card.is-mobile-related-hidden{opacity:0!important;visibility:hidden!important;pointer-events:none!important;z-index:0!important}
body.project-body-class.project-page .related-arrow,.project-page-main .related-arrow{z-index:60!important;pointer-events:auto!important;touch-action:manipulation!important;-webkit-tap-highlight-color:rgba(0,0,0,0)!important;outline:none!important;box-shadow:none!important}
body.project-body-class.project-page .related-arrow::before,.project-page-main .related-arrow::before,body.project-body-class.project-page .related-arrow:hover::before,body.project-body-class.project-page .related-arrow:focus::before,body.project-body-class.project-page .related-arrow:focus-visible::before,body.project-body-class.project-page .related-arrow:active::before,body.project-body-class.project-page .related-arrow.is-pressed::before,.project-page-main .related-arrow:hover::before,.project-page-main .related-arrow:focus::before,.project-page-main .related-arrow:focus-visible::before,.project-page-main .related-arrow:active::before,.project-page-main .related-arrow.is-pressed::before{background:rgba(255,255,255,.90)!important;transition:none!important}
}
/* v70 mobile carousel animation + smaller gutters
   Desktop untouched.
   - Reduce mobile gutters to a minimal usability margin.
   - Use JS-driven !important inline transforms for a true slide animation.
   - Keep carousel arrows in their normal translucent-white state after tap/focus. */
@media (max-width:760px){
body.project-body-class.project-page{--mobile-project-gutter:10px;overflow-x:hidden!important}
body.project-body-class.project-page .project-info,body.project-body-class.project-page .video,body.project-body-class.project-page .gallery,body.project-body-class.project-page .flip-card-block,body.project-body-class.project-page .video-grid-vertical,body.project-body-class.project-page .related,.project-page-main .project-info,.project-page-main .video,.project-page-main .gallery,.project-page-main .flip-card-block,.project-page-main .video-grid-vertical,.project-page-main .related{width:auto!important;max-width:none!important;margin-left:var(--mobile-project-gutter)!important;margin-right:var(--mobile-project-gutter)!important;box-sizing:border-box!important;left:auto!important;right:auto!important;transform:none!important}
body.project-body-class.project-page .related,.project-page-main .related{position:relative!important;overflow:visible!important}
body.project-body-class.project-page .related-track,.project-page-main .related-track{position:relative!important;display:block!important;width:100%!important;max-width:100%!important;height:180px!important;overflow:hidden!important;transform:none!important;transition:none!important;scroll-behavior:auto!important}
body.project-body-class.project-page .related-card,.project-page-main .related-card{position:absolute!important;inset:0!important;width:100%!important;max-width:100%!important;min-width:100%!important;height:180px!important;flex:none!important;border-radius:14px!important;background-size:cover!important;background-position:center!important;will-change:transform, opacity!important}
body.project-body-class.project-page .related-arrow,.project-page-main .related-arrow{z-index:60!important;pointer-events:auto!important;touch-action:manipulation!important;-webkit-tap-highlight-color:rgba(0,0,0,0)!important;outline:none!important;box-shadow:none!important}
body.project-body-class.project-page .related-arrow::before,.project-page-main .related-arrow::before,body.project-body-class.project-page .related-arrow:hover::before,body.project-body-class.project-page .related-arrow:focus::before,body.project-body-class.project-page .related-arrow:focus-visible::before,body.project-body-class.project-page .related-arrow:active::before,body.project-body-class.project-page .related-arrow.is-pressed::before,.project-page-main .related-arrow:hover::before,.project-page-main .related-arrow:focus::before,.project-page-main .related-arrow:focus-visible::before,.project-page-main .related-arrow:active::before,.project-page-main .related-arrow.is-pressed::before{background:rgba(255,255,255,.62)!important;transition:none!important}
}
/* v71 mobile project carousel final tuning
   Desktop untouched.
   - Lateral project gutters set back to exactly 20px.
   - Mobile related slides animate with a 20px visual gap between cards.
   - Related arrows have zero visual active/focus/hover/tap state: they only trigger carousel. */
@media (max-width:760px){
body.project-body-class.project-page{--mobile-project-gutter:20px;--mobile-related-gap:20px}
body.project-body-class.project-page .project-info,body.project-body-class.project-page .video,body.project-body-class.project-page .gallery,body.project-body-class.project-page .flip-card-block,body.project-body-class.project-page .video-grid-vertical,body.project-body-class.project-page .related,.project-page-main .project-info,.project-page-main .video,.project-page-main .gallery,.project-page-main .flip-card-block,.project-page-main .video-grid-vertical,.project-page-main .related{width:auto!important;max-width:none!important;margin-left:20px!important;margin-right:20px!important;box-sizing:border-box!important}
body.project-body-class.project-page .related-track,.project-page-main .related-track{position:relative!important;height:180px!important;overflow:hidden!important}
body.project-body-class.project-page .related-card,.project-page-main .related-card{position:absolute!important;top:0!important;bottom:0!important;left:0!important;right:0!important;width:100%!important;max-width:100%!important;min-width:100%!important;height:180px!important}
body.project-body-class.project-page .related-arrow,.project-page-main .related-arrow{background:transparent!important;color:transparent!important;border:0!important;box-shadow:none!important;outline:none!important;-webkit-tap-highlight-color:rgba(0,0,0,0)!important;tap-highlight-color:rgba(0,0,0,0)!important;transition:none!important}
body.project-body-class.project-page .related-arrow::before,body.project-body-class.project-page .related-arrow:hover::before,body.project-body-class.project-page .related-arrow:focus::before,body.project-body-class.project-page .related-arrow:focus-visible::before,body.project-body-class.project-page .related-arrow:active::before,body.project-body-class.project-page .related-arrow.is-pressed::before,.project-page-main .related-arrow::before,.project-page-main .related-arrow:hover::before,.project-page-main .related-arrow:focus::before,.project-page-main .related-arrow:focus-visible::before,.project-page-main .related-arrow:active::before,.project-page-main .related-arrow.is-pressed::before{background:rgba(255,255,255,.62)!important;opacity:1!important;transform:none!important;transition:none!important}
body.project-body-class.project-page .related-arrow::after,body.project-body-class.project-page .related-arrow:hover::after,body.project-body-class.project-page .related-arrow:focus::after,body.project-body-class.project-page .related-arrow:focus-visible::after,body.project-body-class.project-page .related-arrow:active::after,body.project-body-class.project-page .related-arrow.is-pressed::after,.project-page-main .related-arrow::after,.project-page-main .related-arrow:hover::after,.project-page-main .related-arrow:focus::after,.project-page-main .related-arrow:focus-visible::after,.project-page-main .related-arrow:active::after,.project-page-main .related-arrow.is-pressed::after{content:none!important;display:none!important;opacity:0!important;background:transparent!important}
}
/* v72 mobile project spacing + tap-state fixes
   Desktop untouched.
   - Project page content uses 20px real viewport gutters, not 90vw container + 20px.
   - Related carousel arrows keep the same visual state after tap/focus.
   - Mobile back-to-top reacts faster and does not remain pink after tap. */
@media (max-width:760px){
body.project-body-class.project-page .project-body,.project-page-main > .project-body{width:100%!important;max-width:none!important;margin-left:0!important;margin-right:0!important;padding-left:0!important;padding-right:0!important;box-sizing:border-box!important}
body.project-body-class.project-page .claim,.project-page-main .claim,body.project-body-class.project-page .project-info,.project-page-main .project-info,body.project-body-class.project-page .video,.project-page-main .video,body.project-body-class.project-page .gallery,.project-page-main .gallery,body.project-body-class.project-page .video-grid-vertical,.project-page-main .video-grid-vertical,body.project-body-class.project-page .related,.project-page-main .related{width:auto!important;max-width:none!important;margin-left:20px!important;margin-right:20px!important;box-sizing:border-box!important;left:auto!important;right:auto!important;transform:none!important}
body.project-body-class.project-page .claim,.project-page-main .claim{margin-top:-28px!important;margin-bottom:48px!important}
body.project-body-class.project-page .related-arrow,body.project-body-class.project-page .related-arrow:hover,body.project-body-class.project-page .related-arrow:focus,body.project-body-class.project-page .related-arrow:focus-visible,body.project-body-class.project-page .related-arrow:active,body.project-body-class.project-page .related-arrow.is-pressed,.project-page-main .related-arrow,.project-page-main .related-arrow:hover,.project-page-main .related-arrow:focus,.project-page-main .related-arrow:focus-visible,.project-page-main .related-arrow:active,.project-page-main .related-arrow.is-pressed{appearance:none!important;-webkit-appearance:none!important;background:transparent!important;color:transparent!important;outline:0!important;box-shadow:none!important;border:0!important;transform:translateY(-50%)!important;transition:none!important;-webkit-tap-highlight-color:rgba(0,0,0,0)!important}
body.project-body-class.project-page .related-arrow::before,body.project-body-class.project-page .related-arrow:hover::before,body.project-body-class.project-page .related-arrow:focus::before,body.project-body-class.project-page .related-arrow:focus-visible::before,body.project-body-class.project-page .related-arrow:active::before,body.project-body-class.project-page .related-arrow.is-pressed::before,.project-page-main .related-arrow::before,.project-page-main .related-arrow:hover::before,.project-page-main .related-arrow:focus::before,.project-page-main .related-arrow:focus-visible::before,.project-page-main .related-arrow:active::before,.project-page-main .related-arrow.is-pressed::before{content:''!important;display:block!important;inset:0!important;width:100%!important;height:100%!important;border:0!important;opacity:1!important;background:rgba(255,255,255,.62)!important;transition:none!important}
body.project-body-class.project-page .related-arrow-left::before,.project-page-main .related-arrow-left::before{-webkit-mask:url('/assets/img/carousel-arrow-left-cutout.svg') center/contain no-repeat!important;mask:url('/assets/img/carousel-arrow-left-cutout.svg') center/contain no-repeat!important}
body.project-body-class.project-page .related-arrow-right::before,.project-page-main .related-arrow-right::before{-webkit-mask:url('/assets/img/carousel-arrow-right-cutout.svg') center/contain no-repeat!important;mask:url('/assets/img/carousel-arrow-right-cutout.svg') center/contain no-repeat!important}
.back-to-top.is-visible,.back-to-top.is-visible:hover,.back-to-top.is-visible:focus,.back-to-top.is-visible:focus-visible,.back-to-top.is-visible:active{opacity:1!important;visibility:visible!important;pointer-events:auto!important;background:rgba(255,255,255,.92)!important;transform:translateY(0)!important;outline:0!important;box-shadow:none!important;transition:opacity .12s ease, visibility .12s ease, transform .12s ease!important;-webkit-tap-highlight-color:rgba(0,0,0,0)!important}
.back-to-top.is-visible::before,.back-to-top.is-visible:hover::before,.back-to-top.is-visible:focus::before,.back-to-top.is-visible:focus-visible::before,.back-to-top.is-visible:active::before{border-color:#d7d7d7!important;transition:none!important}
}
/* v73 mobile carousel loop + back-to-top tap fix
   Desktop untouched. */
@media (max-width:760px){
body.project-body-class.project-page .related,.project-page-main .related{overflow:hidden!important}
body.project-body-class.project-page .related-track,.project-page-main .related-track{display:flex!important;gap:20px!important;width:100%!important;max-width:100%!important;height:180px!important;overflow:visible!important;position:relative!important;transform:translate3d(0,0,0);will-change:transform!important;scroll-behavior:auto!important}
body.project-body-class.project-page .related-card,body.project-body-class.project-page .related-card.is-mobile-related-visible,body.project-body-class.project-page .related-card.is-mobile-related-hidden,.project-page-main .related-card,.project-page-main .related-card.is-mobile-related-visible,.project-page-main .related-card.is-mobile-related-hidden{position:relative!important;inset:auto!important;display:block!important;visibility:visible!important;opacity:1!important;pointer-events:auto!important;flex:0 0 100%!important;width:100%!important;min-width:100%!important;max-width:100%!important;height:180px!important;transform:translate3d(0,0,0)}
body.project-body-class.project-page .related-arrow,body.project-body-class.project-page .related-arrow:hover,body.project-body-class.project-page .related-arrow:focus,body.project-body-class.project-page .related-arrow:focus-visible,body.project-body-class.project-page .related-arrow:active,body.project-body-class.project-page .related-arrow.is-pressed,.project-page-main .related-arrow,.project-page-main .related-arrow:hover,.project-page-main .related-arrow:focus,.project-page-main .related-arrow:focus-visible,.project-page-main .related-arrow:active,.project-page-main .related-arrow.is-pressed{background:transparent!important;color:transparent!important;outline:0!important;box-shadow:none!important;border:0!important;transition:none!important;-webkit-tap-highlight-color:rgba(0,0,0,0)!important;user-select:none!important}
body.project-body-class.project-page .related-arrow::before,body.project-body-class.project-page .related-arrow:hover::before,body.project-body-class.project-page .related-arrow:focus::before,body.project-body-class.project-page .related-arrow:focus-visible::before,body.project-body-class.project-page .related-arrow:active::before,body.project-body-class.project-page .related-arrow.is-pressed::before,.project-page-main .related-arrow::before,.project-page-main .related-arrow:hover::before,.project-page-main .related-arrow:focus::before,.project-page-main .related-arrow:focus-visible::before,.project-page-main .related-arrow:active::before,.project-page-main .related-arrow.is-pressed::before{background:rgba(255,255,255,.62)!important;border:0!important;opacity:1!important;transform:none!important;transition:none!important}
.back-to-top,.back-to-top:hover,.back-to-top:focus,.back-to-top:focus-visible,.back-to-top:active,.back-to-top.is-visible,.back-to-top.is-visible:hover,.back-to-top.is-visible:focus,.back-to-top.is-visible:focus-visible,.back-to-top.is-visible:active{background:rgba(255,255,255,.92)!important;outline:0!important;box-shadow:none!important;transform:translateY(0)!important;-webkit-tap-highlight-color:rgba(0,0,0,0)!important}
.back-to-top:not(.is-visible){opacity:0!important;visibility:hidden!important;pointer-events:none!important;transform:translateY(8px)!important}
.back-to-top.is-visible{opacity:1!important;visibility:visible!important;pointer-events:auto!important}
.back-to-top::before,.back-to-top:hover::before,.back-to-top:focus::before,.back-to-top:focus-visible::before,.back-to-top:active::before,.back-to-top.is-visible::before,.back-to-top.is-visible:hover::before,.back-to-top.is-visible:focus::before,.back-to-top.is-visible:focus-visible::before,.back-to-top.is-visible:active::before{border-color:#d7d7d7!important;transition:none!important}
}
/* v74 mobile carousel loop + vertical arrow tap-state hard reset
   Desktop untouched. */
@media (max-width:760px){
body.project-body-class.project-page .related,.project-page-main .related{overflow:hidden!important}
body.project-body-class.project-page .related-track,.project-page-main .related-track{display:flex!important;gap:20px!important;width:100%!important;max-width:100%!important;height:180px!important;overflow:visible!important;position:relative!important;will-change:transform!important;scroll-behavior:auto!important}
body.project-body-class.project-page .related-card,body.project-body-class.project-page .related-card.is-mobile-related-visible,body.project-body-class.project-page .related-card.is-mobile-related-hidden,body.project-body-class.project-page .related-card[data-mobile-carousel-clone="true"],.project-page-main .related-card,.project-page-main .related-card.is-mobile-related-visible,.project-page-main .related-card.is-mobile-related-hidden,.project-page-main .related-card[data-mobile-carousel-clone="true"]{position:relative!important;inset:auto!important;display:block!important;visibility:visible!important;opacity:1!important;flex:0 0 100%!important;width:100%!important;min-width:100%!important;max-width:100%!important;height:180px!important;transform:translate3d(0,0,0)}
body.project-body-class.project-page .related-card[data-mobile-carousel-clone="true"],.project-page-main .related-card[data-mobile-carousel-clone="true"]{pointer-events:none!important}
html body .back-to-top,html body .back-to-top:hover,html body .back-to-top:focus,html body .back-to-top:focus-visible,html body .back-to-top:active,html body .back-to-top.is-visible,html body .back-to-top.is-visible:hover,html body .back-to-top.is-visible:focus,html body .back-to-top.is-visible:focus-visible,html body .back-to-top.is-visible:active{background:rgba(255,255,255,.92)!important;outline:0!important;box-shadow:none!important;transform:translateY(0)!important;-webkit-tap-highlight-color:rgba(0,0,0,0)!important}
html body .back-to-top:not(.is-visible){opacity:0!important;visibility:hidden!important;pointer-events:none!important;transform:translateY(8px)!important}
html body .back-to-top.is-visible{opacity:1!important;visibility:visible!important;pointer-events:auto!important}
html body .back-to-top::before,html body .back-to-top:hover::before,html body .back-to-top:focus::before,html body .back-to-top:focus-visible::before,html body .back-to-top:active::before,html body .back-to-top.is-visible::before,html body .back-to-top.is-visible:hover::before,html body .back-to-top.is-visible:focus::before,html body .back-to-top.is-visible:focus-visible::before,html body .back-to-top.is-visible:active::before{border-color:#d7d7d7!important;transition:none!important}
@media (hover:none) and (pointer:coarse){
html body .back-to-top,html body .back-to-top:hover,html body .back-to-top:focus,html body .back-to-top:focus-visible,html body .back-to-top:active,html body .back-to-top.is-visible,html body .back-to-top.is-visible:hover,html body .back-to-top.is-visible:focus,html body .back-to-top.is-visible:focus-visible,html body .back-to-top.is-visible:active{background:rgba(255,255,255,.92)!important}
}
}
/* v75 mobile project hero stability + claim position
   Desktop untouched.
   - Lock mobile project hero to a stable initial viewport height to avoid dvh/browser-bar recalculation while scrolling.
   - Move the italic claim slightly higher on the first screen. */
@media (max-width:760px){
body.project-body-class.project-page{--ilu-mobile-project-hero-height:100svh}
body.project-body-class.project-page .project-hero,.project-page-main .project-hero{min-height:var(--ilu-mobile-project-hero-height, 100svh)!important;height:var(--ilu-mobile-project-hero-height, 100svh)!important;max-height:none!important;background-attachment:scroll!important;background-position:center center!important;transform:translateZ(0)!important;backface-visibility:hidden!important}
body.project-body-class.project-page .claim,.project-page-main .claim{margin-top:-46px!important;margin-bottom:48px!important}
}
@supports (height:100dvh){
  @media (max-width:760px){
    body.project-body-class.project-page .project-hero,
    .project-page-main .project-hero{
      min-height:var(--ilu-mobile-project-hero-height, 100svh)!important;
      height:var(--ilu-mobile-project-hero-height, 100svh)!important;
    }
  }
}
/* v76 mobile about page redesign
   Desktop remains untouched.
   - Mobile About uses the same top menu language as Work/project pages: HOME left, logo centered, WORK right.
   - Removes the old floating HOME image button on mobile only.
   - First screen gets stable sky background, 20px gutters, adjusted image spacing, smaller correct intro copy and GIF arrow.
   - About section headings are kept to one line, including Professional Awards.
   - About footer reuses Home mobile proportions. */
.about-mobile-topnav{display:none!important}
.about-scroll-arrow{display:none!important}
@media (max-width:760px){
html:has(body.about-page),body.about-page{background:#19a3f5 var(--sky) center top/cover repeat-y!important;overflow-x:hidden!important}
body.about-page .about-main{background:#19a3f5 var(--sky) center top/cover repeat-y!important;background-attachment:scroll!important;color:#fff!important;min-height:100vh!important;overflow:hidden!important}
body.about-page .about-mobile-topnav{display:block!important;position:fixed!important;top:0!important;left:0!important;right:0!important;z-index:80!important;padding:18px 14px 0!important;background:transparent!important;pointer-events:none!important}
body.about-page .about-mobile-topnav .topnav-inner{display:grid!important;grid-template-columns:1fr auto 1fr!important;align-items:center!important;height:44px!important;position:relative!important;pointer-events:auto!important;column-gap:0!important}
body.about-page .about-mobile-topnav a{display:inline-block!important;font-family:var(--font-copy)!important;font-size:16px!important;font-weight:700!important;letter-spacing:-.04em!important;line-height:1!important;color:#fff!important;text-transform:uppercase!important;text-shadow:none!important;-webkit-tap-highlight-color:rgba(0,0,0,0)!important}
body.about-page .about-mobile-topnav .nav-left,body.about-page .about-mobile-topnav .nav-right{min-width:0!important;width:auto!important;display:flex!important;align-items:center!important;justify-content:center!important;align-self:center!important}
body.about-page .about-mobile-topnav .nav-right{text-align:initial!important;display:flex!important;justify-content:center!important}
body.about-page .about-mobile-topnav .nav-logo{position:static!important;left:auto!important;top:auto!important;transform:none!important;width:116px!important;line-height:0!important;display:block!important;justify-self:center!important;align-self:center!important}
body.about-page .about-mobile-topnav .nav-logo img{width:100%!important;height:auto!important;display:block!important}
body.about-page .about-media .about-home-link,body.about-page .about-home-link{display:none!important;visibility:hidden!important;pointer-events:none!important}
body.about-page .about-hero{min-height:100svh!important;height:100svh!important;padding:16px 20px 18px!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:flex-start!important;box-sizing:border-box!important;overflow:hidden!important;text-align:center!important}
body.about-page .about-media{width:100%!important;max-width:100%!important;margin:0 auto 18px!important;padding:0!important;position:relative!important;flex:0 0 auto!important}
body.about-page .about-media .about-image,body.about-page .about-image{width:100%!important;max-width:100%!important;height:auto!important;margin:0 auto!important;display:block!important}
body.about-page .about-intro{width:100%!important;max-width:100%!important;margin:0 auto 12px!important;color:#202020!important;font-family:var(--font-denver)!important;font-size:clamp(13px, 3.55vw, 15px)!important;font-weight:400!important;font-style:normal!important;line-height:1.34!important;letter-spacing:-.45px!important;text-align:center!important;transform-origin:center center!important;display:block!important}
body.about-page .about-scroll-arrow{display:block!important;flex:0 0 auto!important;width:92px!important;height:62px!important;margin:auto auto 0!important;font-size:0!important;line-height:0!important;color:transparent!important;text-shadow:none!important;background:url('/assets/img/mobile-scroll-arrow-v60.gif') 44% 50%/contain no-repeat!important;-webkit-tap-highlight-color:rgba(0,0,0,0)!important}
body.about-page .about-content{width:auto!important;max-width:none!important;margin-left:20px!important;margin-right:20px!important;padding:44px 0 18px!important;box-sizing:border-box!important}
body.about-page .about-section{margin-bottom:56px!important}
body.about-page .about-section h2{font-family:var(--font-serif)!important;font-size:clamp(28px, 8.6vw, 33px)!important;line-height:.95!important;margin:0 0 22px!important;color:var(--pink)!important;font-weight:400!important;white-space:nowrap!important;letter-spacing:-.02em!important;text-align:left!important}
body.about-page .about-role,body.about-page .about-list,body.about-page .about-year{font-size:16px!important;line-height:1.34!important;margin:0 0 20px!important;color:#fff!important;text-align:left!important}
body.about-page .cv-link{margin:58px 0 58px!important;text-align:center!important}
body.about-page .cv-link a{font-family:var(--font-denver)!important;font-size:32px!important;line-height:1!important;letter-spacing:-1px!important;transform-origin:center center!important;display:inline-block!important}
body.about-page .footer,body.about-page .footer-sky,body.about-page .footer-transparent{padding:50px 18px 58px!important;background:transparent!important}
body.about-page .footer .footer-contact{margin:0 0 30px!important;line-height:1.08!important;text-align:center!important}
body.about-page .footer .footer-contact > span,body.about-page .footer .footer-contact > strong{display:block!important;font-family:Denver, Georgia, serif!important;font-size:30px!important;font-weight:700!important;font-style:normal!important;line-height:1!important;letter-spacing:-1px!important;color:var(--pink)!important;transform-origin:center center!important}
body.about-page .footer .footer-contact > a{display:block!important;font-family:Bargim, Georgia, serif!important;font-size:20px!important;line-height:1.05!important;margin-top:9px!important;color:#fff!important}
body.about-page .footer .footer-social{gap:18px!important;margin-bottom:34px!important}
body.about-page .footer .footer-social a{width:32px!important;height:32px!important}
body.about-page .footer .footer-social svg{width:28px!important;height:28px!important}
body.about-page .footer .copyright{font-size:15px!important;line-height:1.35!important;margin:0!important;text-align:center!important}
}
@supports (height:100dvh){
  @media (max-width:760px){
    body.about-page .about-hero{
      min-height:100svh!important;
      height:100svh!important;
    }
  }
}
/* v89 mobile About correction pass
   Fixes the v76 mobile About drift without touching desktop:
   - hero image centred, not clipped, with real top air for the mobile nav
   - intro copy returned to the correct About typography at a readable mobile size
   - section headings forced smaller with equal/higher specificity than older About rules
   - award years no longer create extra vertical space before their list items */
@media (max-width:760px){
body.about-page .about-main{background:#19a3f5 var(--sky) center top/cover repeat-y!important;background-attachment:scroll!important;overflow:visible!important}
body.about-page .about-hero{min-height:100svh!important;height:auto!important;padding:106px 20px 96px!important;overflow:visible!important;box-sizing:border-box!important;position:relative!important}
body.about-page .about-media{width:calc(100vw - 40px)!important;max-width:430px!important;margin:0 auto 16px!important;padding:0!important;overflow:visible!important;line-height:0!important;flex:0 0 auto!important}
body.about-page .about-media .about-image,body.about-page .about-image{display:block!important;width:100%!important;max-width:100%!important;height:auto!important;margin:0 auto!important;position:relative!important;left:auto!important;right:auto!important;transform:none!important;object-fit:contain!important;object-position:center top!important}
body.about-page .about-intro{width:calc(100vw - 40px)!important;max-width:430px!important;margin:30px auto 50px!important;font-family:var(--font-denver)!important;font-size:clamp(17px,4.75vw,20px)!important;font-weight:400!important;font-style:normal!important;line-height:1.18!important;letter-spacing:-.55px!important;color:#202020!important;text-align:center!important;transform-origin:center center!important}
body.about-page .about-scroll-arrow{position:absolute!important;left:50%!important;bottom:18px!important;transform:translateX(-50%)!important;margin:0!important;width:118px!important;height:78px!important;flex:0 0 auto!important;z-index:2!important}
body.about-page .about-content{width:auto!important;max-width:none!important;margin-left:20px!important;margin-right:20px!important;padding:42px 0 18px!important;box-sizing:border-box!important}
body.about-page .about-content .about-section h2,body.about-page .about-section h2{font-family:var(--font-denver)!important;font-size:clamp(25px,7vw,29px)!important;font-weight:700!important;font-style:normal!important;line-height:1.02!important;letter-spacing:-1.1px!important;transform-origin:left center!important;margin:0 0 18px!important;color:var(--pink)!important;white-space:nowrap!important;display:block!important;text-align:left!important}
body.about-page .about-role,body.about-page .about-list,body.about-page .about-year{font-size:16px!important;line-height:1.30!important;text-align:left!important}
body.about-page .about-year{margin:0!important}
body.about-page .about-year + .about-list{margin-top:0!important}
body.about-page .about-list + .about-year{margin-top:20px!important}
}
/* v89 mobile About nav + home tap-state fixes
   - About mobile top menu now matches the final project/work mobile nav size.
   - Home hero image buttons do not stay pink after tap/focus on touch devices. */
@media (max-width:760px){
body.about-page .about-mobile-topnav{padding:18px 18px 0!important}
body.about-page .about-mobile-topnav .topnav-inner{display:grid!important;grid-template-columns:1fr auto 1fr!important;align-items:center!important;height:48px!important;column-gap:0!important}
body.about-page .about-mobile-topnav a{display:inline-block!important;font-family:var(--font-copy)!important;font-size:18px!important;font-weight:700!important;letter-spacing:-.04em!important;line-height:1!important;text-shadow:none!important}
body.about-page .about-mobile-topnav .nav-left,body.about-page .about-mobile-topnav .nav-right{min-width:74px!important;width:auto!important;display:flex!important;align-items:center!important;justify-content:center!important}
body.about-page .about-mobile-topnav .nav-right{text-align:initial!important}
body.about-page .about-mobile-topnav .nav-logo{position:static!important;transform:none!important;width:124px!important;justify-self:center!important;align-self:center!important}
.home-page .hero-buttons.image-buttons a,.home-page .hero-buttons.image-buttons a:focus,.home-page .hero-buttons.image-buttons a:active,.home-page .hero-buttons.image-buttons a:visited{outline:none!important;background:transparent!important;box-shadow:none!important;color:inherit!important;-webkit-tap-highlight-color:rgba(0,0,0,0)!important}
.home-page .hero-buttons.image-buttons a:focus::after,.home-page .hero-buttons.image-buttons a:active::after{opacity:0!important}
.home-page .hero-buttons.image-buttons a:focus img,.home-page .hero-buttons.image-buttons a:active img{filter:none!important}
}
@media (max-width:760px) and (hover:none), (max-width:760px) and (pointer:coarse){
.home-page .hero-buttons.image-buttons a:hover::after,.home-page .hero-buttons.image-buttons a:focus-visible::after,.home-page .hero-buttons.image-buttons a:active::after,.home-page .hero-buttons.image-buttons a.is-tap-reset::after{opacity:0!important}
.home-page .hero-buttons.image-buttons a:hover img,.home-page .hero-buttons.image-buttons a:focus-visible img,.home-page .hero-buttons.image-buttons a:active img,.home-page .hero-buttons.image-buttons a.is-tap-reset img{filter:none!important}
}
/* v89 desktop About WORK button
   Desktop only: add WORK at the right side of the ABOUT ILU artwork,
   matching the existing HOME button size, vertical alignment and hover behavior. */
@media (min-width:761px){
.about-page .about-media .about-work-link{left:87.05%!important;top:calc(84.8% - 38px)!important;width:clamp(112px, 12vw, 134px)!important;min-width:112px!important;max-width:134px!important;transform:translate(-50%, -50%)!important;display:block!important;position:absolute!important;z-index:10!important;padding:0!important;margin:0!important;border:0!important;background:transparent!important;box-shadow:none!important;line-height:0!important;font-size:0!important;color:transparent!important;overflow:visible!important;pointer-events:auto!important;cursor:pointer!important}
.about-page .about-media .about-work-link img{display:block!important;width:100%!important;height:auto!important;max-width:none!important;filter:none!important;transform:none!important;transition:none!important;opacity:1!important;visibility:visible!important}
.about-page .about-media .about-work-link:hover img,.about-page .about-media .about-work-link:focus-visible img{filter:brightness(0) saturate(100%) invert(10%) sepia(100%) saturate(7482%) hue-rotate(336deg) brightness(97%) contrast(112%)!important}
}
@media (min-width:1701px){
.about-page .about-media .about-work-link{left:87.05%!important;top:calc(84.8% - 38px)!important;width:134px!important;min-width:134px!important;max-width:134px!important}
}
@media (min-width:761px) and (max-width:1180px){
.about-page .about-media .about-work-link{left:87.05%!important;top:calc(84.8% - 38px)!important;width:clamp(100px, 11vw, 124px)!important;min-width:100px!important;max-width:124px!important}
}
@media (max-width:760px){
.about-page .about-media .about-work-link,body.about-page .about-work-link{display:none!important;visibility:hidden!important;pointer-events:none!important}
}
/* v89 About-only WORK button image
   Use Jaime's supplied PNG only for the desktop About WORK button. */
@media (min-width:761px){
.about-page .about-media .about-work-link{width:clamp(112px, 12vw, 134px)!important;min-width:112px!important;max-width:134px!important}
.about-page .about-media .about-work-link img{content:url('/assets/img/about-work-button.png')!important;width:100%!important;height:auto!important;filter:none!important}
.about-page .about-media .about-work-link:hover img,.about-page .about-media .about-work-link:focus-visible img{filter:brightness(0) saturate(100%) invert(10%) sepia(100%) saturate(7482%) hue-rotate(336deg) brightness(97%) contrast(112%)!important}
}
@media (max-width:760px){
.about-page .about-media .about-work-link img{content:url('/assets/img/about-work-button.png')!important}
}
/* v99 global Denver typography system
   Edit this block to control every Denver usage in the project.
   Official behavior: Denver Regular + browser faux-bold, no vertical stretch, no artificial tracking. */
/* All display uses of Denver: footer CTA, About titles, project subtitles/titles, Awards, Gallery, Related and card subtitles. */
body.home-page .footer .footer-contact > strong,body.home-page .footer-video .footer-contact > strong,body.about-page .footer .footer-contact > span,body.about-page .footer .footer-contact > strong,body.project-body-class.project-page .footer .footer-contact > span,body.project-body-class.project-page .footer .footer-contact > strong,body.project-body-class.project-page .footer-black .footer-contact > span,body.project-body-class.project-page .footer-black .footer-contact > strong,body.project-body-class.project-page .footer-transparent .footer-contact > span,body.project-body-class.project-page .footer-transparent .footer-contact > strong,.project-page-main + .footer .footer-contact > span,.project-page-main + .footer .footer-contact > strong,.project-page-main + .footer-black .footer-contact > span,.project-page-main + .footer-black .footer-contact > strong,.project-page-main + .footer-transparent .footer-contact > span,.project-page-main + .footer-transparent .footer-contact > strong,body.about-page .about-section h2,body.about-page .about-content .about-section h2,body.project-body-class.project-page .project-title-wrap p,.project-page-main .project-title-wrap p,body.project-body-class.project-page .awards h3,.project-page-main .awards h3,body.project-body-class.project-page .gallery h2,.project-page-main .gallery h2,body.project-body-class.project-page .related h2,.project-page-main .related h2,body.home-page .project-overlay em,body.project-body-class.project-page .related-copy em,.project-page-main .related-copy em,body.about-page .cv-link a{font-family:var(--ilu-denver-family)!important;font-weight:var(--ilu-denver-display-weight)!important;font-style:var(--ilu-denver-display-style)!important;letter-spacing:var(--ilu-denver-display-letter-spacing)!important;transform:var(--ilu-denver-display-transform)!important;font-synthesis:var(--ilu-denver-display-font-synthesis)!important}
/* Denver regular / italic texts. */
body.about-page .about-intro,body.project-body-class.project-page .claim,.project-page-main .claim,body.project-body-class.project-page .claim em,.project-page-main .claim em{font-family:var(--ilu-denver-family)!important;font-weight:var(--ilu-denver-regular-weight)!important;letter-spacing:var(--ilu-denver-regular-letter-spacing)!important;transform:var(--ilu-denver-regular-transform)!important;font-synthesis:var(--ilu-denver-regular-font-synthesis)!important}
body.project-body-class.project-page .claim,.project-page-main .claim,body.project-body-class.project-page .claim em,.project-page-main .claim em{font-style:italic!important}
/* Clean contextual sizes/layout for Denver display elements. No optical transform here. */
body.home-page .footer .footer-contact > strong,body.home-page .footer-video .footer-contact > strong,body.about-page .footer .footer-contact > span,body.about-page .footer .footer-contact > strong,body.project-body-class.project-page .footer .footer-contact > span,body.project-body-class.project-page .footer .footer-contact > strong,body.project-body-class.project-page .footer-black .footer-contact > span,body.project-body-class.project-page .footer-black .footer-contact > strong,body.project-body-class.project-page .footer-transparent .footer-contact > span,body.project-body-class.project-page .footer-transparent .footer-contact > strong,.project-page-main + .footer .footer-contact > span,.project-page-main + .footer .footer-contact > strong,.project-page-main + .footer-black .footer-contact > span,.project-page-main + .footer-black .footer-contact > strong,.project-page-main + .footer-transparent .footer-contact > span,.project-page-main + .footer-transparent .footer-contact > strong{font-size:50px!important;line-height:1.7!important;color:var(--pink)!important}
body.project-body-class.project-page .awards h3,.project-page-main .awards h3{font-size:50px!important;line-height:1.12!important;margin:0 0 20px!important;color:var(--pink)!important}
body.project-body-class.project-page .gallery h2,.project-page-main .gallery h2{color:var(--pink)!important;font-size:64px!important;line-height:1.02!important;margin:0 0 54px!important;text-align:center!important}
body.project-body-class.project-page .related h2,.project-page-main .related h2{font-family:var(--font-serif)!important;font-size:56px!important;line-height:1.02!important;margin:0 0 42px!important;color:var(--pink)!important;text-align:left!important}
@media (max-width:760px){
body.home-page .footer .footer-contact > strong,body.home-page .footer-video .footer-contact > strong,body.about-page .footer .footer-contact > span,body.about-page .footer .footer-contact > strong,body.project-body-class.project-page .footer .footer-contact > span,body.project-body-class.project-page .footer .footer-contact > strong,body.project-body-class.project-page .footer-black .footer-contact > span,body.project-body-class.project-page .footer-black .footer-contact > strong,body.project-body-class.project-page .footer-transparent .footer-contact > span,body.project-body-class.project-page .footer-transparent .footer-contact > strong,.project-page-main + .footer .footer-contact > span,.project-page-main + .footer .footer-contact > strong,.project-page-main + .footer-black .footer-contact > span,.project-page-main + .footer-black .footer-contact > strong,.project-page-main + .footer-transparent .footer-contact > span,.project-page-main + .footer-transparent .footer-contact > strong{font-size:30px!important;line-height:1!important}
body.project-body-class.project-page .project-title-wrap p,.project-page-main .project-title-wrap p{font-size:20px!important;line-height:1.02!important;margin:0 0 8px!important;text-align:center!important;display:block!important}
body.project-body-class.project-page .awards h3,.project-page-main .awards h3{font-size:26px!important;line-height:1.08!important;margin:0 0 14px!important;text-align:left!important}
body.project-body-class.project-page .gallery h2,.project-page-main .gallery h2{font-size:48px!important;line-height:1.02!important;margin:0 auto 32px!important;text-align:center!important;display:block!important}
body.project-body-class.project-page .related h2,.project-page-main .related h2{font-size:34px!important;line-height:1.03!important;margin:0 0 22px!important;text-align:left!important;display:block!important}
}
/* v99 requested mobile/project tuning
   - Awards title: 32px, margin-bottom 5px.
   - Desktop project info gap between description paragraph and awards block: 165px.
   - Desktop footer: CTA 60px, email 40px.
   - Mobile footer: compact previous size, CTA 30px, email 20px.
   - Mobile Home: logo position preserved, buttons larger and between logo and bottom arrow.
   - Mobile claim/italic phrase increased.
   - Mobile About intro increased, arrow remains absolute.
   - Related carousel text increased on desktop/mobile.
   - Related arrows centered against the real card/track via --related-arrow-top. */
:root{--pink:#F5004B;--white:#fff;--black:#070707;--font-serif:Bargim,Georgia,serif;--font-copy:Nimbus,Arial,sans-serif;--font-denver:Denver, Georgia, serif;--black-texture:url('/assets/img/site-background-texture-v58.jpg');--sky:url('/assets/uploads/2023/09/nubes-cielo-scaled.jpg');--nav-font-size:27px;--footer-contact-size:clamp(48px,3.5vw,70px);--footer-email-size:clamp(46px,3.35vw,66px);--button-hover-pink:#F5004B;--ilu-denver-family:var(--font-denver);--ilu-denver-display-weight:700;--ilu-denver-display-style:normal;--ilu-denver-display-letter-spacing:normal;--ilu-denver-display-transform:none;--ilu-denver-display-font-synthesis:weight;--ilu-denver-regular-weight:400;--ilu-denver-regular-letter-spacing:normal;--ilu-denver-regular-transform:none;--ilu-denver-regular-font-synthesis:weight;--ilu-footer-cta-size:60px;--ilu-footer-email-size:40px;--ilu-mobile-footer-cta-size:30px;--ilu-mobile-footer-email-size:20px;--ilu-awards-title-size:32px;--ilu-awards-title-margin-bottom:5px;--ilu-project-info-gap:165px;--ilu-related-title-size:26px;--ilu-related-client-size:24px;--ilu-mobile-related-title-size:22px;--ilu-mobile-related-client-size:20px;--ilu-project-subtitle-size:clamp(56px,4.5vw,74px);--ilu-mobile-project-subtitle-size:40px;--ilu-mobile-project-claim-size:36px;--ilu-about-intro-size:clamp(34px,2.55vw,48px);--ilu-mobile-about-intro-size:clamp(24px,6.35vw,28px)}
/* Desktop project info: bigger gap between description and awards block. */
@media (min-width:761px){
body.project-body-class.project-page .project-info,.project-page-main .project-info{column-gap:var(--ilu-project-info-gap)!important;gap:90px var(--ilu-project-info-gap)!important}
}
/* All footers: Get in Touch! */
.footer-contact > span,.footer-contact > strong,.footer .footer-contact > span,.footer .footer-contact > strong,.footer-sky .footer-contact > span,.footer-sky .footer-contact > strong,.footer-black .footer-contact > span,.footer-black .footer-contact > strong,.footer-transparent .footer-contact > span,.footer-transparent .footer-contact > strong,body.home-page .footer-contact > strong,body.home-page .footer .footer-contact > strong,body.home-page .footer-video .footer-contact > strong,body.about-page .footer-contact > span,body.about-page .footer-contact > strong,body.about-page .footer .footer-contact > span,body.about-page .footer .footer-contact > strong,body.project-page .footer-contact > span,body.project-page .footer-contact > strong,body.project-body-class .footer-contact > span,body.project-body-class .footer-contact > strong,body.project-body-class.project-page .footer .footer-contact > span,body.project-body-class.project-page .footer .footer-contact > strong,body.project-body-class.project-page .footer-black .footer-contact > span,body.project-body-class.project-page .footer-black .footer-contact > strong,body.project-body-class.project-page .footer-transparent .footer-contact > span,body.project-body-class.project-page .footer-transparent .footer-contact > strong,.project-page-main + .footer .footer-contact > span,.project-page-main + .footer .footer-contact > strong,.project-page-main + .footer-black .footer-contact > span,.project-page-main + .footer-black .footer-contact > strong,.project-page-main + .footer-transparent .footer-contact > span,.project-page-main + .footer-transparent .footer-contact > strong{font-family:Denver, Georgia, serif!important;font-size:var(--ilu-footer-cta-size)!important;font-weight:700!important;font-style:normal!important;font-synthesis:weight!important;line-height:1.12!important;letter-spacing:normal!important;transform:none!important;color:var(--pink)!important}
/* All footers: email */
.footer-contact > a,.footer .footer-contact > a,.footer-sky .footer-contact > a,.footer-black .footer-contact > a,.footer-transparent .footer-contact > a,body.home-page .footer-contact > a,body.home-page .footer .footer-contact > a,body.home-page .footer-video .footer-contact > a,body.about-page .footer-contact > a,body.about-page .footer .footer-contact > a,body.project-page .footer-contact > a,body.project-body-class .footer-contact > a,body.project-body-class.project-page .footer .footer-contact > a,body.project-body-class.project-page .footer-black .footer-contact > a,body.project-body-class.project-page .footer-transparent .footer-contact > a,.project-page-main + .footer .footer-contact > a,.project-page-main + .footer-black .footer-contact > a,.project-page-main + .footer-transparent .footer-contact > a{font-family:Bargim, Georgia, serif!important;font-size:var(--ilu-footer-email-size)!important;font-weight:400!important;font-style:normal!important;line-height:1!important;color:#fff!important}
/* Awards and recognitions: dedicated div, explicit Denver. */
.awards-title-denver,.awards .awards-title-denver,section.awards .awards-title-denver,main .awards .awards-title-denver,.project-page-main .awards .awards-title-denver,body.project-page .awards .awards-title-denver,body.project-body-class .awards .awards-title-denver,body.project-body-class.project-page .awards .awards-title-denver{display:block!important;font-family:Denver, Georgia, serif!important;font-size:var(--ilu-awards-title-size)!important;font-weight:700!important;font-style:normal!important;font-synthesis:weight!important;line-height:1.12!important;letter-spacing:normal!important;transform:none!important;color:var(--pink)!important;margin:0 0 var(--ilu-awards-title-margin-bottom)!important;padding:0!important;text-align:left!important;text-transform:none!important}
/* Project hero subtitle. */
/* About top paragraph desktop. */
body.about-page .about-intro{font-style:normal!important;font-size:var(--ilu-about-intro-size)!important;line-height:1.13!important;transform:none!important}
body.about-page .about-scroll-arrow{position:absolute!important;left:50%!important;bottom:18px!important;transform:translateX(-50%)!important;margin:0!important}
/* Related carousel text. */
/* Related arrows: center against real card/track geometry, independent from text size. */
@media (min-width:761px){
body.project-body-class.project-page .related,.project-page-main .related{position:relative!important;width:calc(100vw - 180px)!important;max-width:none!important;margin:0!important;padding:0 0 35px!important;overflow:hidden!important;left:50%!important;transform:translateX(-50%)!important}
}
body.project-body-class.project-page .related-arrow,.project-page-main .related-arrow{position:absolute!important;top:var(--related-arrow-top, 50%)!important;transform:translateY(-50%)!important;z-index:40!important;width:38px!important;height:38px!important;border:0!important;border-radius:999px!important;background:transparent!important;color:transparent!important;font-size:0!important;line-height:0!important;padding:0!important;display:grid!important;cursor:pointer!important;box-shadow:none!important;pointer-events:auto!important;opacity:1!important;user-select:none!important;overflow:visible!important;place-items:center!important}
@media (min-width:761px){
body.project-body-class.project-page .related-arrow,.project-page-main .related-arrow{width:52px!important;height:52px!important;font-size:58px!important;line-height:1!important}
}
@media (max-width:760px){
/* Mobile Home: logo stays near current place, buttons are larger between logo and bottom arrow. */
body.home-page .home-hero{min-height:100svh!important;height:100svh!important;padding:0!important;align-items:center!important;justify-content:center!important}
body.home-page .hero-center{height:100svh!important;width:100%!important;position:relative!important;display:block!important;padding:0 20px!important;transform:none!important}
body.home-page .hero-logo{position:absolute!important;left:50%!important;top:47%!important;width:88vw!important;max-width:430px!important;margin:0!important;transform:translate(-50%,-50%)!important}
body.home-page .hero-buttons,body.home-page .hero-buttons.image-buttons{position:absolute!important;left:50%!important;top:calc(47% + 122px)!important;transform:translateX(-50%)!important;display:flex!important;flex-direction:row!important;justify-content:center!important;align-items:center!important;gap:14px!important;width:calc(100vw - 30px)!important;margin:0!important}
body.home-page .hero-buttons a,body.home-page .hero-buttons.image-buttons a{width:min(168px, 43vw)!important;max-width:43vw!important;flex:0 0 auto!important;display:block!important}
body.home-page .scroll-arrow{position:absolute!important;left:50%!important;bottom:24px!important;display:inline-block!important;margin:0!important;font-size:82px!important;line-height:1!important;transform:translateX(-50%)!important}
/* Mobile footer remains compact. */
.footer-contact > span,.footer-contact > strong,.footer .footer-contact > span,.footer .footer-contact > strong,.footer-sky .footer-contact > span,.footer-sky .footer-contact > strong,.footer-black .footer-contact > span,.footer-black .footer-contact > strong,.footer-transparent .footer-contact > span,.footer-transparent .footer-contact > strong,body.home-page .footer-contact > strong,body.home-page .footer .footer-contact > strong,body.home-page .footer-video .footer-contact > strong,body.about-page .footer-contact > span,body.about-page .footer-contact > strong,body.about-page .footer .footer-contact > span,body.about-page .footer .footer-contact > strong,body.project-page .footer-contact > span,body.project-page .footer-contact > strong,body.project-body-class .footer-contact > span,body.project-body-class .footer-contact > strong,body.project-body-class.project-page .footer .footer-contact > span,body.project-body-class.project-page .footer .footer-contact > strong,body.project-body-class.project-page .footer-black .footer-contact > span,body.project-body-class.project-page .footer-black .footer-contact > strong,body.project-body-class.project-page .footer-transparent .footer-contact > span,body.project-body-class.project-page .footer-transparent .footer-contact > strong,.project-page-main + .footer .footer-contact > span,.project-page-main + .footer .footer-contact > strong,.project-page-main + .footer-black .footer-contact > span,.project-page-main + .footer-black .footer-contact > strong,.project-page-main + .footer-transparent .footer-contact > span,.project-page-main + .footer-transparent .footer-contact > strong{font-size:var(--ilu-mobile-footer-cta-size)!important;line-height:1!important}
.footer-contact > a,.footer .footer-contact > a,.footer-sky .footer-contact > a,.footer-black .footer-contact > a,.footer-transparent .footer-contact > a,body.home-page .footer-contact > a,body.home-page .footer .footer-contact > a,body.home-page .footer-video .footer-contact > a,body.about-page .footer-contact > a,body.about-page .footer .footer-contact > a,body.project-page .footer-contact > a,body.project-body-class .footer-contact > a,body.project-body-class.project-page .footer .footer-contact > a,body.project-body-class.project-page .footer-black .footer-contact > a,body.project-body-class.project-page .footer-transparent .footer-contact > a,.project-page-main + .footer .footer-contact > a,.project-page-main + .footer-black .footer-contact > a,.project-page-main + .footer-transparent .footer-contact > a{font-size:var(--ilu-mobile-footer-email-size)!important;line-height:1.05!important}
/* Mobile project top subtitle. */
body.project-body-class.project-page .project-title-wrap p,.project-page-main .project-title-wrap p{font-size:var(--ilu-mobile-project-subtitle-size)!important;line-height:1.04!important;margin:0 0 9px!important}
/* Mobile project italic claim at top of body. */
body.project-body-class.project-page .claim,.project-page-main .claim,body.project-body-class.project-page .claim em,.project-page-main .claim em{font-family:Denver, Georgia, serif!important;font-size:var(--ilu-mobile-project-claim-size)!important;font-weight:400!important;font-style:italic!important;line-height:1.12!important;transform:none!important}
/* Mobile About intro bigger, arrow fixed. */
body.about-page .about-intro{font-size:var(--ilu-mobile-about-intro-size)!important;line-height:1.15!important;margin:30px auto 50px!important;transform:none!important}
body.about-page .about-scroll-arrow{position:absolute!important;left:50%!important;bottom:18px!important;transform:translateX(-50%)!important;margin:0!important}
/* Mobile related carousel text. */
body.project-body-class.project-page .related-copy,.project-page-main .related-copy{left:16px!important;bottom:14px!important;max-width:calc(100% - 38px)!important}
body.project-body-class.project-page .related-copy b,.project-page-main .related-copy b{font-size:var(--ilu-mobile-related-title-size)!important;line-height:1.02!important;margin-bottom:2px!important}
body.project-body-class.project-page .related-copy em,.project-page-main .related-copy em{font-size:var(--ilu-mobile-related-client-size)!important;line-height:1.02!important}
}
/* v99 mobile About + project claim correction
   - Project italic claim was too large in v99: reduce substantially.
   - About intro down a couple of points.
   - About image higher, less gap between image and text.
   - About scroll arrow raised so it remains visible at the bottom. */
@media (max-width:760px){
:root{--ilu-mobile-project-claim-size:30px;--ilu-mobile-about-intro-size:clamp(22px,5.8vw,26px)}
body.project-body-class.project-page .claim,.project-page-main .claim,body.project-body-class.project-page .claim em,.project-page-main .claim em{font-size:var(--ilu-mobile-project-claim-size)!important;line-height:1.12!important}
body.about-page .about-hero{min-height:100svh!important;height:100svh!important;padding:82px 20px 76px!important;box-sizing:border-box!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:flex-start!important;overflow:hidden!important}
body.about-page .about-media{width:calc(100vw - 40px)!important;max-width:430px!important;margin:0 auto 2px!important;padding:0!important;line-height:0!important}
body.about-page .about-media .about-image,body.about-page .about-image{width:100%!important;max-width:100%!important;height:auto!important;margin:0 auto!important;object-fit:contain!important;object-position:center top!important}
body.about-page .about-intro{width:calc(100vw - 40px)!important;max-width:430px!important;margin:4px auto 28px!important;font-size:var(--ilu-mobile-about-intro-size)!important;line-height:1.15!important;transform:none!important}
body.about-page .about-scroll-arrow{position:absolute!important;left:50%!important;bottom:58px!important;transform:translateX(-50%)!important;margin:0!important;display:block!important;width:118px!important;height:62px!important;z-index:5!important}
}
/* v101 mobile tuning from v99 base
   - Home mobile logo top set to 37%.
   - Work/project mobile hero title and arrow repositioned.
   - Card/carousel title clipping fixed with safer line-height/padding.
   - Related card tap area normalized so text never eats the link.
   - Mobile footer CTA raised to 36px. */
/* Text in project cards/carousels: avoid vertical clipping from tight line-height + webfont metrics. */
.home-page .project-overlay,body.project-body-class.project-page .related-copy,.project-page-main .related-copy{overflow:visible!important}
.home-page .project-overlay b,.home-page .project-overlay em,body.project-body-class.project-page .related-copy b,body.project-body-class.project-page .related-copy em,.project-page-main .related-copy b,.project-page-main .related-copy em{line-height:1.18!important;padding-top:.06em!important;padding-bottom:.08em!important;box-sizing:content-box!important;overflow:visible!important}
/* Let the anchor card receive the tap even when the user taps on the visible title/client text. */
body.project-body-class.project-page .related-card,.project-page-main .related-card,.home-page .project-card{cursor:pointer!important;pointer-events:auto!important}
body.project-body-class.project-page .related-card::after,.project-page-main .related-card::after,.home-page .project-card::after,body.project-body-class.project-page .related-copy,body.project-body-class.project-page .related-copy *,.project-page-main .related-copy,.project-page-main .related-copy *,.home-page .project-overlay,.home-page .project-overlay *{pointer-events:none!important}
@media (min-width:761px){
body.project-body-class.project-page .related-copy b,.project-page-main .related-copy b{line-height:1.16!important;padding-top:.05em!important;padding-bottom:.08em!important}
body.project-body-class.project-page .related-copy em,.project-page-main .related-copy em{line-height:1.16!important;padding-top:.04em!important;padding-bottom:.08em!important}
}
@media (max-width:760px){
:root{--ilu-mobile-footer-cta-size:36px}
/* 1. Home logo requested position. */
body.home-page .hero-logo{top:37%!important}
/* 2. Mobile home work-card title clipping fix. */
body.home-page .project-overlay b,body.home-page .project-overlay em{line-height:1.20!important;padding-top:.06em!important;padding-bottom:.08em!important}
/* 3–5. Mobile project hero positions and brand size. */
body.project-body-class.project-page .project-title-wrap,.project-page-main .project-title-wrap{top:47%!important;margin-top:0!important;transform:translateY(-50%)!important}
body.project-body-class.project-page .project-arrow,.project-page-main .project-arrow{top:85%!important;bottom:auto!important;left:50%!important;transform:translate(-50%, -50%)!important}
body.project-body-class.project-page .project-title-wrap p,.project-page-main .project-title-wrap p{font-size:30px!important;line-height:1.08!important;margin:0 0 8px!important}
/* 8. Mobile Get in Touch size. */
.footer-contact > span,.footer-contact > strong,.footer .footer-contact > span,.footer .footer-contact > strong,.footer-sky .footer-contact > span,.footer-sky .footer-contact > strong,.footer-black .footer-contact > span,.footer-black .footer-contact > strong,.footer-transparent .footer-contact > span,.footer-transparent .footer-contact > strong,body.home-page .footer-contact > strong,body.home-page .footer .footer-contact > strong,body.home-page .footer-video .footer-contact > strong,body.about-page .footer-contact > span,body.about-page .footer-contact > strong,body.about-page .footer .footer-contact > span,body.about-page .footer .footer-contact > strong,body.project-page .footer-contact > span,body.project-page .footer-contact > strong,body.project-body-class .footer-contact > span,body.project-body-class .footer-contact > strong,body.project-body-class.project-page .footer .footer-contact > span,body.project-body-class.project-page .footer .footer-contact > strong,body.project-body-class.project-page .footer-black .footer-contact > span,body.project-body-class.project-page .footer-black .footer-contact > strong,body.project-body-class.project-page .footer-transparent .footer-contact > span,body.project-body-class.project-page .footer-transparent .footer-contact > strong,.project-page-main + .footer .footer-contact > span,.project-page-main + .footer .footer-contact > strong,.project-page-main + .footer-black .footer-contact > span,.project-page-main + .footer-black .footer-contact > strong,.project-page-main + .footer-transparent .footer-contact > span,.project-page-main + .footer-transparent .footer-contact > strong{font-size:36px!important;line-height:1!important}
/* 7. Mobile related text tap area and clipping fix. */
body.project-body-class.project-page .related-copy b,body.project-body-class.project-page .related-copy em,.project-page-main .related-copy b,.project-page-main .related-copy em{line-height:1.20!important;padding-top:.06em!important;padding-bottom:.08em!important;overflow:visible!important}
}
/* v102 card typography + project hero order from v101
   - Carousel second line top spacing removed.
   - Work card/carousel typography matches project hero: title = Bargim, brand = Denver.
   - Project pages now render title above brand; mobile brand lowered to 28px. */
/* Home work cards: title/name = Bargim, brand/client = Denver. */
body.home-page .project-overlay{gap:0!important;overflow:visible!important}
body.home-page .project-overlay b{display:block!important;font-family:var(--font-serif)!important;font-weight:400!important;font-style:normal!important;font-synthesis:none!important;letter-spacing:normal!important;text-transform:uppercase!important;line-height:1.08!important;margin:0!important;padding:.04em 0 .06em!important;overflow:visible!important}
body.home-page .project-overlay em{display:block!important;font-family:var(--font-denver)!important;font-weight:700!important;font-style:normal!important;font-synthesis:weight!important;letter-spacing:normal!important;text-transform:none!important;line-height:1.06!important;margin:0!important;padding:0 0 .05em!important;overflow:visible!important}
/* Related carousel cards: title/name = Bargim, brand/client = Denver. */
body.project-body-class.project-page .related-copy,.project-page-main .related-copy{display:block!important;position:absolute!important;left:28px!important;bottom:22px!important;z-index:2!important;color:#fff!important;text-align:left!important;line-height:1!important;transform:none!important;opacity:1!important;right:24px!important;max-width:calc(100% - 48px)!important;white-space:normal!important;overflow:visible!important;gap:0!important}
body.project-body-class.project-page .related-copy b,.project-page-main .related-copy b{display:block!important;font-family:var(--font-serif)!important;font-size:var(--ilu-related-title-size)!important;font-weight:400!important;letter-spacing:normal!important;line-height:1.08!important;color:#fff!important;text-transform:uppercase!important;margin:0!important;white-space:nowrap!important;overflow:visible!important;text-overflow:ellipsis!important;font-style:normal!important;margin-bottom:3px!important;font-synthesis:none!important;padding:.04em 0 .06em!important}
body.project-body-class.project-page .related-copy em,.project-page-main .related-copy em{display:block!important;font-family:var(--font-denver)!important;font-size:var(--ilu-related-client-size)!important;font-style:normal!important;font-weight:700!important;line-height:1.06!important;color:#fff!important;margin:0!important;letter-spacing:normal!important;white-space:nowrap!important;overflow:visible!important;text-overflow:ellipsis!important;margin-top:0!important;font-synthesis:weight!important;transform:none!important;text-transform:none!important;padding:0 0 .05em!important}
/* Project hero after HTML order inversion: title first, brand below. */
@media (max-width:760px){
body.project-body-class.project-page .project-title-wrap p,.project-page-main .project-title-wrap p{font-size:28px!important;line-height:1.05!important;margin:8px 0 0!important}
body.home-page .project-overlay b,body.project-body-class.project-page .related-copy b,.project-page-main .related-copy b{line-height:1.10!important;padding:.04em 0 .06em!important}
body.home-page .project-overlay em,body.project-body-class.project-page .related-copy em,.project-page-main .related-copy em{line-height:1.06!important;margin:0!important;margin-top:0!important;padding:0 0 .05em!important}
}
/* v103 mobile sizing + about spacing + desktop text tuning
   - Mobile home cards use the same text sizes as the related carousel.
   - Mobile About intro gets 20px top margin.
   - Mobile project titles increased to 30px.
   - Desktop project brand set to 54px.
   - Desktop home-card work titles increased to 40px. */
@media (max-width:760px){
body.home-page .project-overlay b{font-size:var(--ilu-mobile-related-title-size)!important;line-height:1.08!important}
body.home-page .project-overlay em{font-size:var(--ilu-mobile-related-client-size)!important;line-height:1.06!important}
body.about-page .about-intro{margin-top:20px!important}
body.project-body-class.project-page .project-title-wrap h1,.project-page-main .project-title-wrap h1{font-size:30px!important;line-height:.96!important;white-space:normal!important}
}
@media (min-width:761px){
body.project-body-class.project-page .project-title-wrap p,.project-page-main .project-title-wrap p{font-size:54px!important;line-height:1.02!important}
body.home-page .project-overlay b{font-size:40px!important;line-height:1.04!important}
}
/* v104 project hero thumbnails + fade integration
   - Each project hero now uses the same image as the home/card thumbnail.
   - Added soft top fade, stronger bottom fade into the site texture, and a light black darkening layer.
   - Tuned for desktop and mobile. */
body.project-body-class.project-page .project-title-wrap,body.project-body-class.project-page .project-arrow,.project-page-main .project-title-wrap,.project-page-main .project-arrow{position:relative!important;z-index:4!important}
@media (max-width:760px){
body.project-body-class.project-page .project-hero,.project-page-main .project-hero{background-position:center center!important}
body.project-body-class.project-page .project-hero::before,.project-page-main .project-hero::before{background:linear-gradient(
      to bottom,
      rgba(7,7,7,.46) 0%,
      rgba(7,7,7,.24) 14%,
      rgba(7,7,7,.12) 28%,
      rgba(7,7,7,.10) 60%,
      rgba(7,7,7,.18) 100%
    )!important}
body.project-body-class.project-page .project-hero::after,.project-page-main .project-hero::after{height:40%!important;-webkit-mask-image:linear-gradient(
      to bottom,
      rgba(0,0,0,0) 0%,
      rgba(0,0,0,.10) 20%,
      rgba(0,0,0,.34) 44%,
      rgba(0,0,0,.72) 74%,
      #000 100%
    )!important;mask-image:linear-gradient(
      to bottom,
      rgba(0,0,0,0) 0%,
      rgba(0,0,0,.10) 20%,
      rgba(0,0,0,.34) 44%,
      rgba(0,0,0,.72) 74%,
      #000 100%
    )!important}
body.project-body-class.project-page .claim,.project-page-main .claim{margin:-28px auto 48px!important}
}
/* v105 project hero correction
   - Remove the top gradient: keep only a subtle uniform black layer.
   - Restore centered title/brand block in desktop and mobile.
   - Restore project down arrow in desktop and mobile.
   - Force mobile and desktop to use the new thumbnail hero image.
   - Keep/strengthen the lower fade into the page background. */
body.project-body-class.project-page .project-hero,.project-page-main .project-hero{overflow:hidden!important;isolation:isolate!important;background-image:var(--hero-bg)!important;background-size:cover!important;background-position:center center!important;background-repeat:no-repeat!important;background:transparent!important;position:relative!important;background-color:#070707!important}
/* No top fade: just a very light, uniform darkening layer over the hero image. */
body.project-body-class.project-page .project-hero::before,.project-page-main .project-hero::before{content:''!important;position:absolute!important;left:0!important;right:0!important;top:0!important;height:24%!important;background:rgba(7,7,7,.14)!important;z-index:1!important;pointer-events:none!important;inset:0!important;background-image:linear-gradient(to bottom, rgba(0,0,0,.30) 0%, rgba(0,0,0,.12) 20%, rgba(0,0,0,0) 42%),
    var(--hero-bg)!important;background-size:cover, cover!important;background-position:center, center!important;background-repeat:no-repeat, no-repeat!important;-webkit-mask-image:none!important;mask-image:none!important;-webkit-mask-size:100% 100%!important;mask-size:100% 100%!important;-webkit-mask-repeat:no-repeat!important;mask-repeat:no-repeat!important;display:block!important}
/* Bottom integration fade into the black/textured page background. */
body.project-body-class.project-page .project-hero::after,.project-page-main .project-hero::after{content:''!important;position:absolute!important;left:0!important;right:0!important;bottom:-1px!important;height:46%!important;background:#070707 var(--black-texture) center top/auto repeat!important;z-index:2!important;pointer-events:none!important;display:block!important;opacity:1!important;-webkit-mask-image:linear-gradient(
    to bottom,
    rgba(0,0,0,0) 0%,
    rgba(0,0,0,.08) 18%,
    rgba(0,0,0,.26) 38%,
    rgba(0,0,0,.58) 66%,
    #000 100%
  )!important;mask-image:linear-gradient(
    to bottom,
    rgba(0,0,0,0) 0%,
    rgba(0,0,0,.08) 18%,
    rgba(0,0,0,.26) 38%,
    rgba(0,0,0,.58) 66%,
    #000 100%
  )!important;-webkit-mask-size:100% 100%!important;mask-size:100% 100%!important;-webkit-mask-repeat:no-repeat!important;mask-repeat:no-repeat!important}
body.project-body-class.project-page .project-title-wrap,.project-page-main .project-title-wrap{position:absolute!important;z-index:5!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;left:50%!important;top:47%!important;right:auto!important;bottom:auto!important;width:min(100%, 1320px)!important;margin:0!important;padding:0 28px!important;transform:translate(-50%, -50%)!important;text-align:center!important;text-shadow:none!important}
body.project-body-class.project-page .project-title-wrap h1,.project-page-main .project-title-wrap h1,body.project-body-class.project-page .project-title-wrap p,.project-page-main .project-title-wrap p{text-align:center!important}
body.project-body-class.project-page .project-title-wrap h1,.project-page-main .project-title-wrap h1{order:1!important;font-family:var(--font-serif)!important;font-weight:400!important;line-height:.92!important;margin:0!important;text-transform:uppercase!important;white-space:normal!important}
body.project-body-class.project-page .project-title-wrap p,.project-page-main .project-title-wrap p{color:#fff!important;font-size:var(--ilu-project-subtitle-size)!important;line-height:1.04!important;margin:14px 0 0!important;font-family:var(--font-denver)!important;font-weight:700!important;font-style:normal!important;font-synthesis:weight!important;letter-spacing:normal!important;transform:none!important;order:2!important;text-transform:none!important}
body.project-body-class.project-page .project-arrow,.project-page-main .project-arrow{left:50%!important;bottom:auto!important;transform:translate(-50%, -50%)!important;font-family:Arial,sans-serif!important;font-size:0!important;line-height:0!important;font-weight:300!important;text-shadow:none!important;position:absolute!important;z-index:6!important;display:block!important;align-items:center!important;justify-content:center!important;width:40px!important;height:40px!important;color:transparent!important;opacity:1!important;visibility:visible!important;cursor:pointer!important;background:url('/assets/img/project-arrow.svg') center/contain no-repeat!important;top:85%!important;right:auto!important;pointer-events:auto!important}
body.project-body-class.project-page .project-arrow::before,.project-page-main .project-arrow::before{content:none!important;display:none!important;color:#fff!important;font-family:Arial, Helvetica, sans-serif!important;font-size:78px!important;font-weight:300!important;line-height:1!important}
@media (max-width:760px){
body.project-body-class.project-page .project-hero,.project-page-main .project-hero{background-image:var(--hero-bg)!important;background-size:cover!important;background-position:center center!important;background-repeat:no-repeat!important}
body.project-body-class.project-page .project-hero::before,.project-page-main .project-hero::before{background:rgba(7,7,7,.16)!important}
body.project-body-class.project-page .project-hero::after,.project-page-main .project-hero::after{height:50%!important;-webkit-mask-image:linear-gradient(
      to bottom,
      rgba(0,0,0,0) 0%,
      rgba(0,0,0,.08) 16%,
      rgba(0,0,0,.30) 40%,
      rgba(0,0,0,.68) 70%,
      #000 100%
    )!important;mask-image:linear-gradient(
      to bottom,
      rgba(0,0,0,0) 0%,
      rgba(0,0,0,.08) 16%,
      rgba(0,0,0,.30) 40%,
      rgba(0,0,0,.68) 70%,
      #000 100%
    )!important}
body.project-body-class.project-page .project-title-wrap,.project-page-main .project-title-wrap{left:50%!important;top:47%!important;width:100%!important;padding:0 20px!important;transform:translate(-50%, -50%)!important;text-align:center!important}
body.project-body-class.project-page .project-title-wrap h1,.project-page-main .project-title-wrap h1{font-size:30px!important;line-height:.96!important;letter-spacing:-.02em!important;white-space:normal!important;margin:0!important}
body.project-body-class.project-page .project-title-wrap p,.project-page-main .project-title-wrap p{font-size:28px!important;line-height:1.05!important;margin:8px 0 0!important}
body.project-body-class.project-page .project-arrow,.project-page-main .project-arrow{left:50%!important;top:85%!important;transform:translate(-50%, -50%)!important;width:36px!important;height:36px!important}
}
/* v106 project hero hard reset
   Fixes v105 regressions:
   - No top gradient/block at all.
   - Hero image is rendered through a real child layer, not pseudo-elements, so old ::before rules cannot create a top band.
   - Mobile and desktop use the same thumbnail hero image from --hero-bg.
   - Bottom fade is isolated in its own layer.
   - Project arrow uses the same GIF asset as Home/About. */
body.project-body-class.project-page .project-hero.project-hero-v106,.project-page-main .project-hero.project-hero-v106{position:relative!important;overflow:hidden!important;isolation:isolate!important;display:flex!important;align-items:center!important;justify-content:center!important;text-align:center!important;background:#070707!important;background-image:none!important;background-size:auto!important;background-position:center!important;background-repeat:no-repeat!important}
/* Kill every previous pseudo-overlay. This removes the top block completely. */
body.project-body-class.project-page .project-hero.project-hero-v106::before,body.project-body-class.project-page .project-hero.project-hero-v106::after,.project-page-main .project-hero.project-hero-v106::before,.project-page-main .project-hero.project-hero-v106::after{content:none!important;display:none!important;background:none!important;height:auto!important;inset:auto!important;opacity:0!important;-webkit-mask-image:none!important;mask-image:none!important}
body.project-body-class.project-page .project-hero.project-hero-v106 .project-hero-bg,.project-page-main .project-hero.project-hero-v106 .project-hero-bg{position:absolute!important;inset:0!important;z-index:0!important;pointer-events:none!important;display:block!important;background-image:linear-gradient(rgba(7,7,7,.13), rgba(7,7,7,.13)), var(--hero-bg)!important;background-size:cover, cover!important;background-position:center center, center center!important;background-repeat:no-repeat, no-repeat!important}
body.project-body-class.project-page .project-hero.project-hero-v106 .project-hero-fade,.project-page-main .project-hero.project-hero-v106 .project-hero-fade{position:absolute!important;left:0!important;right:0!important;bottom:-1px!important;height:46%!important;z-index:1!important;pointer-events:none!important;display:block!important;background:#070707 var(--black-texture) center top/auto repeat!important;-webkit-mask-image:linear-gradient(
    to bottom,
    rgba(0,0,0,0) 0%,
    rgba(0,0,0,.08) 18%,
    rgba(0,0,0,.26) 38%,
    rgba(0,0,0,.58) 66%,
    #000 100%
  )!important;mask-image:linear-gradient(
    to bottom,
    rgba(0,0,0,0) 0%,
    rgba(0,0,0,.08) 18%,
    rgba(0,0,0,.26) 38%,
    rgba(0,0,0,.58) 66%,
    #000 100%
  )!important;-webkit-mask-size:100% 100%!important;mask-size:100% 100%!important;-webkit-mask-repeat:no-repeat!important;mask-repeat:no-repeat!important}
body.project-body-class.project-page .project-hero.project-hero-v106 .project-title-wrap,.project-page-main .project-hero.project-hero-v106 .project-title-wrap{position:absolute!important;left:50%!important;top:47%!important;right:auto!important;bottom:auto!important;width:min(100%, 1320px)!important;margin:0!important;padding:0 28px!important;transform:translate(-50%, -50%)!important;text-align:center!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;z-index:5!important;text-shadow:none!important}
body.project-body-class.project-page .project-hero.project-hero-v106 .project-title-wrap h1,.project-page-main .project-hero.project-hero-v106 .project-title-wrap h1{order:1!important;margin:0!important;text-align:center!important;white-space:normal!important}
body.project-body-class.project-page .project-hero.project-hero-v106 .project-title-wrap p,.project-page-main .project-hero.project-hero-v106 .project-title-wrap p{order:2!important;margin:14px 0 0!important;text-align:center!important}
body.project-body-class.project-page .project-hero.project-hero-v106 .project-arrow,.project-page-main .project-hero.project-hero-v106 .project-arrow{position:absolute!important;left:50%!important;top:85%!important;right:auto!important;bottom:auto!important;transform:translate(-50%, -50%)!important;z-index:6!important;display:block!important;width:106px!important;height:72px!important;margin:0!important;padding:0!important;border:0!important;font-size:0!important;line-height:0!important;color:transparent!important;text-shadow:none!important;background:url('/assets/img/mobile-scroll-arrow-v60.gif') 44% 50%/contain no-repeat!important;opacity:1!important;visibility:visible!important;pointer-events:auto!important;cursor:pointer!important;-webkit-tap-highlight-color:rgba(0,0,0,0)!important}
body.project-body-class.project-page .project-hero.project-hero-v106 .project-arrow::before,body.project-body-class.project-page .project-hero.project-hero-v106 .project-arrow::after,.project-page-main .project-hero.project-hero-v106 .project-arrow::before,.project-page-main .project-hero.project-hero-v106 .project-arrow::after{content:none!important;display:none!important}
body.project-body-class.project-page .project-page-main > .project-body,.project-page-main > .project-body{background:#070707 var(--black-texture) center top/auto repeat!important;padding-top:0!important}
body.project-body-class.project-page .claim,.project-page-main .claim{position:relative!important;z-index:5!important;width:min(1120px, calc(100% - 40px))!important;max-width:1120px!important;margin:-56px auto 72px!important;font-size:32px!important;line-height:1.08!important;gap:16px!important}
@media (max-width:760px){
body.project-body-class.project-page .project-hero.project-hero-v106,.project-page-main .project-hero.project-hero-v106{min-height:100svh!important;height:100svh!important;background:none!important;background-image:none!important}
body.project-body-class.project-page .project-hero.project-hero-v106 .project-hero-bg,.project-page-main .project-hero.project-hero-v106 .project-hero-bg{background-image:linear-gradient(rgba(7,7,7,.15), rgba(7,7,7,.15)), var(--hero-bg)!important;background-size:cover, cover!important;background-position:center center, center center!important;background-repeat:no-repeat, no-repeat!important}
body.project-body-class.project-page .project-hero.project-hero-v106 .project-hero-fade,.project-page-main .project-hero.project-hero-v106 .project-hero-fade{height:54%!important;-webkit-mask-image:linear-gradient(
      to bottom,
      rgba(0,0,0,0) 0%,
      rgba(0,0,0,.08) 16%,
      rgba(0,0,0,.30) 40%,
      rgba(0,0,0,.70) 70%,
      #000 100%
    )!important;mask-image:linear-gradient(
      to bottom,
      rgba(0,0,0,0) 0%,
      rgba(0,0,0,.08) 16%,
      rgba(0,0,0,.30) 40%,
      rgba(0,0,0,.70) 70%,
      #000 100%
    )!important}
body.project-body-class.project-page .project-hero.project-hero-v106 .project-title-wrap,.project-page-main .project-hero.project-hero-v106 .project-title-wrap{left:50%!important;top:47%!important;width:100%!important;padding:0 20px!important;transform:translate(-50%, -50%)!important;text-align:center!important}
body.project-body-class.project-page .project-hero.project-hero-v106 .project-title-wrap h1,.project-page-main .project-hero.project-hero-v106 .project-title-wrap h1{font-size:30px!important;line-height:.96!important;letter-spacing:-.02em!important;white-space:normal!important;margin:0!important;text-align:center!important}
body.project-body-class.project-page .project-hero.project-hero-v106 .project-title-wrap p,.project-page-main .project-hero.project-hero-v106 .project-title-wrap p{font-size:28px!important;line-height:1.05!important;margin:8px 0 0!important;text-align:center!important}
body.project-body-class.project-page .project-hero.project-hero-v106 .project-arrow,.project-page-main .project-hero.project-hero-v106 .project-arrow{left:50%!important;top:85%!important;transform:translate(-50%, -50%)!important;width:106px!important;height:72px!important}
body.project-body-class.project-page .claim,.project-page-main .claim{margin:-28px auto 48px!important}
}
/* v107 mobile-specific stronger lower fade for very light hero images
   Trial applied only to Amputype and The Abortion Collection.
   Goal: remove the visible cutoff line on mobile. */
@media (max-width:760px){
body.project-body-class.project-page .project-hero.project-hero-v106.project-hero-mobile-fade-strong .project-hero-bg,.project-page-main .project-hero.project-hero-v106.project-hero-mobile-fade-strong .project-hero-bg{position:absolute!important;background-image:linear-gradient(
        to bottom,
        rgba(7,7,7,.10) 0%,
        rgba(7,7,7,.12) 46%,
        rgba(7,7,7,.18) 60%,
        rgba(7,7,7,.34) 74%,
        rgba(7,7,7,.58) 86%,
        rgba(7,7,7,.78) 100%
      ),
      var(--hero-bg)!important;background-size:cover, cover!important;background-position:center center, center center!important;background-repeat:no-repeat, no-repeat!important}
body.project-body-class.project-page .project-hero.project-hero-v106.project-hero-mobile-fade-strong .project-hero-bg::after,.project-page-main .project-hero.project-hero-v106.project-hero-mobile-fade-strong .project-hero-bg::after{content:''!important;position:absolute!important;left:0!important;right:0!important;bottom:0!important;height:28%!important;display:block!important;pointer-events:none!important;background:linear-gradient(
      to bottom,
      rgba(7,7,7,0) 0%,
      rgba(7,7,7,.10) 20%,
      rgba(7,7,7,.34) 52%,
      rgba(7,7,7,.62) 78%,
      rgba(7,7,7,.86) 100%
    )!important}
body.project-body-class.project-page .project-hero.project-hero-v106.project-hero-mobile-fade-strong .project-hero-fade,.project-page-main .project-hero.project-hero-v106.project-hero-mobile-fade-strong .project-hero-fade{height:62%!important;bottom:-2px!important;-webkit-mask-image:linear-gradient(
      to bottom,
      rgba(0,0,0,0) 0%,
      rgba(0,0,0,.06) 10%,
      rgba(0,0,0,.18) 22%,
      rgba(0,0,0,.40) 40%,
      rgba(0,0,0,.72) 62%,
      rgba(0,0,0,.92) 82%,
      #000 100%
    )!important;mask-image:linear-gradient(
      to bottom,
      rgba(0,0,0,0) 0%,
      rgba(0,0,0,.06) 10%,
      rgba(0,0,0,.18) 22%,
      rgba(0,0,0,.40) 40%,
      rgba(0,0,0,.72) 62%,
      rgba(0,0,0,.92) 82%,
      #000 100%
    )!important}
body.project-body-class.project-page .project-hero.project-hero-v106.project-hero-mobile-fade-strong + .project-body .claim,.project-page-main .project-hero.project-hero-v106.project-hero-mobile-fade-strong + .project-body .claim{margin:-20px auto 48px!important}
}
/* v108
   - Apply the strong mobile hero fade to every project.
   - About page uses the same fixed cloud video background as Home on desktop and mobile. */
body.about-page{background:#070707!important;overflow-x:hidden!important}
body.about-page .about-bg-video{position:fixed!important;inset:0!important;width:100vw!important;height:100vh!important;min-width:100vw!important;min-height:100vh!important;object-fit:cover!important;z-index:0!important;pointer-events:none!important;display:block!important}
body.about-page .about-mobile-topnav,body.about-page .about-main{position:relative!important;z-index:1!important}
body.about-page .about-main{background:transparent!important}
body.about-page .about-content,body.about-page .footer{background:transparent!important}
@media (max-width:760px){
body.about-page,html:has(body.about-page){background:#070707!important}
body.about-page .about-bg-video{position:fixed!important;inset:0!important;width:100vw!important;height:100svh!important;object-fit:cover!important}
body.about-page .about-main{background:transparent!important}
}
/* v109 mobile About red titles tuning */
@media (max-width:760px){
body.about-page .about-section h2,body.about-page .about-content .about-section h2{color:var(--pink)!important;font-size:36px!important;line-height:.95!important;margin-bottom:10px!important}
}
/* v110 mobile project claim positioning fix
   - Stop moving the full claim/background area upward.
   - Move only the italic claim text visually.
   - Lower mobile arrow to 80%. */
@media (max-width:760px){
body.project-body-class.project-page .project-hero.project-hero-v106 + .project-body .claim,body.project-body-class.project-page .project-hero.project-hero-v106.project-hero-mobile-fade-strong + .project-body .claim,.project-page-main .project-hero.project-hero-v106 + .project-body .claim,.project-page-main .project-hero.project-hero-v106.project-hero-mobile-fade-strong + .project-body .claim,body.project-body-class.project-page .claim,.project-page-main .claim{margin:0 auto 50px!important;padding:0!important;font-size:26px!important;line-height:1.08!important;overflow:visible!important}
body.project-body-class.project-page .project-hero.project-hero-v106 + .project-body .claim em,body.project-body-class.project-page .project-hero.project-hero-v106.project-hero-mobile-fade-strong + .project-body .claim em,.project-page-main .project-hero.project-hero-v106 + .project-body .claim em,.project-page-main .project-hero.project-hero-v106.project-hero-mobile-fade-strong + .project-body .claim em,body.project-body-class.project-page .claim em,.project-page-main .claim em{display:block!important;font-size:26px!important;line-height:1.08!important;margin-top:-80px!important;margin-bottom:0!important}
body.project-body-class.project-page .project-hero.project-hero-v106 .project-arrow,body.project-body-class.project-page .project-hero.project-hero-v106.project-hero-mobile-fade-strong .project-arrow,.project-page-main .project-hero.project-hero-v106 .project-arrow,.project-page-main .project-hero.project-hero-v106.project-hero-mobile-fade-strong .project-arrow{top:80%!important;bottom:auto!important;transform:translate(-50%, -50%)!important}
}
/* v111 mobile spacing refinements from v110 base
   - Project claim uses the same 20px mobile side gutter.
   - About top image section gets 50px top padding on mobile. */
@media (max-width:760px){
body.project-body-class.project-page .project-hero.project-hero-v106 + .project-body .claim,body.project-body-class.project-page .project-hero.project-hero-v106.project-hero-mobile-fade-strong + .project-body .claim,.project-page-main .project-hero.project-hero-v106 + .project-body .claim,.project-page-main .project-hero.project-hero-v106.project-hero-mobile-fade-strong + .project-body .claim,body.project-body-class.project-page .claim,.project-page-main .claim{width:100%!important;max-width:none!important;padding-left:20px!important;padding-right:20px!important;box-sizing:border-box!important}
}
/* v114 mobile About arrow lift from v113
   - Keeps About media and intro at the same v113 position.
   - Moves only the mobile scroll arrow 20px further upward. */
@media (max-width:760px){
body.about-page .about-media{padding-top:0!important;transform:translateY(-50px)!important}
body.about-page .about-intro{transform:translateY(-50px)!important}
body.about-page .about-scroll-arrow{bottom:78px!important;transform:translateX(-50%)!important}
}
/* v115 The Slaughterman GIFs
   Replace the four vertical YouTube embeds with GIF media placed after the gallery images.
   Layout matches the previous vertical media rhythm: 2x2 on desktop, 1 column on mobile. */
body.project-body-class.project-page .gallery .slaughter-gif-grid,.project-page-main .gallery .slaughter-gif-grid{width:100%!important;max-width:1140px!important;margin:70px auto 0!important;display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:70px 2%!important}
body.project-body-class.project-page .gallery .slaughter-gif-grid img,.project-page-main .gallery .slaughter-gif-grid img{display:block!important;width:100%!important;max-width:100%!important;height:auto!important;margin:0!important;border-radius:9px!important}
@media (max-width:760px){
body.project-body-class.project-page .gallery .slaughter-gif-grid,.project-page-main .gallery .slaughter-gif-grid{max-width:none!important;margin:26px 0 0!important;grid-template-columns:1fr!important;gap:26px!important}
}
/* v120 About Student Awards logo strip
   Full-width inside the About content column, with responsive vertical spacing. */
body.about-page .student-awards-logos{display:block!important;width:100%!important;max-width:100%!important;height:auto!important;margin:30px auto!important;object-fit:contain!important}
@media (max-width:760px){
body.about-page .student-awards-logos{width:100%!important;max-width:100%!important;margin:15px 0!important}
}

/* v125 video first-frame fallback: avoid blue/black flash while autoplay video paints */
body.home-page .home-hero,
body.home-page .hero-bg-video,
body.home-page .footer-bg-video,
html:has(body.about-page),
body.about-page,
body.about-page .about-bg-video{
  background-color:#19a3f5!important;
  background-image:url('/assets/img/video-fallback-desktop-v125.jpg')!important;
  background-position:center center!important;
  background-size:cover!important;
  background-repeat:no-repeat!important;
}
@media (max-width:760px){
  body.home-page .home-hero,
  body.home-page .hero-bg-video,
  body.home-page .footer-bg-video,
  html:has(body.about-page),
  body.about-page,
  body.about-page .about-bg-video{
    background-image:url('/assets/img/video-fallback-mobile-v125.jpg')!important;
  }
}

/* v126 related projects draggable slider
   Replaces arrow navigation with a finite drag/scroll slider.
   Layout: full viewport clipping, initial left gutter, no right gutter, two cards plus next-card hint. */
html body.project-body-class.project-page .project-page-main .related,
html body.project-body-class.project-page .related,
html .project-page-main .related{
  --ilu-related-page-gutter:max(20px, calc((100vw - 1140px) / 2));
  --ilu-related-gap:20px;
  --ilu-related-peek:clamp(115px, 10vw, 150px);
  width:100vw!important;
  max-width:100vw!important;
  margin-left:calc(50% - 50vw)!important;
  margin-right:0!important;
  padding:8px 0 72px!important;
  overflow:hidden!important;
  position:relative!important;
  box-sizing:border-box!important;
}
html body.project-body-class.project-page .related-top,
html .project-page-main .related-top{
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  padding-left:var(--ilu-related-page-gutter)!important;
  padding-right:20px!important;
  box-sizing:border-box!important;
}
html body.project-body-class.project-page .related h2,
html .project-page-main .related h2{
  margin:0 0 34px!important;
}
html body.project-body-class.project-page .related-arrow,
html .project-page-main .related-arrow{
  display:none!important;
  visibility:hidden!important;
  pointer-events:none!important;
}
html body.project-body-class.project-page .related-track,
html .project-page-main .related-track{
  display:flex!important;
  gap:var(--ilu-related-gap)!important;
  width:100%!important;
  max-width:100%!important;
  height:auto!important;
  padding-left:var(--ilu-related-page-gutter)!important;
  padding-right:0!important;
  padding-bottom:4px!important;
  box-sizing:border-box!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  overscroll-behavior-x:contain!important;
  -webkit-overflow-scrolling:touch!important;
  scrollbar-width:none!important;
  scroll-behavior:auto!important;
  scroll-snap-type:none!important;
  transform:none!important;
  transition:none!important;
  will-change:scroll-position!important;
  position:relative!important;
  cursor:grab!important;
  touch-action:pan-y!important;
  user-select:none!important;
  -webkit-user-select:none!important;
}
html body.project-body-class.project-page .related-track::-webkit-scrollbar,
html .project-page-main .related-track::-webkit-scrollbar{
  display:none!important;
  width:0!important;
  height:0!important;
}
html body.project-body-class.project-page .related-track.is-dragging,
html .project-page-main .related-track.is-dragging{
  cursor:grabbing!important;
}
html body.project-body-class.project-page .related-card,
html body.project-body-class.project-page .related-card.is-mobile-related-visible,
html body.project-body-class.project-page .related-card.is-mobile-related-hidden,
html .project-page-main .related-card,
html .project-page-main .related-card.is-mobile-related-visible,
html .project-page-main .related-card.is-mobile-related-hidden{
  position:relative!important;
  inset:auto!important;
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  pointer-events:auto!important;
  flex:0 0 calc((100vw - var(--ilu-related-page-gutter) - var(--ilu-related-peek) - var(--ilu-related-gap)) / 2)!important;
  width:calc((100vw - var(--ilu-related-page-gutter) - var(--ilu-related-peek) - var(--ilu-related-gap)) / 2)!important;
  min-width:auto!important;
  max-width:none!important;
  height:clamp(260px, 25vw, 330px)!important;
  border-radius:10px!important;
  background-size:cover!important;
  background-position:center!important;
  transform:none!important;
  transition:filter .18s ease!important;
  scroll-snap-align:start!important;
  overflow:hidden!important;
  -webkit-user-drag:none!important;
  user-drag:none!important;
}
html body.project-body-class.project-page .related-card:hover,
html .project-page-main .related-card:hover{
  transform:none!important;
  filter:brightness(1.04)!important;
}
html body.project-body-class.project-page .related-track.is-dragging .related-card,
html .project-page-main .related-track.is-dragging .related-card{
  filter:none!important;
}
html body.project-body-class.project-page .related-track.is-dragging .related-card,
html body.project-body-class.project-page .related-track.is-dragging .related-card *,
html .project-page-main .related-track.is-dragging .related-card,
html .project-page-main .related-track.is-dragging .related-card *{
  cursor:grabbing!important;
}
html body.project-body-class.project-page .related-card[data-carousel-clone="true"],
html body.project-body-class.project-page .related-card[data-mobile-carousel-clone="true"],
html .project-page-main .related-card[data-carousel-clone="true"],
html .project-page-main .related-card[data-mobile-carousel-clone="true"]{
  display:none!important;
}
.no-js body.project-body-class.project-page .related-track,
.no-js .project-page-main .related-track{
  scroll-snap-type:x proximity!important;
}
@media (max-width:760px){
  html body.project-body-class.project-page .project-page-main .related,
  html body.project-body-class.project-page .related,
  html .project-page-main .related{
    --ilu-related-page-gutter:20px;
    --ilu-related-gap:14px;
    --ilu-related-peek:72px;
    width:100vw!important;
    max-width:100vw!important;
    margin-left:calc(50% - 50vw)!important;
    margin-right:0!important;
    padding-top:30px!important;
    padding-bottom:42px!important;
    overflow:hidden!important;
  }
  html body.project-body-class.project-page .related-top,
  html .project-page-main .related-top{
    padding-left:20px!important;
    padding-right:20px!important;
  }
  html body.project-body-class.project-page .related h2,
  html .project-page-main .related h2{
    font-size:42px!important;
    line-height:.92!important;
    margin:0 0 22px!important;
  }
  html body.project-body-class.project-page .related-track,
  html .project-page-main .related-track{
    gap:14px!important;
    padding-left:20px!important;
    padding-right:0!important;
    height:auto!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    transform:none!important;
    transition:none!important;
  }
  html body.project-body-class.project-page .related-card,
  html body.project-body-class.project-page .related-card.is-mobile-related-visible,
  html body.project-body-class.project-page .related-card.is-mobile-related-hidden,
  html .project-page-main .related-card,
  html .project-page-main .related-card.is-mobile-related-visible,
  html .project-page-main .related-card.is-mobile-related-hidden{
    flex:0 0 calc(100vw - 20px - 72px)!important;
    width:calc(100vw - 20px - 72px)!important;
    min-width:auto!important;
    max-width:none!important;
    height:180px!important;
    border-radius:14px!important;
  }
  html body.project-body-class.project-page .related-copy,
  html .project-page-main .related-copy{
    left:22px!important;
    right:18px!important;
    bottom:18px!important;
    max-width:calc(100% - 40px)!important;
  }
}



/* v128 related slider alignment and easier mobile swipe
   - Desktop: full-bleed slider starts near the viewport edge, not centered.
   - First card/title align with a small gutter.
   - Track keeps the same gutter at the end of the finite slider.
   - Mobile gap equals the 20px side gutter and keeps a visible next-card hint. */
@media (min-width:761px){
  html body.project-body-class.project-page .project-page-main .related,
  html body.project-body-class.project-page .related,
  html .project-page-main .related{
    --ilu-related-page-gutter:32px!important;
    --ilu-related-gap:20px!important;
    --ilu-related-peek:clamp(300px, 25vw, 440px)!important;
    width:100vw!important;
    max-width:100vw!important;
    margin-left:calc(50% - 50vw)!important;
    margin-right:0!important;
    overflow:hidden!important;
  }
  html body.project-body-class.project-page .related-top,
  html .project-page-main .related-top{
    padding-left:var(--ilu-related-page-gutter)!important;
    padding-right:var(--ilu-related-page-gutter)!important;
  }
  html body.project-body-class.project-page .related h2,
  html .project-page-main .related h2{
    margin-left:0!important;
    margin-right:0!important;
  }
  html body.project-body-class.project-page .related-track,
  html .project-page-main .related-track{
    gap:var(--ilu-related-gap)!important;
    padding-left:var(--ilu-related-page-gutter)!important;
    padding-right:var(--ilu-related-page-gutter)!important;
  }
  html body.project-body-class.project-page .related-card,
  html body.project-body-class.project-page .related-card.is-mobile-related-visible,
  html body.project-body-class.project-page .related-card.is-mobile-related-hidden,
  html .project-page-main .related-card,
  html .project-page-main .related-card.is-mobile-related-visible,
  html .project-page-main .related-card.is-mobile-related-hidden{
    flex:0 0 calc((100vw - var(--ilu-related-page-gutter) - var(--ilu-related-gap) - var(--ilu-related-gap) - var(--ilu-related-peek)) / 2)!important;
    width:calc((100vw - var(--ilu-related-page-gutter) - var(--ilu-related-gap) - var(--ilu-related-gap) - var(--ilu-related-peek)) / 2)!important;
    max-width:640px!important;
  }
}
@media (max-width:760px){
  html body.project-body-class.project-page .project-page-main .related,
  html body.project-body-class.project-page .related,
  html .project-page-main .related{
    --ilu-related-page-gutter:20px!important;
    --ilu-related-gap:20px!important;
    --ilu-related-peek:72px!important;
  }
  html body.project-body-class.project-page .related-track,
  html .project-page-main .related-track{
    gap:20px!important;
    padding-left:20px!important;
    padding-right:20px!important;
  }
  html body.project-body-class.project-page .related-card,
  html body.project-body-class.project-page .related-card.is-mobile-related-visible,
  html body.project-body-class.project-page .related-card.is-mobile-related-hidden,
  html .project-page-main .related-card,
  html .project-page-main .related-card.is-mobile-related-visible,
  html .project-page-main .related-card.is-mobile-related-hidden{
    flex:0 0 calc(100vw - 20px - 72px)!important;
    width:calc(100vw - 20px - 72px)!important;
  }
}

/* v129 related slider desktop containment + mobile text refinement
   - Prevent horizontal body drift caused by the full-bleed draggable strip.
   - Desktop related block uses a stable full-bleed transform anchored to the viewport,
     with a small left/right gutter and title aligned to the first card.
   - Mobile keeps the v128 placement/spacing, only reducing card typography slightly. */
html,
body{
  max-width:100%!important;
  overflow-x:hidden!important;
}
@supports (overflow:clip){
  html,
  body{
    overflow-x:clip!important;
  }
}
.project-page-main,
body.project-body-class.project-page{
  max-width:100%!important;
  overflow-x:hidden!important;
}
@media (min-width:761px){
  html body.project-body-class.project-page .project-page-main .related,
  html body.project-body-class.project-page .related,
  html .project-page-main .related{
    --ilu-related-page-gutter:32px!important;
    --ilu-related-gap:20px!important;
    --ilu-related-peek:clamp(300px, 25vw, 440px)!important;
    position:relative!important;
    left:50%!important;
    right:auto!important;
    width:100vw!important;
    max-width:100vw!important;
    min-width:100vw!important;
    margin-left:0!important;
    margin-right:0!important;
    transform:translateX(-50%)!important;
    padding-left:0!important;
    padding-right:0!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
  }
  html body.project-body-class.project-page .related-top,
  html .project-page-main .related-top{
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
    padding-left:var(--ilu-related-page-gutter)!important;
    padding-right:var(--ilu-related-page-gutter)!important;
    box-sizing:border-box!important;
  }
  html body.project-body-class.project-page .related h2,
  html .project-page-main .related h2{
    text-align:left!important;
    margin-left:0!important;
    margin-right:0!important;
  }
  html body.project-body-class.project-page .related-track,
  html .project-page-main .related-track{
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
    padding-left:var(--ilu-related-page-gutter)!important;
    padding-right:var(--ilu-related-page-gutter)!important;
    gap:var(--ilu-related-gap)!important;
    box-sizing:border-box!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
  }
  html body.project-body-class.project-page .related-card,
  html body.project-body-class.project-page .related-card.is-mobile-related-visible,
  html body.project-body-class.project-page .related-card.is-mobile-related-hidden,
  html .project-page-main .related-card,
  html .project-page-main .related-card.is-mobile-related-visible,
  html .project-page-main .related-card.is-mobile-related-hidden{
    flex:0 0 calc((100vw - var(--ilu-related-page-gutter) - (var(--ilu-related-gap) * 2) - var(--ilu-related-peek)) / 2)!important;
    width:calc((100vw - var(--ilu-related-page-gutter) - (var(--ilu-related-gap) * 2) - var(--ilu-related-peek)) / 2)!important;
    max-width:640px!important;
  }
}
@media (max-width:760px){
  html body.project-body-class.project-page .related-copy,
  html .project-page-main .related-copy{
    left:18px!important;
    right:16px!important;
    bottom:16px!important;
    max-width:calc(100% - 34px)!important;
  }
  html body.project-body-class.project-page .related-copy b,
  html .project-page-main .related-copy b{
    font-size:11px!important;
    line-height:1!important;
    letter-spacing:-.03em!important;
    margin-bottom:1px!important;
  }
  html body.project-body-class.project-page .related-copy em,
  html .project-page-main .related-copy em{
    font-size:10px!important;
    line-height:1!important;
  }
}

/* v130 mobile related slider typography rebalance
   - Card text is smaller than v128 but not tiny like v129.
   - Related heading returns to the previous mobile carousel scale. */
@media (max-width:760px){
  html body.project-body-class.project-page .related h2,
  html .project-page-main .related h2{
    font-size:34px!important;
    line-height:1.03!important;
    margin:0 0 22px!important;
    text-align:left!important;
  }
  html body.project-body-class.project-page .related-copy,
  html .project-page-main .related-copy{
    left:20px!important;
    right:18px!important;
    bottom:17px!important;
    max-width:calc(100% - 38px)!important;
  }
  html body.project-body-class.project-page .related-copy b,
  html .project-page-main .related-copy b{
    font-size:18px!important;
    line-height:1.08!important;
    letter-spacing:normal!important;
    margin-bottom:2px!important;
  }
  html body.project-body-class.project-page .related-copy em,
  html .project-page-main .related-copy em{
    font-size:16px!important;
    line-height:1.06!important;
  }
}

/* v131 final small fixes
   - Home down arrow restored as the same visual cue used across the site.
   - About mobile CV underline offset avoids clipping around the W.
   - Related slider desktop clicks are handled in JS. */
@media (min-width:761px){
  body.home-page .home-hero > .scroll-arrow{
    position:absolute!important;
    left:50%!important;
    bottom:34px!important;
    transform:translateX(-50%)!important;
    display:block!important;
    width:106px!important;
    height:72px!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    font-size:0!important;
    line-height:0!important;
    color:transparent!important;
    text-shadow:none!important;
    background:url('/assets/img/mobile-scroll-arrow-v60.gif') 44% 50%/contain no-repeat!important;
    z-index:6!important;
    opacity:1!important;
    visibility:visible!important;
    cursor:pointer!important;
    pointer-events:auto!important;
    -webkit-tap-highlight-color:rgba(0,0,0,0)!important;
  }
  body.home-page .home-hero > .scroll-arrow::before,
  body.home-page .home-hero > .scroll-arrow::after{
    content:none!important;
    display:none!important;
  }
}
@media (max-width:760px){
  body.about-page .cv-link a{
    line-height:1.18!important;
    padding-bottom:.08em!important;
    text-decoration-line:underline!important;
    text-decoration-thickness:1.5px!important;
    text-underline-offset:.15em!important;
    text-decoration-skip-ink:none!important;
  }
}

/* v133 desktop related slider sizing
   - Desktop only: cards capped at 540px and gap increased to 30px.
   - Mobile remains untouched. */
@media (min-width:761px){
  html body.project-body-class.project-page .project-page-main .related,
  html body.project-body-class.project-page .related,
  html .project-page-main .related{
    --ilu-related-gap:30px!important;
  }
  html body.project-body-class.project-page .related-card,
  html body.project-body-class.project-page .related-card.is-mobile-related-visible,
  html body.project-body-class.project-page .related-card.is-mobile-related-hidden,
  html .project-page-main .related-card,
  html .project-page-main .related-card.is-mobile-related-visible,
  html .project-page-main .related-card.is-mobile-related-hidden{
    max-width:540px!important;
  }
}

/* v138 dynamic admin gallery media */
body.project-body-class.project-page .gallery-stack video,
.project-page-main .gallery-stack video,
body.project-body-class.project-page .gallery-stack .gallery-embed,
.project-page-main .gallery-stack .gallery-embed{flex:0 0 100%!important;width:100%!important;max-width:100%!important;height:auto!important;margin:0!important;border-radius:9px!important;overflow:hidden;background:#000!important}
body.project-body-class.project-page .gallery-stack .gallery-embed,
.project-page-main .gallery-stack .gallery-embed{aspect-ratio:16/9!important}
body.project-body-class.project-page .gallery-stack .gallery-embed iframe,
.project-page-main .gallery-stack .gallery-embed iframe{width:100%!important;height:100%!important;border:0!important}
body.project-body-class.project-page .gallery-stack video.is-vertical-media,
.project-page-main .gallery-stack video.is-vertical-media,
body.project-body-class.project-page .gallery-stack .gallery-embed.is-vertical-media,
.project-page-main .gallery-stack .gallery-embed.is-vertical-media{flex-basis:49%!important;width:49%!important;max-width:49%!important}
@media(max-width:767px){body.project-body-class.project-page .gallery-stack video.is-vertical-media,.project-page-main .gallery-stack video.is-vertical-media,body.project-body-class.project-page .gallery-stack .gallery-embed.is-vertical-media,.project-page-main .gallery-stack .gallery-embed.is-vertical-media{flex-basis:100%!important;width:100%!important;max-width:100%!important}}
body.project-body-class.project-page .video video,.project-page-main .video video{width:100%!important;height:100%!important;object-fit:cover!important;display:block!important;background:#000!important}


/* v148 gallery ordering/rendering fixes */
body.project-body-class.project-page .gallery-stack,
.project-page-main .gallery-stack{display:flex!important;flex-direction:column!important;gap:70px!important}
body.project-body-class.project-page .gallery-two-row,
.project-page-main .gallery-two-row{display:flex!important;width:100%!important;gap:2%!important;align-items:flex-start!important;justify-content:space-between!important}
body.project-body-class.project-page .gallery-two-row.single,
.project-page-main .gallery-two-row.single{justify-content:center!important}
body.project-body-class.project-page .gallery-two-row > .is-vertical-media,
body.project-body-class.project-page .gallery-two-row > .gallery-media,
body.project-body-class.project-page .gallery-two-row > .gallery-embed,
.project-page-main .gallery-two-row > .is-vertical-media,
.project-page-main .gallery-two-row > .gallery-media,
.project-page-main .gallery-two-row > .gallery-embed{flex:0 0 49%!important;width:49%!important;max-width:49%!important;margin:0!important}
body.project-body-class.project-page .gallery-two-row.single > .is-vertical-media,
body.project-body-class.project-page .gallery-two-row.single > .gallery-media,
body.project-body-class.project-page .gallery-two-row.single > .gallery-embed,
.project-page-main .gallery-two-row.single > .is-vertical-media,
.project-page-main .gallery-two-row.single > .gallery-media,
.project-page-main .gallery-two-row.single > .gallery-embed{flex-basis:49%!important;width:49%!important;max-width:49%!important}
body.project-body-class.project-page .gallery-stack > img:not(.is-vertical-media),
body.project-body-class.project-page .gallery-stack > video:not(.is-vertical-media),
body.project-body-class.project-page .gallery-stack > .gallery-embed:not(.is-vertical-media),
.project-page-main .gallery-stack > img:not(.is-vertical-media),
.project-page-main .gallery-stack > video:not(.is-vertical-media),
.project-page-main .gallery-stack > .gallery-embed:not(.is-vertical-media){width:100%!important;max-width:100%!important;margin:0!important}
body.project-body-class.project-page .gallery-stack .flip-card-block,
.project-page-main .gallery-stack .flip-card-block{flex:0 0 auto!important;align-self:center!important}
@media(max-width:767px){body.project-body-class.project-page .gallery-stack,.project-page-main .gallery-stack{gap:28px!important}body.project-body-class.project-page .gallery-two-row,.project-page-main .gallery-two-row{display:flex!important;flex-direction:column!important;gap:28px!important}body.project-body-class.project-page .gallery-two-row > .is-vertical-media,body.project-body-class.project-page .gallery-two-row > .gallery-media,body.project-body-class.project-page .gallery-two-row > .gallery-embed,.project-page-main .gallery-two-row > .is-vertical-media,.project-page-main .gallery-two-row > .gallery-media,.project-page-main .gallery-two-row > .gallery-embed{width:100%!important;max-width:100%!important;flex-basis:100%!important}}


/* v151 flip gallery repair */
body.project-body-class.project-page .gallery-stack .flip-card-block,
.project-page-main .gallery-stack .flip-card-block,
body.project-body-class.project-page .flip-card-block,
.project-page-main .flip-card-block{
  width:min(360px,42vw)!important;
  max-width:360px!important;
  margin:0 auto 72px!important;
  text-align:center!important;
  perspective:1400px!important;
  overflow:visible!important;
  display:block!important;
}
body.project-body-class.project-page .flip-card,
.project-page-main .flip-card{
  width:100%!important;
  max-width:100%!important;
  margin:0 auto!important;
  margin-left:auto!important;
  transform:none!important;
  padding:0!important;
  background:transparent!important;
  border:0!important;
}
body.project-body-class.project-page .flip-card-inner,
.project-page-main .flip-card-inner{
  position:relative!important;
  display:block!important;
  width:100%!important;
  transform-style:preserve-3d!important;
  transition:transform .72s ease!important;
}
body.project-body-class.project-page .flip-card img.flip-front,
body.project-body-class.project-page .flip-card img.flip-back,
.project-page-main .flip-card img.flip-front,
.project-page-main .flip-card img.flip-back{
  display:block!important;
  width:100%!important;
  max-width:100%!important;
  height:auto!important;
  margin:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  backface-visibility:hidden!important;
  -webkit-backface-visibility:hidden!important;
}
body.project-body-class.project-page .flip-back,
.project-page-main .flip-back{position:absolute!important;inset:0!important;transform:rotateY(180deg)!important;}
body.project-body-class.project-page .flip-hover-icon,
.project-page-main .flip-hover-icon{
  display:block!important;
  width:64px!important;
  max-width:64px!important;
  height:auto!important;
  margin:20px auto 0!important;
  opacity:1!important;
  visibility:visible!important;
  content:normal!important;
}
body.project-body-class.project-page .flip-touch,
.project-page-main .flip-touch{display:none!important;}
@media (hover:hover) and (pointer:fine){
  body.project-body-class.project-page .flip-card:hover .flip-card-inner,
  body.project-body-class.project-page .flip-card:focus-visible .flip-card-inner,
  .project-page-main .flip-card:hover .flip-card-inner,
  .project-page-main .flip-card:focus-visible .flip-card-inner{transform:rotateY(180deg)!important;}
  body.project-body-class.project-page .flip-card.is-flipped .flip-card-inner,
  .project-page-main .flip-card.is-flipped .flip-card-inner{transform:none!important;}
}
@media (hover:none), (pointer:coarse), (max-width:760px){
  body.project-body-class.project-page .flip-card-block,
  .project-page-main .flip-card-block{width:min(300px,78vw)!important;max-width:300px!important;margin-bottom:52px!important;}
  body.project-body-class.project-page .flip-hover-icon,
  .project-page-main .flip-hover-icon{display:none!important;}
  body.project-body-class.project-page .flip-touch,
  .project-page-main .flip-touch{display:block!important;width:58px!important;max-width:58px!important;margin:18px auto 0!important;}
  body.project-body-class.project-page .flip-card.is-flipped .flip-card-inner,
  .project-page-main .flip-card.is-flipped .flip-card-inner{transform:rotateY(180deg)!important;}
}

/* v156: galería modular consistente para imagen/vídeo/flip */
body.project-body-class.project-page .gallery-stack,
.project-page-main .gallery-stack{
  display:flex!important;
  flex-direction:column!important;
  gap:70px!important;
}
body.project-body-class.project-page .gallery-two-row,
.project-page-main .gallery-two-row{
  display:flex!important;
  width:100%!important;
  gap:2%!important;
  align-items:flex-start!important;
  justify-content:space-between!important;
}
body.project-body-class.project-page .gallery-two-row.single,
.project-page-main .gallery-two-row.single{
  justify-content:center!important;
}
body.project-body-class.project-page .gallery-two-row > *,
.project-page-main .gallery-two-row > *{
  flex:0 0 49%!important;
  width:49%!important;
  max-width:49%!important;
  margin-left:0!important;
  margin-right:0!important;
  box-sizing:border-box!important;
}
body.project-body-class.project-page .gallery-stack > img:not(.is-vertical-media),
body.project-body-class.project-page .gallery-stack > video:not(.is-vertical-media),
body.project-body-class.project-page .gallery-stack > .gallery-embed:not(.is-vertical-media),
body.project-body-class.project-page .gallery-stack > .flip-card-block:not(.is-vertical-media),
.project-page-main .gallery-stack > img:not(.is-vertical-media),
.project-page-main .gallery-stack > video:not(.is-vertical-media),
.project-page-main .gallery-stack > .gallery-embed:not(.is-vertical-media),
.project-page-main .gallery-stack > .flip-card-block:not(.is-vertical-media){
  flex:0 0 100%!important;
  width:100%!important;
  max-width:100%!important;
  margin-left:0!important;
  margin-right:0!important;
  align-self:stretch!important;
  box-sizing:border-box!important;
}
body.project-body-class.project-page .gallery-stack .flip-card-block,
.project-page-main .gallery-stack .flip-card-block{
  text-align:center!important;
  perspective:1400px!important;
  overflow:visible!important;
  display:block!important;
}
body.project-body-class.project-page .flip-card,
.project-page-main .flip-card{
  width:100%!important;
  max-width:100%!important;
  margin:0!important;
  padding:0!important;
  background:transparent!important;
  border:0!important;
  transform:none!important;
}
body.project-body-class.project-page .flip-card-inner,
.project-page-main .flip-card-inner{
  width:100%!important;
}
body.project-body-class.project-page .flip-card img.flip-front,
body.project-body-class.project-page .flip-card img.flip-back,
.project-page-main .flip-card img.flip-front,
.project-page-main .flip-card img.flip-back{
  width:100%!important;
  max-width:100%!important;
  height:auto!important;
  margin:0!important;
}
body.project-body-class.project-page .flip-hover-icon,
.project-page-main .flip-hover-icon{
  width:42px!important;
  max-width:42px!important;
  height:auto!important;
  margin:18px auto 0!important;
}
@media(max-width:767px){
  body.project-body-class.project-page .gallery-stack,
  .project-page-main .gallery-stack{gap:28px!important;}
  body.project-body-class.project-page .gallery-two-row,
  .project-page-main .gallery-two-row{flex-direction:column!important;gap:28px!important;}
  body.project-body-class.project-page .gallery-two-row > *,
  .project-page-main .gallery-two-row > *{width:100%!important;max-width:100%!important;flex-basis:100%!important;}
  body.project-body-class.project-page .flip-touch,
  .project-page-main .flip-touch{display:block!important;width:42px!important;max-width:42px!important;margin:18px auto 0!important;}
}

/* v157: galería final — fila de 2 real + flip icon independiente */
body.project-body-class.project-page .gallery-stack .gallery-two-row > img,
body.project-body-class.project-page .gallery-stack .gallery-two-row > video,
body.project-body-class.project-page .gallery-stack .gallery-two-row > .gallery-media,
body.project-body-class.project-page .gallery-stack .gallery-two-row > .gallery-embed,
body.project-body-class.project-page .gallery-stack .gallery-two-row > .flip-card-block,
.project-page-main .gallery-stack .gallery-two-row > img,
.project-page-main .gallery-stack .gallery-two-row > video,
.project-page-main .gallery-stack .gallery-two-row > .gallery-media,
.project-page-main .gallery-stack .gallery-two-row > .gallery-embed,
.project-page-main .gallery-stack .gallery-two-row > .flip-card-block{
  flex:0 0 49%!important;
  width:49%!important;
  max-width:49%!important;
  margin:0!important;
  align-self:flex-start!important;
  box-sizing:border-box!important;
}
body.project-body-class.project-page .gallery-stack .gallery-two-row.single > img,
body.project-body-class.project-page .gallery-stack .gallery-two-row.single > video,
body.project-body-class.project-page .gallery-stack .gallery-two-row.single > .gallery-media,
body.project-body-class.project-page .gallery-stack .gallery-two-row.single > .gallery-embed,
body.project-body-class.project-page .gallery-stack .gallery-two-row.single > .flip-card-block,
.project-page-main .gallery-stack .gallery-two-row.single > img,
.project-page-main .gallery-stack .gallery-two-row.single > video,
.project-page-main .gallery-stack .gallery-two-row.single > .gallery-media,
.project-page-main .gallery-stack .gallery-two-row.single > .gallery-embed,
.project-page-main .gallery-stack .gallery-two-row.single > .flip-card-block{
  flex:0 0 49%!important;
  width:49%!important;
  max-width:49%!important;
  margin-left:auto!important;
  margin-right:auto!important;
}
body.project-body-class.project-page .gallery-stack > .flip-card-block:not(.is-vertical-media),
.project-page-main .gallery-stack > .flip-card-block:not(.is-vertical-media){
  flex:0 0 100%!important;
  width:100%!important;
  max-width:100%!important;
}
body.project-body-class.project-page .gallery-stack .flip-card-block > img.flip-hover-icon,
body.project-body-class.project-page .flip-card-block > img.flip-hover-icon,
.project-page-main .gallery-stack .flip-card-block > img.flip-hover-icon,
.project-page-main .flip-card-block > img.flip-hover-icon{
  display:block!important;
  flex:0 0 auto!important;
  width:42px!important;
  min-width:42px!important;
  max-width:42px!important;
  height:auto!important;
  max-height:none!important;
  margin:18px auto 0!important;
  align-self:center!important;
}
body.project-body-class.project-page .gallery-stack .flip-card-block > img.flip-touch,
body.project-body-class.project-page .flip-card-block > img.flip-touch,
.project-page-main .gallery-stack .flip-card-block > img.flip-touch,
.project-page-main .flip-card-block > img.flip-touch{
  flex:0 0 auto!important;
  width:58px!important;
  min-width:58px!important;
  max-width:58px!important;
  height:auto!important;
  max-height:none!important;
  margin:18px auto 0!important;
  align-self:center!important;
}
@media(max-width:767px){
  body.project-body-class.project-page .gallery-stack .gallery-two-row > img,
  body.project-body-class.project-page .gallery-stack .gallery-two-row > video,
  body.project-body-class.project-page .gallery-stack .gallery-two-row > .gallery-media,
  body.project-body-class.project-page .gallery-stack .gallery-two-row > .gallery-embed,
  body.project-body-class.project-page .gallery-stack .gallery-two-row > .flip-card-block,
  body.project-body-class.project-page .gallery-stack .gallery-two-row.single > img,
  body.project-body-class.project-page .gallery-stack .gallery-two-row.single > video,
  body.project-body-class.project-page .gallery-stack .gallery-two-row.single > .gallery-media,
  body.project-body-class.project-page .gallery-stack .gallery-two-row.single > .gallery-embed,
  body.project-body-class.project-page .gallery-stack .gallery-two-row.single > .flip-card-block,
  .project-page-main .gallery-stack .gallery-two-row > img,
  .project-page-main .gallery-stack .gallery-two-row > video,
  .project-page-main .gallery-stack .gallery-two-row > .gallery-media,
  .project-page-main .gallery-stack .gallery-two-row > .gallery-embed,
  .project-page-main .gallery-stack .gallery-two-row > .flip-card-block,
  .project-page-main .gallery-stack .gallery-two-row.single > img,
  .project-page-main .gallery-stack .gallery-two-row.single > video,
  .project-page-main .gallery-stack .gallery-two-row.single > .gallery-media,
  .project-page-main .gallery-stack .gallery-two-row.single > .gallery-embed,
  .project-page-main .gallery-stack .gallery-two-row.single > .flip-card-block{
    flex:0 0 100%!important;
    width:100%!important;
    max-width:100%!important;
    margin-left:0!important;
    margin-right:0!important;
  }
  body.project-body-class.project-page .gallery-stack .flip-card-block > img.flip-hover-icon,
  .project-page-main .gallery-stack .flip-card-block > img.flip-hover-icon{display:none!important;}
  body.project-body-class.project-page .gallery-stack .flip-card-block > img.flip-touch,
  body.project-body-class.project-page .flip-card-block > img.flip-touch,
  .project-page-main .gallery-stack .flip-card-block > img.flip-touch,
  .project-page-main .flip-card-block > img.flip-touch{width:42px!important;min-width:42px!important;max-width:42px!important;}
}

/* v162: Split awards refinement: both awards columns centered and no horizontal gap. */
body.project-body-class.project-page .project-info.project-info-split-awards .awards,
.project-page-main .project-info.project-info-split-awards .awards,
body.project-body-class.project-page .project-info.project-info-split-awards .awards .awards-title-denver,
.project-page-main .project-info.project-info-split-awards .awards .awards-title-denver,
body.project-body-class.project-page .project-info.project-info-split-awards .awards p,
.project-page-main .project-info.project-info-split-awards .awards p{
  text-align:center!important;
}
@media (min-width:761px){
  body.project-body-class.project-page .project-info.project-info-split-awards,
  .project-page-main .project-info.project-info-split-awards{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
    column-gap:0!important;
    row-gap:58px!important;
    align-items:start!important;
  }
  body.project-body-class.project-page .project-info.project-info-split-awards .project-desc,
  .project-page-main .project-info.project-info-split-awards .project-desc{
    grid-column:1 / -1!important;
    width:100%!important;
    max-width:980px!important;
    margin:0 auto!important;
    text-align:center!important;
  }
  body.project-body-class.project-page .project-info.project-info-split-awards .project-desc p,
  .project-page-main .project-info.project-info-split-awards .project-desc p{
    text-align:center!important;
    margin:0 auto!important;
  }
  body.project-body-class.project-page .project-info.project-info-split-awards .awards,
  .project-page-main .project-info.project-info-split-awards .awards{
    margin-top:0!important;
    min-width:0!important;
  }
}
@media (max-width:760px){
  body.project-body-class.project-page .project-info.project-info-split-awards,
  .project-page-main .project-info.project-info-split-awards{
    display:block!important;
  }
  body.project-body-class.project-page .project-info.project-info-split-awards .project-desc,
  .project-page-main .project-info.project-info-split-awards .project-desc{
    margin-bottom:44px!important;
  }
  body.project-body-class.project-page .project-info.project-info-split-awards .awards + .awards,
  .project-page-main .project-info.project-info-split-awards .awards + .awards{
    margin-top:30px!important;
  }
}

/* v164: related carousel initial gutter stability + mobile split-awards alignment. */
@media (min-width:761px){
  html body.project-body-class.project-page .related-track,
  html .project-page-main .related-track{
    overscroll-behavior-x:contain!important;
    scroll-padding-left:var(--ilu-related-page-gutter)!important;
  }
}
@media (max-width:760px){
  body.project-body-class.project-page .project-info.project-info-split-awards .awards,
  .project-page-main .project-info.project-info-split-awards .awards,
  body.project-body-class.project-page .project-info.project-info-split-awards .awards .awards-title-denver,
  .project-page-main .project-info.project-info-split-awards .awards .awards-title-denver,
  body.project-body-class.project-page .project-info.project-info-split-awards .awards p,
  .project-page-main .project-info.project-info-split-awards .awards p{
    text-align:left!important;
  }
}

/* v164: estabilización del carrusel "See other projects".
   Evita que el navegador restaure a veces scrollLeft > 0 y deje la primera tarjeta pegada/cortada. */
html body.project-body-class.project-page .related-track,
html .project-page-main .related-track{
  overflow-anchor:none!important;
  scroll-padding-left:var(--ilu-related-page-gutter, 20px)!important;
  scroll-margin-left:0!important;
}
html body.project-body-class.project-page .related-track .related-card:first-child,
html .project-page-main .related-track .related-card:first-child{
  scroll-margin-left:var(--ilu-related-page-gutter, 20px)!important;
}
@media(max-width:760px){
  body.project-body-class.project-page .project-info.project-info-split-awards .awards,
  .project-page-main .project-info.project-info-split-awards .awards,
  body.project-body-class.project-page .project-info.project-info-split-awards .awards .awards-title-denver,
  .project-page-main .project-info.project-info-split-awards .awards .awards-title-denver,
  body.project-body-class.project-page .project-info.project-info-split-awards .awards p,
  .project-page-main .project-info.project-info-split-awards .awards p{
    text-align:left!important;
  }
}

/* v164: related carousel initial gutter hardening + mobile split-awards alignment */
html body.project-body-class.project-page .related-track,
html .project-page-main .related-track{
  overflow-anchor:none!important;
  scroll-snap-stop:normal!important;
}

@media(max-width:760px){
  body.project-body-class.project-page .project-info.project-info-split-awards .awards,
  .project-page-main .project-info.project-info-split-awards .awards,
  body.project-body-class.project-page .project-info.project-info-split-awards .awards .awards-title-denver,
  .project-page-main .project-info.project-info-split-awards .awards .awards-title-denver,
  body.project-body-class.project-page .project-info.project-info-split-awards .awards p,
  .project-page-main .project-info.project-info-split-awards .awards p{
    text-align:left!important;
  }
}

/* v168: home mobile down arrow tap target fix */
@media(max-width:760px){
  body.home-page .home-hero > .scroll-arrow{
    position:absolute!important;
    left:50%!important;
    bottom:24px!important;
    display:block!important;
    width:118px!important;
    height:78px!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    font-size:0!important;
    line-height:0!important;
    color:transparent!important;
    text-shadow:none!important;
    transform:translateX(-50%)!important;
    background:url('/assets/img/mobile-scroll-arrow-v60.gif') 44% 50%/contain no-repeat!important;
    z-index:60!important;
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    touch-action:manipulation!important;
    cursor:pointer!important;
    -webkit-tap-highlight-color:rgba(0,0,0,0)!important;
  }
  body.home-page .home-hero > .scroll-arrow::before,
  body.home-page .home-hero > .scroll-arrow::after{
    content:none!important;
    display:none!important;
  }
  body.home-page .home-hero .hero-center,
  body.home-page .home-hero .hero-bg-video{
    pointer-events:none!important;
  }
  body.home-page .home-hero .hero-buttons,
  body.home-page .home-hero .hero-buttons a,
  body.home-page .home-hero > .scroll-arrow{
    pointer-events:auto!important;
  }
}

/* v171: responsive media normalization across public site
   Goal: keep large artwork proportional across scaled desktop, MacBook, tablet and mobile viewports.
   This avoids viewport-based assets becoming almost full-width on devices with smaller logical CSS pixels. */
html,
body{
  max-width:100%!important;
  overflow-x:hidden!important;
}
@supports (overflow: clip){
  html,
  body{overflow-x:clip!important;}
}
body.home-page .hero-bg-video,
body.home-page .footer-bg-video,
body.about-page .about-bg-video{
  max-width:100%!important;
  object-fit:cover!important;
}
body.home-page .hero-logo,
body.about-page .about-media,
body.about-page .about-media .about-image,
body.project-body-class.project-page .gallery-stack img,
.project-page-main .gallery-stack img,
body.project-body-class.project-page .video iframe,
.project-page-main .video iframe{
  box-sizing:border-box!important;
}

@media (min-width:761px){
  body.home-page .hero-center{
    width:min(1120px, 66vw)!important;
    max-width:1120px!important;
  }
  body.home-page .hero-logo{
    width:100%!important;
    max-width:1120px!important;
    height:auto!important;
    object-fit:contain!important;
  }
  body.home-page .side-social{
    left:clamp(28px, 2.1vw, 38px)!important;
    top:50%!important;
    transform:translateY(-50%)!important;
  }
  body.home-page .side-social-inner{
    gap:clamp(70px, 10vh, 96px)!important;
  }
  body.home-page .side-email{
    right:clamp(22px, 1.7vw, 28px)!important;
    top:50%!important;
    width:clamp(38px, 2.7vw, 46px)!important;
    height:clamp(320px, 44vh, 430px)!important;
    transform:translateY(-50%)!important;
    background-size:contain!important;
  }
  body.about-page .about-media{
    width:min(1120px, 64vw)!important;
    max-width:1120px!important;
  }
  body.about-page .about-media .about-image{
    width:103%!important;
    max-width:none!important;
    height:auto!important;
  }
  body.about-page .about-intro,
  body.about-page .about-content,
  body.project-body-class.project-page .project-info,
  .project-page-main .project-info,
  body.project-body-class.project-page .video,
  .project-page-main .video,
  body.project-body-class.project-page .gallery,
  .project-page-main .gallery{
    max-width:1140px!important;
  }
}

@media (min-width:761px) and (max-width:1180px){
  body.home-page .hero-center{
    width:min(980px, 68vw)!important;
    max-width:980px!important;
  }
  body.home-page .hero-logo{
    max-width:980px!important;
  }
  body.about-page .about-media{
    width:min(980px, 66vw)!important;
    max-width:980px!important;
  }
}

@media (max-width:760px){
  body.home-page .home-hero,
  body.project-body-class.project-page .project-hero,
  .project-page-main .project-hero{
    min-height:100svh!important;
    height:100svh!important;
  }
  @supports (height:100dvh){
    body.home-page .home-hero,
    body.project-body-class.project-page .project-hero,
    .project-page-main .project-hero{
      min-height:100dvh!important;
      height:100dvh!important;
    }
  }
  body.home-page .hero-logo{
    width:min(88vw, 430px)!important;
    max-width:430px!important;
    height:auto!important;
    object-fit:contain!important;
  }
  body.home-page .hero-buttons,
  body.home-page .hero-buttons.image-buttons{
    width:min(calc(100vw - 30px), 420px)!important;
  }
  body.about-page .about-media{
    width:min(100vw, 560px)!important;
    max-width:560px!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }
  body.about-page .about-media .about-image{
    width:103%!important;
    max-width:none!important;
    height:auto!important;
  }
  body.about-page .about-intro,
  body.about-page .about-content{
    max-width:560px!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }
  body.project-body-class.project-page .project-info,
  body.project-body-class.project-page .video,
  body.project-body-class.project-page .gallery,
  body.project-body-class.project-page .flip-card-block,
  body.project-body-class.project-page .video-grid-vertical,
  .project-page-main .project-info,
  .project-page-main .video,
  .project-page-main .gallery,
  .project-page-main .flip-card-block,
  .project-page-main .video-grid-vertical{
    width:calc(100vw - 40px)!important;
    max-width:560px!important;
    margin-left:auto!important;
    margin-right:auto!important;
  }
  body.project-body-class.project-page .gallery-stack img,
  .project-page-main .gallery-stack img,
  body.project-body-class.project-page .gallery-stack video,
  .project-page-main .gallery-stack video{
    width:100%!important;
    max-width:100%!important;
    height:auto!important;
  }
  body.project-body-class.project-page .project-hero.project-hero-v106 .project-title-wrap,
  .project-page-main .project-hero.project-hero-v106 .project-title-wrap{
    width:100%!important;
    max-width:100vw!important;
  }
}

@media (min-width:761px) and (max-height:820px){
  body.home-page .hero-center{
    width:min(980px, 58vw)!important;
    max-width:980px!important;
  }
  body.home-page .hero-logo{
    max-width:980px!important;
  }
}

@media (max-height:600px) and (orientation:landscape){
  body.home-page .side-social,
  body.home-page .side-email{
    display:none!important;
  }
  body.home-page .home-hero{
    min-height:100svh!important;
    height:100svh!important;
    padding:0!important;
  }
  body.home-page .hero-center{
    width:min(560px, 62vw)!important;
    max-width:560px!important;
    transform:none!important;
  }
  body.home-page .hero-logo{
    width:100%!important;
    max-width:560px!important;
    max-height:42svh!important;
    margin-bottom:12px!important;
    object-fit:contain!important;
  }
  body.home-page .hero-buttons,
  body.home-page .hero-buttons.image-buttons{
    gap:14px!important;
    margin-top:10px!important;
    width:min(360px, 58vw)!important;
  }
  body.home-page .hero-buttons a,
  body.home-page .hero-buttons.image-buttons a{
    width:min(160px, 26vw)!important;
  }
  body.home-page .home-hero > .scroll-arrow{
    width:82px!important;
    height:54px!important;
    bottom:6px!important;
  }
}

/* v171: proportional responsive normalization
   - Keeps Home hero artwork, buttons, side icons/email and bottom arrow in one proportional system.
   - Prevents small desktop / short browser windows from keeping oversized desktop UI.
   - Keeps About hero artwork and overlay buttons tied to the same scaled media block.
   - Forces Home work cards to keep 16:9 on desktop/tablet widths. */
@media (min-width:761px){
  body.home-page .home-hero{
    min-height:100svh!important;
    height:100svh!important;
    padding:0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    overflow:hidden!important;
  }
  @supports (height:100dvh){
    body.home-page .home-hero{
      min-height:100dvh!important;
      height:100dvh!important;
    }
  }
  body.home-page .hero-center{
    width:min(1120px, 66vw, calc(180svh - 378px))!important;
    max-width:1120px!important;
    min-width:0!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    padding:0!important;
    margin:0!important;
    transform:translateY(clamp(-20px, -1.4svh, -8px))!important;
    text-align:center!important;
  }
  body.home-page .hero-logo{
    width:100%!important;
    max-width:1120px!important;
    max-height:calc(100svh - 250px)!important;
    height:auto!important;
    margin:0 0 clamp(28px, 5.4svh, 58px)!important;
    object-fit:contain!important;
  }
  body.home-page .hero-buttons,
  body.home-page .hero-buttons.image-buttons{
    position:static!important;
    left:auto!important;
    top:auto!important;
    transform:none!important;
    display:flex!important;
    flex-direction:row!important;
    justify-content:center!important;
    align-items:center!important;
    gap:clamp(24px, 3.75vw, 72px)!important;
    width:auto!important;
    max-width:100%!important;
    margin:0!important;
  }
  body.home-page .hero-buttons a,
  body.home-page .hero-buttons.image-buttons a{
    width:clamp(150px, min(20vw, 34svh), 285px)!important;
    max-width:none!important;
    flex:0 0 auto!important;
  }
  body.home-page .home-hero > .scroll-arrow{
    position:absolute!important;
    left:50%!important;
    bottom:clamp(18px, 3.2svh, 34px)!important;
    width:clamp(82px, min(7vw, 14svh), 106px)!important;
    height:clamp(54px, min(4.75vw, 9.5svh), 72px)!important;
    margin:0!important;
    transform:translateX(-50%)!important;
    font-size:0!important;
    line-height:0!important;
    color:transparent!important;
    text-shadow:none!important;
    background:url('/assets/img/mobile-scroll-arrow-v60.gif') 44% 50%/contain no-repeat!important;
    z-index:60!important;
  }
  body.home-page .side-social,
  body.home-page .desktop-only.side-social{
    display:block!important;
    left:clamp(22px, 2.1vw, 38px)!important;
    top:50%!important;
    transform:translateY(-50%)!important;
  }
  body.home-page .side-social-inner{
    gap:clamp(52px, min(9vh, 5vw), 96px)!important;
  }
  body.home-page .side-social-inner a{
    width:clamp(38px, min(3vw, 6.9svh), 54px)!important;
    height:clamp(38px, min(3vw, 6.9svh), 54px)!important;
  }
  body.home-page .side-social-inner svg{
    width:clamp(30px, min(2.45vw, 5.2svh), 40px)!important;
    height:clamp(30px, min(2.45vw, 5.2svh), 40px)!important;
  }
  body.home-page .side-email,
  body.home-page .desktop-only.side-email{
    display:block!important;
    right:clamp(18px, 1.7vw, 28px)!important;
    top:50%!important;
    width:clamp(24px, min(2vw, 4svh), 46px)!important;
    height:clamp(230px, min(39svh, 22vw), 430px)!important;
    transform:translateY(-50%)!important;
    background-size:contain!important;
  }

  body.home-page .project-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr))!important;
    gap:0!important;
  }
  body.home-page .project-card{
    aspect-ratio:16 / 9!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    background-size:cover!important;
    background-position:center center!important;
  }

  body.about-page .about-hero{
    min-height:100svh!important;
    height:auto!important;
    padding:clamp(18px, 3.4svh, 36px) 0 clamp(24px, 4svh, 54px)!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:flex-start!important;
    overflow:visible!important;
    box-sizing:border-box!important;
  }
  body.about-page .about-media{
    width:min(1120px, 64vw, calc(190svh - 418px))!important;
    max-width:1120px!important;
    min-width:0!important;
    margin:0 auto!important;
    padding:clamp(12px, 2.6svh, 30px) 0 clamp(24px, 5svh, 50px)!important;
    transform:none!important;
    line-height:0!important;
  }
  body.about-page .about-media .about-image,
  body.about-page .about-image{
    display:block!important;
    width:103%!important;
    max-width:none!important;
    height:auto!important;
    margin:0 0 0 50%!important;
    transform:translateX(-50%)!important;
    object-fit:contain!important;
    object-position:center top!important;
  }
  body.about-page .about-media .about-home-link,
  body.about-page .about-media .about-work-link{
    display:block!important;
    visibility:visible!important;
    pointer-events:auto!important;
    width:clamp(68px, 12%, 134px)!important;
    min-width:0!important;
    max-width:134px!important;
    height:auto!important;
    top:calc(84.8% - clamp(18px, 4svh, 38px))!important;
    transform:translate(-50%, -50%)!important;
  }
  body.about-page .about-media .about-home-link{
    left:12.95%!important;
  }
  body.about-page .about-media .about-work-link{
    left:87.05%!important;
  }
  body.about-page .about-media .about-home-link img,
  body.about-page .about-media .about-work-link img{
    width:100%!important;
    height:auto!important;
    max-width:none!important;
  }
  body.about-page .about-intro{
    transform:none!important;
    margin-top:0!important;
  }
}

@media (min-width:761px) and (max-height:820px){
  body.home-page .hero-center{
    width:min(980px, 58vw, calc(178svh - 338.2px))!important;
    max-width:980px!important;
    transform:translateY(clamp(-28px, -2.2svh, -12px))!important;
  }
  body.home-page .hero-logo{
    margin-bottom:clamp(22px, 4.6svh, 42px)!important;
  }
  body.home-page .hero-buttons a,
  body.home-page .hero-buttons.image-buttons a{
    width:clamp(136px, min(18vw, 31svh), 245px)!important;
  }
  body.home-page .home-hero > .scroll-arrow{
    bottom:clamp(12px, 2.6svh, 24px)!important;
  }
  body.about-page .about-media{
    width:min(980px, 64vw, calc(186svh - 316.2px))!important;
    max-width:980px!important;
  }
}

@media (min-width:761px) and (max-height:640px){
  body.home-page .hero-center{
    width:min(720px, 56vw, calc(170svh - 280.5px))!important;
    transform:translateY(clamp(-26px, -3svh, -14px))!important;
  }
  body.home-page .hero-logo{
    margin-bottom:clamp(16px, 3.2svh, 26px)!important;
  }
  body.home-page .hero-buttons,
  body.home-page .hero-buttons.image-buttons{
    gap:clamp(14px, 2.2vw, 36px)!important;
  }
  body.home-page .hero-buttons a,
  body.home-page .hero-buttons.image-buttons a{
    width:clamp(118px, min(14vw, 27svh), 190px)!important;
  }
  body.home-page .side-social-inner{
    gap:clamp(42px, 7.5vh, 58px)!important;
  }
  body.about-page .about-media{
    width:min(760px, 62vw, calc(175svh - 245px))!important;
    max-width:760px!important;
  }
}

@media (min-width:761px) and (max-width:900px){
  body.home-page .side-social,
  body.home-page .desktop-only.side-social{
    left:18px!important;
  }
  body.home-page .side-email,
  body.home-page .desktop-only.side-email{
    right:16px!important;
  }
  body.home-page .hero-center{
    width:min(620px, 58vw, calc(172svh - 318.2px))!important;
  }
  body.home-page .hero-buttons a,
  body.home-page .hero-buttons.image-buttons a{
    width:clamp(120px, min(16vw, 28svh), 190px)!important;
  }
  body.about-page .about-media{
    width:min(700px, 70vw, calc(172svh - 275.2px))!important;
  }
}

@media (max-width:760px){
  body.home-page .project-grid{
    grid-template-columns:1fr!important;
  }
  body.home-page .project-card{
    height:345px!important;
    aspect-ratio:auto!important;
  }
}

/* v171: proportional stability pass for normal desktop/laptop viewports
   - Prevents the Home logo from becoming unreadably small in short desktop windows.
   - Makes side icons/email scale with viewport height instead of staying oversized.
   - Keeps the Home arrow anchored to the bottom edge.
   - Keeps Home work cards at 16:9 and scales card typography.
   - Keeps About media/buttons tied to one media scale.
   - Re-centers project hero titles and keeps arrow + claim visible near the lower hero area. */
@media (min-width:761px){
  body.home-page .home-hero{
    min-height:100svh!important;
    height:100svh!important;
    padding:0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    overflow:hidden!important;
  }
  @supports (height:100dvh){
    body.home-page .home-hero{
      min-height:100dvh!important;
      height:100dvh!important;
    }
  }
  body.home-page .hero-center{
    width:clamp(520px, min(58vw, calc((100svh - 185px) * 2.2)), 1120px)!important;
    max-width:calc(100vw - 190px)!important;
    min-width:520px!important;
    transform:translateY(clamp(-18px, -1.1svh, -6px))!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    margin:0 auto!important;
    padding:0!important;
  }
  body.home-page .hero-logo{
    width:100%!important;
    min-width:0!important;
    max-width:1120px!important;
    max-height:none!important;
    height:auto!important;
    margin:0 0 clamp(22px, 4.2svh, 58px)!important;
    object-fit:contain!important;
  }
  body.home-page .hero-buttons,
  body.home-page .hero-buttons.image-buttons{
    display:flex!important;
    flex-direction:row!important;
    align-items:center!important;
    justify-content:center!important;
    gap:clamp(20px, 3.2vw, 72px)!important;
    width:auto!important;
    max-width:100%!important;
    margin:0!important;
    transform:none!important;
  }
  body.home-page .hero-buttons a,
  body.home-page .hero-buttons.image-buttons a{
    width:clamp(150px, min(17vw, 31svh), 285px)!important;
    min-width:0!important;
    max-width:285px!important;
    flex:0 0 auto!important;
  }
  body.home-page .home-hero > .scroll-arrow{
    position:absolute!important;
    left:50%!important;
    top:auto!important;
    bottom:clamp(10px, 2.6svh, 34px)!important;
    width:clamp(70px, min(6.6vw, 12svh), 106px)!important;
    height:clamp(46px, min(4.5vw, 8svh), 72px)!important;
    transform:translateX(-50%)!important;
    margin:0!important;
    background:url('/assets/img/mobile-scroll-arrow-v60.gif') 44% 50%/contain no-repeat!important;
    z-index:70!important;
    font-size:0!important;
    line-height:0!important;
    color:transparent!important;
    text-shadow:none!important;
    opacity:1!important;
    visibility:visible!important;
  }
  body.home-page .side-social,
  body.home-page .desktop-only.side-social{
    display:block!important;
    left:clamp(18px, 2vw, 38px)!important;
    top:50%!important;
    transform:translateY(-50%)!important;
  }
  body.home-page .side-social-inner{
    gap:clamp(32px, min(8svh, 5vw), 96px)!important;
  }
  body.home-page .side-social-inner a{
    width:clamp(26px, min(3vw, 5.8svh), 54px)!important;
    height:clamp(26px, min(3vw, 5.8svh), 54px)!important;
  }
  body.home-page .side-social-inner svg{
    width:clamp(22px, min(2.35vw, 4.8svh), 40px)!important;
    height:clamp(22px, min(2.35vw, 4.8svh), 40px)!important;
  }
  body.home-page .side-email,
  body.home-page .desktop-only.side-email{
    display:block!important;
    right:clamp(14px, 1.6vw, 28px)!important;
    top:50%!important;
    width:clamp(22px, min(2vw, 4.2svh), 46px)!important;
    height:clamp(165px, min(39svh, 22vw), 430px)!important;
    transform:translateY(-50%)!important;
    background-size:contain!important;
  }

  body.home-page .project-grid{
    display:grid!important;
    grid-template-columns:repeat(2, minmax(0, 1fr))!important;
    gap:0!important;
  }
  body.home-page .project-card{
    aspect-ratio:16 / 9!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    background-size:cover!important;
    background-position:center center!important;
  }
  body.home-page .project-overlay{
    left:clamp(20px, 4.8vw, 86px)!important;
    right:clamp(18px, 3.2vw, 48px)!important;
    bottom:clamp(18px, 3.2vw, 40px)!important;
    max-width:calc(100% - clamp(40px, 8vw, 128px))!important;
  }
  body.home-page .project-overlay b{
    font-size:clamp(20px, 3.05vw, 40px)!important;
    line-height:1.04!important;
  }
  body.home-page .project-overlay em{
    font-size:clamp(18px, 2.45vw, 32px)!important;
    line-height:1.05!important;
  }

  body.about-page .about-hero{
    min-height:100svh!important;
    height:auto!important;
    padding:clamp(16px, 3svh, 36px) 0 clamp(22px, 4svh, 54px)!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:flex-start!important;
    overflow:visible!important;
  }
  body.about-page .about-media{
    width:clamp(620px, min(70vw, 150svh), 1120px)!important;
    max-width:calc(100vw - 64px)!important;
    min-width:0!important;
    margin:0 auto 0!important;
    padding:clamp(8px, 2svh, 26px) 0 clamp(20px, 4svh, 44px)!important;
    transform:none!important;
    line-height:0!important;
  }
  body.about-page .about-media .about-image,
  body.about-page .about-image{
    display:block!important;
    width:103%!important;
    max-width:none!important;
    height:auto!important;
    margin:0 0 0 50%!important;
    transform:translateX(-50%)!important;
    object-fit:contain!important;
    object-position:center top!important;
  }
  body.about-page .about-media .about-home-link,
  body.about-page .about-media .about-work-link{
    width:clamp(70px, 12%, 134px)!important;
    min-width:0!important;
    max-width:134px!important;
    height:auto!important;
    top:84.8%!important;
    transform:translate(-50%, -50%)!important;
  }
  body.about-page .about-media .about-home-link{left:12.95%!important;}
  body.about-page .about-media .about-work-link{left:87.05%!important;}
  body.about-page .about-intro{
    transform:none!important;
    margin-top:0!important;
  }

  body.project-body-class.project-page .project-hero,
  .project-page-main .project-hero,
  body.project-body-class.project-page .project-hero.project-hero-v106,
  .project-page-main .project-hero.project-hero-v106{
    min-height:100svh!important;
    height:100svh!important;
    position:relative!important;
    overflow:hidden!important;
  }
  @supports (height:100dvh){
    body.project-body-class.project-page .project-hero,
    .project-page-main .project-hero,
    body.project-body-class.project-page .project-hero.project-hero-v106,
    .project-page-main .project-hero.project-hero-v106{
      min-height:100dvh!important;
      height:100dvh!important;
    }
  }
  body.project-body-class.project-page .project-hero.project-hero-v106 .project-title-wrap,
  .project-page-main .project-hero.project-hero-v106 .project-title-wrap{
    position:absolute!important;
    left:50%!important;
    top:50%!important;
    right:auto!important;
    bottom:auto!important;
    width:min(100%, 1320px)!important;
    max-width:100vw!important;
    padding:0 clamp(24px, 4vw, 56px)!important;
    margin:0!important;
    transform:translate(-50%, -50%)!important;
    text-align:center!important;
    z-index:6!important;
  }
  body.project-body-class.project-page .project-hero.project-hero-v106 .project-title-wrap h1,
  .project-page-main .project-hero.project-hero-v106 .project-title-wrap h1{
    font-size:clamp(46px, min(4.7vw, 11svh), 92px)!important;
    line-height:.92!important;
    margin:0!important;
  }
  body.project-body-class.project-page .project-hero.project-hero-v106 .project-title-wrap p,
  .project-page-main .project-hero.project-hero-v106 .project-title-wrap p{
    font-size:clamp(30px, min(2.8vw, 6.6svh), 54px)!important;
    line-height:1.02!important;
    margin:10px 0 0!important;
  }
  body.project-body-class.project-page .project-hero.project-hero-v106 .project-arrow,
  .project-page-main .project-hero.project-hero-v106 .project-arrow{
    position:absolute!important;
    left:50%!important;
    top:auto!important;
    bottom:clamp(96px, 15svh, 150px)!important;
    transform:translateX(-50%)!important;
    z-index:8!important;
    width:clamp(76px, min(7vw, 13svh), 106px)!important;
    height:clamp(50px, min(4.8vw, 8.5svh), 72px)!important;
    background:url('/assets/img/mobile-scroll-arrow-v60.gif') 44% 50%/contain no-repeat!important;
    display:block!important;
    opacity:1!important;
    visibility:visible!important;
    font-size:0!important;
    line-height:0!important;
    color:transparent!important;
    text-shadow:none!important;
  }
  body.project-body-class.project-page .project-hero + .project-body,
  .project-page-main .project-hero + .project-body{
    padding-top:0!important;
  }
  body.project-body-class.project-page .project-hero + .project-body .claim,
  .project-page-main .project-hero + .project-body .claim{
    position:relative!important;
    z-index:9!important;
    margin-top:calc(-1 * clamp(72px, 10.5svh, 112px))!important;
    margin-bottom:clamp(58px, 8svh, 92px)!important;
    width:min(980px, 90vw)!important;
    font-size:clamp(24px, min(2.25vw, 4.8svh), 40px)!important;
    line-height:1.05!important;
  }
}

@media (min-width:761px) and (max-width:900px){
  body.home-page .hero-center{
    width:clamp(430px, 63vw, 620px)!important;
    min-width:430px!important;
    max-width:calc(100vw - 132px)!important;
  }
  body.home-page .hero-buttons a,
  body.home-page .hero-buttons.image-buttons a{
    width:clamp(126px, 16vw, 190px)!important;
  }
  body.about-page .about-media{
    width:clamp(540px, 76vw, 700px)!important;
    max-width:calc(100vw - 42px)!important;
  }
}

@media (min-width:761px) and (max-height:520px){
  body.home-page .hero-center{
    width:clamp(470px, min(56vw, calc((100svh - 160px) * 2.6)), 720px)!important;
    min-width:470px!important;
  }
  body.home-page .hero-logo{
    margin-bottom:clamp(14px, 3svh, 24px)!important;
  }
  body.home-page .hero-buttons,
  body.home-page .hero-buttons.image-buttons{
    gap:clamp(14px, 2.2vw, 34px)!important;
  }
  body.home-page .hero-buttons a,
  body.home-page .hero-buttons.image-buttons a{
    width:clamp(118px, min(14.2vw, 27svh), 178px)!important;
  }
  body.home-page .home-hero > .scroll-arrow{
    bottom:8px!important;
    width:68px!important;
    height:44px!important;
  }
  body.home-page .side-social-inner{gap:30px!important;}
  body.home-page .side-social-inner a{width:25px!important;height:25px!important;}
  body.home-page .side-social-inner svg{width:21px!important;height:21px!important;}
  body.home-page .side-email{height:155px!important;width:21px!important;}

  body.about-page .about-media{
    width:clamp(540px, min(68vw, 145svh), 760px)!important;
  }
  body.project-body-class.project-page .project-hero.project-hero-v106 .project-arrow,
  .project-page-main .project-hero.project-hero-v106 .project-arrow{
    bottom:82px!important;
  }
  body.project-body-class.project-page .project-hero + .project-body .claim,
  .project-page-main .project-hero + .project-body .claim{
    margin-top:-66px!important;
    margin-bottom:56px!important;
  }
}

@media (max-width:760px){
  body.home-page .project-grid{grid-template-columns:1fr!important;}
  body.home-page .project-card{height:345px!important;aspect-ratio:auto!important;}
}

/* v172: viewport proportion refinements
   - Keeps project claims on one desktop line when possible and aligns side rules.
   - Makes About hero smaller by height so intro text is visible on normal laptop/desktop viewports.
   - Keeps About HOME/WORK buttons centered on the ABOUT ILU title artwork.
   - Adds 45px left margin to Home thumbnail text and scales typography down on narrower desktop windows. */
@media (min-width:761px){
  body.home-page .project-overlay{
    left:45px!important;
    right:clamp(24px, 3vw, 46px)!important;
    bottom:clamp(18px, 3vw, 40px)!important;
    max-width:calc(100% - 90px)!important;
  }
  body.home-page .project-overlay b{
    font-size:clamp(20px, min(2.35vw, 5.6svh), 38px)!important;
    line-height:1.02!important;
  }
  body.home-page .project-overlay em{
    font-size:clamp(17px, min(1.85vw, 4.6svh), 30px)!important;
    line-height:1.04!important;
  }

  body.about-page .about-hero{
    min-height:100svh!important;
    height:auto!important;
    padding:clamp(10px, 2svh, 24px) 0 clamp(22px, 3.4svh, 44px)!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:flex-start!important;
    overflow:visible!important;
    box-sizing:border-box!important;
  }
  body.about-page .about-media{
    display:block!important;
    width:fit-content!important;
    max-width:calc(100vw - 64px)!important;
    margin:0 auto clamp(12px, 1.8svh, 20px)!important;
    padding:0!important;
    line-height:0!important;
    position:relative!important;
  }
  body.about-page .about-media .about-image,
  body.about-page .about-image{
    display:block!important;
    width:auto!important;
    max-width:calc(100vw - 64px)!important;
    max-height:clamp(520px, 68svh, 720px)!important;
    height:auto!important;
    margin:0 auto!important;
    transform:none!important;
    object-fit:contain!important;
    object-position:center top!important;
  }
  body.about-page .about-media .about-home-link,
  body.about-page .about-media .about-work-link{
    display:block!important;
    visibility:visible!important;
    pointer-events:auto!important;
    width:clamp(84px, 11.9%, 134px)!important;
    min-width:0!important;
    max-width:134px!important;
    height:auto!important;
    top:79.8%!important;
    transform:translate(-50%, -50%)!important;
    z-index:20!important;
  }
  body.about-page .about-media .about-home-link{left:20.5%!important;}
  body.about-page .about-media .about-work-link{left:79.5%!important;}
  body.about-page .about-intro{
    width:min(760px, calc(100vw - 56px))!important;
    max-width:760px!important;
    margin:0 auto!important;
    transform:none!important;
    font-size:clamp(25px, min(2.05vw, 4.15svh), 39px)!important;
    line-height:1.06!important;
  }

  body.project-body-class.project-page .project-hero + .project-body .claim,
  .project-page-main .project-hero + .project-body .claim{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:clamp(18px, 2.4vw, 34px)!important;
    width:min(1220px, calc(100vw - 80px))!important;
    max-width:1220px!important;
    margin-top:calc(-1 * clamp(66px, 9.6svh, 106px))!important;
    margin-bottom:clamp(58px, 8svh, 92px)!important;
    font-size:clamp(23px, min(1.85vw, 4.4svh), 34px)!important;
    line-height:1.05!important;
  }
  body.project-body-class.project-page .project-hero + .project-body .claim em,
  .project-page-main .project-hero + .project-body .claim em{
    display:block!important;
    white-space:nowrap!important;
    flex:0 1 auto!important;
    max-width:calc(100vw - 260px)!important;
    line-height:1.05!important;
  }
  body.project-body-class.project-page .project-hero + .project-body .claim span,
  .project-page-main .project-hero + .project-body .claim span{
    display:block!important;
    flex:1 1 64px!important;
    min-width:42px!important;
    max-width:92px!important;
    height:3px!important;
    align-self:center!important;
  }
}

@media (min-width:761px) and (max-width:1180px){
  body.home-page .project-overlay b{
    font-size:clamp(19px, 2.55vw, 30px)!important;
  }
  body.home-page .project-overlay em{
    font-size:clamp(16px, 2.05vw, 24px)!important;
  }
  body.project-body-class.project-page .project-hero + .project-body .claim,
  .project-page-main .project-hero + .project-body .claim{
    width:min(1060px, calc(100vw - 56px))!important;
    gap:clamp(14px, 2vw, 24px)!important;
    font-size:clamp(22px, 2.35vw, 29px)!important;
  }
  body.project-body-class.project-page .project-hero + .project-body .claim em,
  .project-page-main .project-hero + .project-body .claim em{
    max-width:calc(100vw - 190px)!important;
  }
  body.project-body-class.project-page .project-hero + .project-body .claim span,
  .project-page-main .project-hero + .project-body .claim span{
    max-width:72px!important;
    min-width:34px!important;
  }
}

@media (min-width:761px) and (max-height:760px){
  body.about-page .about-hero{
    padding-top:clamp(6px, 1.2svh, 14px)!important;
  }
  body.about-page .about-media{
    margin-bottom:clamp(8px, 1.3svh, 14px)!important;
  }
  body.about-page .about-media .about-image,
  body.about-page .about-image{
    max-height:clamp(430px, 62svh, 620px)!important;
  }
  body.about-page .about-media .about-home-link,
  body.about-page .about-media .about-work-link{
    width:clamp(72px, 11.4%, 116px)!important;
    top:79.8%!important;
  }
  body.about-page .about-intro{
    font-size:clamp(22px, min(2.15vw, 4.2svh), 32px)!important;
    line-height:1.06!important;
  }
}

@media (min-width:761px) and (max-height:580px){
  body.about-page .about-media .about-image,
  body.about-page .about-image{
    max-height:clamp(330px, 58svh, 460px)!important;
  }
  body.about-page .about-intro{
    font-size:clamp(19px, min(2.1vw, 4svh), 27px)!important;
    line-height:1.05!important;
  }
  body.project-body-class.project-page .project-hero + .project-body .claim,
  .project-page-main .project-hero + .project-body .claim{
    margin-top:-58px!important;
    font-size:clamp(20px, 2.05vw, 25px)!important;
  }
}

@media (max-width:760px){
  body.project-body-class.project-page .project-hero + .project-body .claim em,
  .project-page-main .project-hero + .project-body .claim em{
    white-space:normal!important;
  }
}

/* v176: About desktop fold + project claim correction
   - About: larger/stabler hero artwork so only the first intro lines appear above the fold.
   - About buttons: moved down to align with the ABOUT ILU title instead of sitting on top of it.
   - About content: extra separation before Experience.
   - Project claim: single-line desktop claim with side rules aligned to the text baseline area. */
@media (min-width:761px){
  body.about-page .about-hero{
    min-height:100svh!important;
    height:auto!important;
    padding:clamp(8px, 1.6svh, 22px) 0 0!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:flex-start!important;
    overflow:visible!important;
    box-sizing:border-box!important;
  }
  @supports (min-height:100dvh){
    body.about-page .about-hero{min-height:100dvh!important;}
  }
  body.about-page .about-media{
    display:block!important;
    width:fit-content!important;
    max-width:calc(100vw - 64px)!important;
    margin:0 auto clamp(12px, 1.8svh, 22px)!important;
    padding:0!important;
    position:relative!important;
    line-height:0!important;
    transform:none!important;
  }
  body.about-page .about-media .about-image,
  body.about-page .about-image{
    display:block!important;
    width:auto!important;
    max-width:calc(100vw - 64px)!important;
    max-height:clamp(560px, 78svh, 760px)!important;
    height:auto!important;
    margin:0 auto!important;
    transform:none!important;
    object-fit:contain!important;
    object-position:center top!important;
  }
  body.about-page .about-media .about-home-link,
  body.about-page .about-media .about-work-link{
    display:block!important;
    visibility:visible!important;
    pointer-events:auto!important;
    width:clamp(82px, 11.4%, 126px)!important;
    min-width:0!important;
    max-width:126px!important;
    height:auto!important;
    top:84.4%!important;
    transform:translate(-50%, -50%)!important;
    z-index:30!important;
  }
  body.about-page .about-media .about-home-link{left:20.5%!important;}
  body.about-page .about-media .about-work-link{left:79.5%!important;}
  body.about-page .about-media .about-home-link img,
  body.about-page .about-media .about-work-link img{
    display:block!important;
    width:100%!important;
    height:auto!important;
    max-width:none!important;
  }
  body.about-page .about-intro{
    width:min(760px, calc(100vw - 56px))!important;
    max-width:760px!important;
    margin:0 auto clamp(76px, 9svh, 128px)!important;
    transform:none!important;
    font-size:clamp(28px, min(2.15vw, 4.6svh), 39px)!important;
    line-height:1.08!important;
    text-align:center!important;
  }
  body.about-page .about-content{
    padding-top:clamp(68px, 9svh, 120px)!important;
  }
}

@media (min-width:761px) and (max-height:760px){
  body.about-page .about-media .about-image,
  body.about-page .about-image{
    max-height:clamp(440px, 74svh, 640px)!important;
  }
  body.about-page .about-media .about-home-link,
  body.about-page .about-media .about-work-link{
    top:84.4%!important;
    width:clamp(76px, 11.2%, 116px)!important;
  }
  body.about-page .about-intro{
    font-size:clamp(26px, min(2.18vw, 4.8svh), 34px)!important;
    line-height:1.08!important;
    margin-bottom:clamp(76px, 10svh, 112px)!important;
  }
}

@media (min-width:761px) and (max-height:580px){
  body.about-page .about-media .about-image,
  body.about-page .about-image{
    max-height:clamp(365px, 72svh, 500px)!important;
  }
  body.about-page .about-media .about-home-link,
  body.about-page .about-media .about-work-link{
    width:clamp(68px, 11%, 104px)!important;
    top:84.2%!important;
  }
  body.about-page .about-intro{
    font-size:clamp(24px, min(2.2vw, 5svh), 30px)!important;
    line-height:1.07!important;
    margin-bottom:88px!important;
  }
}

@media (min-width:761px){
  body.project-body-class.project-page .project-hero + .project-body .claim,
  .project-page-main .project-hero + .project-body .claim{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:clamp(16px, 2.2vw, 32px)!important;
    width:min(1320px, calc(100vw - 88px))!important;
    max-width:1320px!important;
    margin-top:calc(-1 * clamp(66px, 9.6svh, 106px))!important;
    margin-bottom:clamp(58px, 8svh, 92px)!important;
    padding:0!important;
    font-size:clamp(22px, min(1.55vw, 4.1svh), 31px)!important;
    line-height:1.02!important;
    text-align:center!important;
    box-sizing:border-box!important;
  }
  body.project-body-class.project-page .project-hero + .project-body .claim em,
  .project-page-main .project-hero + .project-body .claim em{
    display:block!important;
    flex:0 1 auto!important;
    min-width:0!important;
    max-width:none!important;
    white-space:nowrap!important;
    line-height:1.02!important;
    margin:0!important;
    padding:0!important;
  }
  body.project-body-class.project-page .project-hero + .project-body .claim span,
  .project-page-main .project-hero + .project-body .claim span{
    display:block!important;
    flex:1 1 72px!important;
    min-width:44px!important;
    max-width:104px!important;
    height:3px!important;
    align-self:center!important;
    margin-top:.08em!important;
  }
}

@media (min-width:761px) and (max-width:1180px){
  body.project-body-class.project-page .project-hero + .project-body .claim,
  .project-page-main .project-hero + .project-body .claim{
    width:min(1120px, calc(100vw - 52px))!important;
    gap:clamp(10px, 1.6vw, 20px)!important;
    font-size:clamp(20px, 2vw, 25px)!important;
  }
  body.project-body-class.project-page .project-hero + .project-body .claim span,
  .project-page-main .project-hero + .project-body .claim span{
    min-width:28px!important;
    max-width:72px!important;
  }
}

@media (min-width:761px) and (max-width:900px){
  body.project-body-class.project-page .project-hero + .project-body .claim,
  .project-page-main .project-hero + .project-body .claim{
    width:calc(100vw - 36px)!important;
    gap:10px!important;
    font-size:20px!important;
  }
  body.project-body-class.project-page .project-hero + .project-body .claim span,
  .project-page-main .project-hero + .project-body .claim span{
    min-width:18px!important;
    max-width:42px!important;
  }
}

/* v176: final alignment pass
   - About desktop overlay buttons: opened outwards and lowered slightly so they sit centred with ABOUT ILU without touching the title.
   - Project claim: true centred 3-column grid so the italic text and side rules stay centred as a group. */
@media (min-width:761px){
  body.about-page .about-media .about-home-link,
  body.about-page .about-media .about-work-link{
    top:86.1%!important;
    width:clamp(82px, 11.4%, 126px)!important;
    transform:translate(-50%, -50%)!important;
  }
  body.about-page .about-media .about-home-link{left:17.7%!important;}
  body.about-page .about-media .about-work-link{left:82.3%!important;}

  body.project-body-class.project-page .project-hero + .project-body .claim,
  .project-page-main .project-hero + .project-body .claim{
    display:grid!important;
    grid-template-columns:minmax(42px, 1fr) auto minmax(42px, 1fr)!important;
    align-items:center!important;
    justify-items:center!important;
    justify-content:center!important;
    column-gap:clamp(16px, 2.2vw, 32px)!important;
    width:min(1320px, calc(100vw - 88px))!important;
    max-width:1320px!important;
    margin-left:auto!important;
    margin-right:auto!important;
    text-align:center!important;
  }
  body.project-body-class.project-page .project-hero + .project-body .claim em,
  .project-page-main .project-hero + .project-body .claim em{
    grid-column:2!important;
    justify-self:center!important;
    white-space:nowrap!important;
    margin:0!important;
    max-width:none!important;
  }
  body.project-body-class.project-page .project-hero + .project-body .claim span,
  .project-page-main .project-hero + .project-body .claim span{
    display:block!important;
    width:clamp(44px, 6.4vw, 104px)!important;
    min-width:0!important;
    max-width:none!important;
    height:3px!important;
    margin-top:.08em!important;
    align-self:center!important;
  }
  body.project-body-class.project-page .project-hero + .project-body .claim span:first-child,
  .project-page-main .project-hero + .project-body .claim span:first-child{
    grid-column:1!important;
    justify-self:end!important;
  }
  body.project-body-class.project-page .project-hero + .project-body .claim span:last-child,
  .project-page-main .project-hero + .project-body .claim span:last-child{
    grid-column:3!important;
    justify-self:start!important;
  }
}

@media (min-width:761px) and (max-height:760px){
  body.about-page .about-media .about-home-link,
  body.about-page .about-media .about-work-link{
    top:86.1%!important;
    width:clamp(76px, 11.2%, 116px)!important;
  }
  body.about-page .about-media .about-home-link{left:17.7%!important;}
  body.about-page .about-media .about-work-link{left:82.3%!important;}
}

@media (min-width:761px) and (max-height:580px){
  body.about-page .about-media .about-home-link,
  body.about-page .about-media .about-work-link{
    top:86%!important;
    width:clamp(68px, 11%, 104px)!important;
  }
}

@media (min-width:761px) and (max-width:1180px){
  body.project-body-class.project-page .project-hero + .project-body .claim,
  .project-page-main .project-hero + .project-body .claim{
    grid-template-columns:minmax(28px, 1fr) auto minmax(28px, 1fr)!important;
    width:min(1120px, calc(100vw - 52px))!important;
    column-gap:clamp(10px, 1.6vw, 20px)!important;
  }
  body.project-body-class.project-page .project-hero + .project-body .claim span,
  .project-page-main .project-hero + .project-body .claim span{
    width:clamp(28px, 5.2vw, 72px)!important;
  }
}

@media (min-width:761px) and (max-width:900px){
  body.project-body-class.project-page .project-hero + .project-body .claim,
  .project-page-main .project-hero + .project-body .claim{
    grid-template-columns:minmax(18px, 1fr) auto minmax(18px, 1fr)!important;
    width:calc(100vw - 36px)!important;
    column-gap:10px!important;
  }
  body.project-body-class.project-page .project-hero + .project-body .claim span,
  .project-page-main .project-hero + .project-body .claim span{
    width:clamp(18px, 4.7vw, 42px)!important;
  }
}

/* v176: project claim centring fix
   The claim lives inside .project-body, which is capped at 1140px. v176 gave the claim a larger viewport-based width,
   so when the claim became wider than its parent it overflowed to the right. Keep it constrained to the parent width. */
@media (min-width:761px){
  body.project-body-class.project-page .project-hero + .project-body .claim,
  .project-page-main .project-hero + .project-body .claim{
    width:100%!important;
    max-width:1140px!important;
    margin-left:auto!important;
    margin-right:auto!important;
    padding-left:0!important;
    padding-right:0!important;
    box-sizing:border-box!important;
    overflow:visible!important;
  }
}

@media (min-width:761px) and (max-width:1180px){
  body.project-body-class.project-page .project-hero + .project-body .claim,
  .project-page-main .project-hero + .project-body .claim{
    width:100%!important;
    max-width:100%!important;
  }
}

/* v176: About buttons opened further outwards
   - Keeps HOME / WORK centred vertically with ABOUT ILU.
   - Moves buttons farther from the ABOUT ILU artwork so they no longer sit on top of the title. */
@media (min-width:761px){
  body.about-page .about-media .about-home-link{
    left:12.6%!important;
    top:86.1%!important;
  }
  body.about-page .about-media .about-work-link{
    left:87.4%!important;
    top:86.1%!important;
  }
}

@media (min-width:761px) and (max-height:760px){
  body.about-page .about-media .about-home-link{
    left:12.4%!important;
    top:86.1%!important;
  }
  body.about-page .about-media .about-work-link{
    left:87.6%!important;
    top:86.1%!important;
  }
}

@media (min-width:761px) and (max-height:580px){
  body.about-page .about-media .about-home-link{
    left:12.2%!important;
    top:86%!important;
  }
  body.about-page .about-media .about-work-link{
    left:87.8%!important;
    top:86%!important;
  }
}

/* v177: board media, gallery row of 4, smaller flip, email copy tooltip, About spacing/date style */
.copy-email-link{position:relative!important;cursor:pointer!important}
.copy-email-link::before{content:attr(data-copy-label)!important;position:absolute!important;left:50%!important;bottom:calc(100% + 10px)!important;transform:translate(-50%,4px)!important;z-index:60!important;padding:7px 10px!important;border-radius:999px!important;background:rgba(14,14,18,.86)!important;color:#fff!important;font-family:Arial,sans-serif!important;font-size:12px!important;font-weight:800!important;line-height:1!important;letter-spacing:0!important;white-space:nowrap!important;opacity:0!important;pointer-events:none!important;transition:opacity .15s ease,transform .15s ease!important;box-shadow:0 14px 34px rgba(0,0,0,.26)!important;text-transform:none!important}
.copy-email-link:hover::before,.copy-email-link:focus-visible::before{opacity:1!important;transform:translate(-50%,0)!important}
.home-page .side-email.copy-email-link::before{left:50%!important;top:-34px!important;bottom:auto!important;transform:translate(-50%,4px)!important;font-size:12px!important;color:#fff!important;background:rgba(14,14,18,.86)!important}
.home-page .side-email.copy-email-link:hover::before,.home-page .side-email.copy-email-link:focus-visible::before{transform:translate(-50%,0)!important}

body.project-body-class.project-page .project-board,
.project-page-main .project-board{width:100%!important;max-width:1140px!important;margin:0 auto 68px!important;padding:0!important;border:0!important;line-height:0!important;box-sizing:border-box!important}
body.project-body-class.project-page .project-board img,
.project-page-main .project-board img{display:block!important;width:100%!important;max-width:100%!important;height:auto!important;margin:0!important;border:0!important;border-radius:0!important;box-shadow:none!important}

body.project-body-class.project-page .gallery-four-row,
.project-page-main .gallery-four-row{display:flex!important;width:100%!important;gap:2%!important;align-items:flex-start!important;justify-content:space-between!important;box-sizing:border-box!important}
body.project-body-class.project-page .gallery-four-row.count-1,
body.project-body-class.project-page .gallery-four-row.count-2,
body.project-body-class.project-page .gallery-four-row.count-3,
.project-page-main .gallery-four-row.count-1,
.project-page-main .gallery-four-row.count-2,
.project-page-main .gallery-four-row.count-3{justify-content:center!important}
body.project-body-class.project-page .gallery-four-row > *,
.project-page-main .gallery-four-row > *{flex:0 0 23.5%!important;width:23.5%!important;max-width:23.5%!important;margin:0!important;box-sizing:border-box!important;align-self:flex-start!important}

body.project-body-class.project-page .gallery-stack > .flip-card-block,
.project-page-main .gallery-stack > .flip-card-block,
body.project-body-class.project-page .flip-card-block,
.project-page-main .flip-card-block{width:100%!important;max-width:100%!important;align-self:stretch!important;margin-left:auto!important;margin-right:auto!important;text-align:center!important}
body.project-body-class.project-page .flip-card-block .flip-card,
.project-page-main .flip-card-block .flip-card{width:60%!important;max-width:60%!important;margin-left:auto!important;margin-right:auto!important;display:block!important}
body.project-body-class.project-page .flip-card-block > img.flip-hover-icon,
.project-page-main .flip-card-block > img.flip-hover-icon{width:42px!important;min-width:42px!important;max-width:42px!important}
body.project-body-class.project-page .flip-card-block > img.flip-touch,
.project-page-main .flip-card-block > img.flip-touch{width:58px!important;min-width:58px!important;max-width:58px!important}

body.about-page .about-content{width:min(1140px, calc(100vw - 90px))!important;max-width:1140px!important;margin-left:auto!important;margin-right:auto!important;box-sizing:border-box!important}
body.about-page .about-role .about-period{font-size:24px!important;font-style:italic!important;font-weight:400!important;line-height:1!important;letter-spacing:-.02em!important}

@media(max-width:760px){
  body.project-body-class.project-page .project-board,
  .project-page-main .project-board{width:calc(100vw - 40px)!important;max-width:560px!important;margin:0 auto 48px!important}
  body.project-body-class.project-page .gallery-four-row,
  .project-page-main .gallery-four-row{flex-direction:column!important;gap:28px!important}
  body.project-body-class.project-page .gallery-four-row > *,
  .project-page-main .gallery-four-row > *{width:100%!important;max-width:100%!important;flex-basis:100%!important}
  body.project-body-class.project-page .flip-card-block .flip-card,
  .project-page-main .flip-card-block .flip-card{width:60%!important;max-width:60%!important}
  body.project-body-class.project-page .flip-card-block > img.flip-touch,
  .project-page-main .flip-card-block > img.flip-touch{width:42px!important;min-width:42px!important;max-width:42px!important}
  body.about-page .about-content{width:calc(100vw - 40px)!important;max-width:560px!important;margin-left:auto!important;margin-right:auto!important;padding-left:0!important;padding-right:0!important}
  body.about-page .about-role .about-period{font-size:15px!important;font-style:italic!important;font-weight:400!important}
}

/* v178: flip sizing, email tooltip tracking, gallery row-of-4 fit, mobile about alignment */
.copy-email-link::before,
.home-page .side-email.copy-email-link::before{display:none!important;content:none!important}
.copy-email-tooltip{position:fixed;left:0;top:0;z-index:9999;padding:8px 11px;border-radius:999px;background:#111318;color:#fff;font:800 12px/1 Arial,sans-serif;pointer-events:none;white-space:nowrap;box-shadow:0 16px 34px rgba(0,0,0,.30);opacity:0;transform:translateY(4px);transition:opacity .12s ease,transform .12s ease}
.copy-email-tooltip.is-visible{opacity:1;transform:translateY(0)}
.copy-email-link.copy-email-mobile-feedback{position:relative!important}
.copy-email-link.copy-email-mobile-feedback::after{content:'Copied!'!important;position:absolute!important;left:50%!important;bottom:calc(100% + 10px)!important;transform:translateX(-50%)!important;padding:7px 10px!important;border-radius:999px!important;background:#111318!important;color:#fff!important;font:800 12px/1 Arial,sans-serif!important;white-space:nowrap!important;z-index:70!important;box-shadow:0 16px 34px rgba(0,0,0,.30)!important}
@media (hover:none), (pointer:coarse){
  .copy-email-tooltip{display:none!important}
  .copy-email-link:hover::after,
  .copy-email-link:focus-visible::after{display:none!important;content:none!important}
}

body.project-body-class.project-page .gallery-four-row,
.project-page-main .gallery-four-row{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:20px!important;align-items:start!important;justify-content:stretch!important;overflow:hidden!important}
body.project-body-class.project-page .gallery-four-row.count-1,
body.project-body-class.project-page .gallery-four-row.count-2,
body.project-body-class.project-page .gallery-four-row.count-3,
.project-page-main .gallery-four-row.count-1,
.project-page-main .gallery-four-row.count-2,
.project-page-main .gallery-four-row.count-3{grid-template-columns:repeat(var(--gallery-count,4), minmax(0,1fr))!important;justify-content:stretch!important}
body.project-body-class.project-page .gallery-four-row.count-1,
.project-page-main .gallery-four-row.count-1{grid-template-columns:minmax(0,1fr)!important}
body.project-body-class.project-page .gallery-four-row.count-2,
.project-page-main .gallery-four-row.count-2{grid-template-columns:repeat(2,minmax(0,1fr))!important}
body.project-body-class.project-page .gallery-four-row.count-3,
.project-page-main .gallery-four-row.count-3{grid-template-columns:repeat(3,minmax(0,1fr))!important}
body.project-body-class.project-page .gallery-four-row > *,
.project-page-main .gallery-four-row > *,
body.project-body-class.project-page .gallery-four-row > *.is-vertical-media,
.project-page-main .gallery-four-row > *.is-vertical-media{width:100%!important;max-width:100%!important;min-width:0!important;flex:none!important;margin:0!important;align-self:start!important}
body.project-body-class.project-page .gallery-four-row iframe,
.project-page-main .gallery-four-row iframe,
body.project-body-class.project-page .gallery-four-row video,
.project-page-main .gallery-four-row video,
body.project-body-class.project-page .gallery-four-row img,
.project-page-main .gallery-four-row img{width:100%!important;max-width:100%!important}

@media(min-width:761px){
  body.project-body-class.project-page .gallery-stack > .flip-card-block,
  .project-page-main .gallery-stack > .flip-card-block,
  body.project-body-class.project-page .flip-card-block,
  .project-page-main .flip-card-block{width:100%!important;max-width:100%!important}
  body.project-body-class.project-page .flip-card-block .flip-card,
  .project-page-main .flip-card-block .flip-card{width:min(60%,460px)!important;max-width:460px!important;margin-left:auto!important;margin-right:auto!important;display:block!important;transform:none!important}
}
@media(max-width:760px){
  body.project-body-class.project-page .flip-card-block .flip-card,
  .project-page-main .flip-card-block .flip-card{width:min(72vw,340px)!important;max-width:340px!important}
}

@media(max-width:760px){
  body.project-body-class.project-page .gallery-four-row,
  .project-page-main .gallery-four-row{grid-template-columns:1fr!important;gap:28px!important}
  body.about-page .about-media{width:calc(100vw - 40px)!important;max-width:430px!important;margin:0 auto 16px!important;padding:0!important;display:block!important;transform:none!important}
  body.about-page .about-media .about-image,
  body.about-page .about-image{display:block!important;width:100%!important;max-width:100%!important;height:auto!important;margin-left:auto!important;margin-right:auto!important;left:auto!important;right:auto!important;transform:none!important;object-position:center top!important}
}

/* v179: follow-up fixes */
.copy-email-tooltip{background:var(--pink)!important;color:#fff!important}
@media (hover:none), (pointer:coarse){
  .copy-email-tooltip{display:block!important}
}

/* Mobile copy feedback now uses fixed tooltip, so remove pseudo fallback */
.copy-email-link.copy-email-mobile-feedback::after{display:none!important;content:none!important}

/* Smaller flip card again */
@media(min-width:761px){
  body.project-body-class.project-page .flip-card-block .flip-card,
  .project-page-main .flip-card-block .flip-card{width:min(42%,320px)!important;max-width:320px!important}
}
@media(max-width:760px){
  body.project-body-class.project-page .flip-card-block .flip-card,
  .project-page-main .flip-card-block .flip-card{width:min(64vw,260px)!important;max-width:260px!important}
}

/* Row of 4 should match row-of-2 spacing and fill the row */
body.project-body-class.project-page .gallery-four-row,
.project-page-main .gallery-four-row{display:flex!important;flex-wrap:nowrap!important;align-items:flex-start!important;justify-content:flex-start!important;gap:2%!important;width:100%!important;max-width:100%!important;overflow:visible!important;box-sizing:border-box!important}
body.project-body-class.project-page .gallery-four-row > *,
.project-page-main .gallery-four-row > *{flex:0 0 calc((100% - 6%) / 4)!important;width:calc((100% - 6%) / 4)!important;max-width:calc((100% - 6%) / 4)!important;min-width:0!important;margin:0!important}
body.project-body-class.project-page .gallery-four-row > .video,
.project-page-main .gallery-four-row > .video,
body.project-body-class.project-page .gallery-four-row > .gallery-embed,
.project-page-main .gallery-four-row > .gallery-embed,
body.project-body-class.project-page .gallery-four-row > img,
.project-page-main .gallery-four-row > img,
body.project-body-class.project-page .gallery-four-row > video,
.project-page-main .gallery-four-row > video{flex:0 0 calc((100% - 6%) / 4)!important;width:calc((100% - 6%) / 4)!important;max-width:calc((100% - 6%) / 4)!important}
body.project-body-class.project-page .gallery-four-row.count-1 > *,
.project-page-main .gallery-four-row.count-1 > *{flex-basis:100%!important;width:100%!important;max-width:100%!important}
body.project-body-class.project-page .gallery-four-row.count-2 > *,
.project-page-main .gallery-four-row.count-2 > *{flex-basis:49%!important;width:49%!important;max-width:49%!important}
body.project-body-class.project-page .gallery-four-row.count-3 > *,
.project-page-main .gallery-four-row.count-3 > *{flex-basis:32%!important;width:32%!important;max-width:32%!important}
@media(max-width:760px){
  body.project-body-class.project-page .gallery-four-row,
  .project-page-main .gallery-four-row{flex-direction:column!important;gap:28px!important}
  body.project-body-class.project-page .gallery-four-row > *,
  .project-page-main .gallery-four-row > *{flex-basis:100%!important;width:100%!important;max-width:100%!important}
}

/* About mobile image spacing */
@media(max-width:760px){
  body.about-page .about-media{margin:0 auto 24px!important}
  body.about-page .about-content{margin-top:0!important}
}


/* v181: email feedback, related slider 16:9, flip gap, 4-up fit */
.copy-email-tooltip{background:var(--pink)!important;color:#fff!important}
@media (hover:none), (pointer:coarse){
  .copy-email-tooltip{display:block!important}
  .copy-email-link::before,
  .copy-email-link::after{display:none!important;content:none!important}
}
html body.project-body-class.project-page .related,
html .project-page-main .related{padding-top:0!important}
html body.project-body-class.project-page .related-card,
html body.project-body-class.project-page .related-card.is-mobile-related-visible,
html body.project-body-class.project-page .related-card.is-mobile-related-hidden,
html .project-page-main .related-card,
html .project-page-main .related-card.is-mobile-related-visible,
html .project-page-main .related-card.is-mobile-related-hidden{aspect-ratio:16/9!important;height:auto!important}
@media(min-width:761px){
  body.project-body-class.project-page .gallery-stack > .flip-card-block:last-child,
  .project-page-main .gallery-stack > .flip-card-block:last-child{margin-bottom:0!important}
  body.project-body-class.project-page .gallery-four-row,
  .project-page-main .gallery-four-row{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:20px!important;width:100%!important;max-width:100%!important;align-items:start!important;justify-content:stretch!important;overflow:visible!important;box-sizing:border-box!important}
  body.project-body-class.project-page .gallery-four-row > *,
  .project-page-main .gallery-four-row > *{width:100%!important;max-width:100%!important;min-width:0!important;flex:none!important;margin:0!important;align-self:start!important}
  body.project-body-class.project-page .gallery-four-row img,
  .project-page-main .gallery-four-row img,
  body.project-body-class.project-page .gallery-four-row video,
  .project-page-main .gallery-four-row video,
  body.project-body-class.project-page .gallery-four-row iframe,
  .project-page-main .gallery-four-row iframe{display:block!important;width:100%!important;max-width:100%!important;height:auto!important}
}


/* v182: row-of-4 fills each column completely */
@media(min-width:761px){
  body.project-body-class.project-page .gallery-four-row > .flip-card-block,
  .project-page-main .gallery-four-row > .flip-card-block{width:100%!important;max-width:100%!important;min-width:0!important;margin:0!important}
  body.project-body-class.project-page .gallery-four-row > .flip-card-block .flip-card,
  .project-page-main .gallery-four-row > .flip-card-block .flip-card{width:100%!important;max-width:100%!important;min-width:0!important;margin:0!important;display:block!important;transform:none!important}
  body.project-body-class.project-page .gallery-four-row > .flip-card-block .flip-card-inner,
  .project-page-main .gallery-four-row > .flip-card-block .flip-card-inner,
  body.project-body-class.project-page .gallery-four-row > .flip-card-block img.flip-front,
  body.project-body-class.project-page .gallery-four-row > .flip-card-block img.flip-back,
  .project-page-main .gallery-four-row > .flip-card-block img.flip-front,
  .project-page-main .gallery-four-row > .flip-card-block img.flip-back{width:100%!important;max-width:100%!important;min-width:0!important}
}


/* v183: row-of-4 vertical media must fill each column, not inherit the 2-up vertical width */
@media(min-width:761px){
  body.project-body-class.project-page .gallery-stack .gallery-four-row,
  .project-page-main .gallery-stack .gallery-four-row{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:20px!important;width:100%!important;max-width:100%!important;box-sizing:border-box!important;align-items:start!important}
  body.project-body-class.project-page .gallery-stack .gallery-four-row > *,
  .project-page-main .gallery-stack .gallery-four-row > *{width:100%!important;max-width:100%!important;min-width:0!important;flex:none!important;margin:0!important;box-sizing:border-box!important}
  body.project-body-class.project-page .gallery-stack .gallery-four-row > img.is-vertical-media,
  .project-page-main .gallery-stack .gallery-four-row > img.is-vertical-media,
  body.project-body-class.project-page .gallery-stack .gallery-four-row > video.is-vertical-media,
  .project-page-main .gallery-stack .gallery-four-row > video.is-vertical-media,
  body.project-body-class.project-page .gallery-stack .gallery-four-row > .gallery-media.is-vertical-media,
  .project-page-main .gallery-stack .gallery-four-row > .gallery-media.is-vertical-media,
  body.project-body-class.project-page .gallery-stack .gallery-four-row > .gallery-embed.is-vertical-media,
  .project-page-main .gallery-stack .gallery-four-row > .gallery-embed.is-vertical-media{flex:0 0 100%!important;width:100%!important;max-width:100%!important;min-width:0!important;margin:0!important;align-self:start!important}
  body.project-body-class.project-page .gallery-stack .gallery-four-row > img,
  .project-page-main .gallery-stack .gallery-four-row > img,
  body.project-body-class.project-page .gallery-stack .gallery-four-row > video,
  .project-page-main .gallery-stack .gallery-four-row > video{display:block!important;width:100%!important;max-width:100%!important;height:auto!important;object-fit:contain!important}
}


/* v185: mobile-specific project hero image with desktop fallback */
@media(max-width:760px){
  body.project-body-class.project-page .project-hero.project-hero-v106 .project-hero-bg,
  .project-page-main .project-hero.project-hero-v106 .project-hero-bg{
    background-image:linear-gradient(rgba(7,7,7,.15), rgba(7,7,7,.15)), var(--hero-bg-mobile, var(--hero-bg))!important;
  }
  body.project-body-class.project-page .project-hero.project-hero-v106.project-hero-mobile-fade-strong .project-hero-bg,
  .project-page-main .project-hero.project-hero-v106.project-hero-mobile-fade-strong .project-hero-bg{
    background-image:linear-gradient(rgba(7,7,7,.12), rgba(7,7,7,.12)), var(--hero-bg-mobile, var(--hero-bg))!important;
  }
}


/* v186: Download CV underline offset */
body.about-page .cv-link a{
  text-underline-offset:.15em!important;
  text-decoration-skip-ink:none!important;
}

/* v192: correction over v191 requested public fixes
   - Home desktop logo max-width 1000px.
   - About years no longer italic.
   - Project gallery vertical rhythm reduced to 24px.
   - Mobile About hero image/text lifted 50px, arrow anchored to screen bottom.
   - Mobile flip-card block no longer adds extra margin after the component. */
@media (min-width:761px){
  body.home-page .hero-logo{
    max-width:1000px!important;
  }
}

body.about-page .about-role .about-period,
body.about-page .about-period,
body.about-page .about-role > span,
body.about-page .about-section:nth-of-type(2) .about-role > span{
  font-style:normal!important;
}

body.project-body-class.project-page .gallery-stack,
.project-page-main .gallery-stack{
  gap:24px!important;
}
body.project-body-class.project-page .gallery-two-row,
.project-page-main .gallery-two-row,
body.project-body-class.project-page .video-grid-vertical,
.project-page-main .video-grid-vertical{
  row-gap:24px!important;
}
body.project-body-class.project-page .gallery .slaughter-gif-grid,
.project-page-main .gallery .slaughter-gif-grid{
  gap:24px 2%!important;
}

@media (max-width:760px){
  body.about-page .about-hero{
    min-height:100svh!important;
    height:100svh!important;
    padding-top:56px!important;
    padding-bottom:96px!important;
    overflow:hidden!important;
  }
  body.about-page .about-scroll-arrow{
    position:absolute!important;
    left:50%!important;
    top:auto!important;
    bottom:calc(env(safe-area-inset-bottom, 0px) + 18px)!important;
    transform:translateX(-50%)!important;
    margin:0!important;
  }
  body.project-body-class.project-page .gallery-stack > .flip-card-block,
  .project-page-main .gallery-stack > .flip-card-block,
  body.project-body-class.project-page .gallery-stack .flip-card-block,
  .project-page-main .gallery-stack .flip-card-block{
    margin-bottom:0!important;
  }
}

/* v193: About mobile lift + visible bottom arrow
   - About mobile hero content starts 20px higher than v192.
   - About mobile scroll arrow is lifted away from the iPhone browser bottom edge. */
@media (max-width:760px){
  body.about-page .about-hero{
    padding-top:36px!important;
  }
  body.about-page .about-scroll-arrow{
    bottom:calc(env(safe-area-inset-bottom, 0px) + 58px)!important;
  }
}

/* v194: About mobile arrow/text fine tuning
   - Arrow lifted 20px more from v193.
   - About intro text reduced by 1px on mobile. */
@media (max-width:760px){
  body.about-page .about-scroll-arrow{
    bottom:calc(env(safe-area-inset-bottom, 0px) + 78px)!important;
  }
  body.about-page .about-intro{
    font-size:clamp(21px, calc(5.8vw - 1px), 25px)!important;
  }
}

/* v195: mobile-only project hero edge blend
   - Keeps desktop untouched.
   - Adds a narrow blur/blend strip exactly on the mobile hero/body boundary so the cover image fades into the page background without a visible hard cut. */
@media (max-width:760px){
  body.project-body-class.project-page .project-hero.project-hero-v106::after,
  .project-page-main .project-hero.project-hero-v106::after{
    content:''!important;
    display:block!important;
    position:absolute!important;
    left:0!important;
    right:0!important;
    bottom:-1px!important;
    height:46px!important;
    z-index:4!important;
    pointer-events:none!important;
    opacity:1!important;
    background:linear-gradient(
      to bottom,
      rgba(7,7,7,0) 0%,
      rgba(7,7,7,.36) 34%,
      rgba(7,7,7,.76) 66%,
      #070707 100%
    )!important;
    filter:blur(7px)!important;
    transform:translateY(7px)!important;
  }
}


/* v196: mobile project body top background blend
   Desktop untouched.
   - Neutralizes the v195 hero edge-strip patch and leaves the existing hero fade layers untouched.
   - Removes the hard top edge from the project-body background by making the section transparent on mobile.
   - Adds a separate fade layer behind the content only, so text/media positions stay unchanged. */
@media (max-width:760px){
  body.project-body-class.project-page .project-hero.project-hero-v106::before,
  body.project-body-class.project-page .project-hero.project-hero-v106::after,
  .project-page-main .project-hero.project-hero-v106::before,
  .project-page-main .project-hero.project-hero-v106::after{
    content:none!important;
    display:none!important;
    background:none!important;
    height:auto!important;
    inset:auto!important;
    opacity:0!important;
    filter:none!important;
    transform:none!important;
    -webkit-mask-image:none!important;
    mask-image:none!important;
  }

  body.project-body-class.project-page .project-page-main{
    background:#070707 var(--black-texture) center top/auto repeat!important;
  }

  body.project-body-class.project-page .project-body,
  .project-page-main > .project-body{
    background:transparent!important;
    position:relative!important;
    overflow:visible!important;
    isolation:isolate!important;
  }

  body.project-body-class.project-page .project-body::before,
  .project-page-main > .project-body::before{
    content:''!important;
    display:block!important;
    position:absolute!important;
    left:0!important;
    right:0!important;
    top:-64px!important;
    bottom:0!important;
    height:auto!important;
    z-index:0!important;
    pointer-events:none!important;
    background:#070707 var(--black-texture) center top/auto repeat!important;
    -webkit-mask-image:linear-gradient(
      to bottom,
      rgba(0,0,0,0) 0%,
      rgba(0,0,0,.16) 20px,
      rgba(0,0,0,.54) 54px,
      #000 96px
    )!important;
    mask-image:linear-gradient(
      to bottom,
      rgba(0,0,0,0) 0%,
      rgba(0,0,0,.16) 20px,
      rgba(0,0,0,.54) 54px,
      #000 96px
    )!important;
    -webkit-mask-size:100% 100%!important;
    mask-size:100% 100%!important;
    -webkit-mask-repeat:no-repeat!important;
    mask-repeat:no-repeat!important;
  }

  body.project-body-class.project-page .project-body > *,
  .project-page-main > .project-body > *{
    position:relative!important;
    z-index:1!important;
  }
}


/* v197: stronger mobile project body top blend
   Desktop untouched.
   Keeps all layout positions unchanged and removes the remaining visible seam by fading a solid base and the texture layer upward before the section starts. */
@media (max-width:760px){
  body.project-body-class.project-page .project-body,
  .project-page-main > .project-body{
    background:transparent!important;
    position:relative!important;
    overflow:visible!important;
    isolation:isolate!important;
  }

  body.project-body-class.project-page .project-body::before,
  .project-page-main > .project-body::before{
    content:''!important;
    display:block!important;
    position:absolute!important;
    left:0!important;
    right:0!important;
    top:-220px!important;
    bottom:0!important;
    height:auto!important;
    z-index:0!important;
    pointer-events:none!important;
    background:linear-gradient(
      to bottom,
      rgba(7,7,7,0) 0,
      rgba(7,7,7,.04) 34px,
      rgba(7,7,7,.18) 78px,
      rgba(7,7,7,.44) 126px,
      rgba(7,7,7,.76) 174px,
      #070707 220px
    )!important;
    -webkit-mask-image:none!important;
    mask-image:none!important;
    -webkit-mask-size:auto!important;
    mask-size:auto!important;
  }

  body.project-body-class.project-page .project-body::after,
  .project-page-main > .project-body::after{
    content:''!important;
    display:block!important;
    position:absolute!important;
    left:0!important;
    right:0!important;
    top:-220px!important;
    bottom:0!important;
    height:auto!important;
    z-index:0!important;
    pointer-events:none!important;
    background:var(--black-texture) center top/auto repeat!important;
    -webkit-mask-image:linear-gradient(
      to bottom,
      rgba(0,0,0,0) 0,
      rgba(0,0,0,.02) 40px,
      rgba(0,0,0,.12) 92px,
      rgba(0,0,0,.38) 144px,
      rgba(0,0,0,.74) 190px,
      #000 236px
    )!important;
    mask-image:linear-gradient(
      to bottom,
      rgba(0,0,0,0) 0,
      rgba(0,0,0,.02) 40px,
      rgba(0,0,0,.12) 92px,
      rgba(0,0,0,.38) 144px,
      rgba(0,0,0,.74) 190px,
      #000 236px
    )!important;
    -webkit-mask-size:100% 100%!important;
    mask-size:100% 100%!important;
    -webkit-mask-repeat:no-repeat!important;
    mask-repeat:no-repeat!important;
  }

  body.project-body-class.project-page .project-body > *,
  .project-page-main > .project-body > *{
    position:relative!important;
    z-index:1!important;
  }
}

/* v198: iPhone-only Denver tracking correction
   Keeps desktop and Android untouched. iOS/WebKit creates a wider faux-bold rendering for Denver Regular used as bold; this compact letter-spacing only on iPhone-sized touch WebKit screens. */
@supports (-webkit-touch-callout: none){
  @media (max-width:760px) and (hover:none) and (pointer:coarse){
    :root{
      --ilu-denver-display-letter-spacing:-.035em;
    }

    body.about-page .about-section h2,
    body.about-page .about-content .about-section h2,
    body.about-page .cv-link a,
    body.home-page .project-overlay em,
    body.home-page .footer .footer-contact > strong,
    body.home-page .footer-video .footer-contact > strong,
    body.about-page .footer .footer-contact > span,
    body.about-page .footer .footer-contact > strong,
    body.project-body-class.project-page .project-title-wrap p,
    .project-page-main .project-title-wrap p,
    body.project-body-class.project-page .awards h3,
    .project-page-main .awards h3,
    body.project-body-class.project-page .awards .awards-title-denver,
    .project-page-main .awards .awards-title-denver,
    body.project-body-class.project-page .gallery h2,
    .project-page-main .gallery h2,
    body.project-body-class.project-page .related h2,
    .project-page-main .related h2,
    body.project-body-class.project-page .related-copy em,
    .project-page-main .related-copy em,
    body.project-body-class.project-page .footer .footer-contact > span,
    body.project-body-class.project-page .footer .footer-contact > strong,
    body.project-body-class.project-page .footer-black .footer-contact > span,
    body.project-body-class.project-page .footer-black .footer-contact > strong,
    body.project-body-class.project-page .footer-transparent .footer-contact > span,
    body.project-body-class.project-page .footer-transparent .footer-contact > strong,
    .project-page-main + .footer .footer-contact > span,
    .project-page-main + .footer .footer-contact > strong,
    .project-page-main + .footer-black .footer-contact > span,
    .project-page-main + .footer-black .footer-contact > strong,
    .project-page-main + .footer-transparent .footer-contact > span,
    .project-page-main + .footer-transparent .footer-contact > strong{
      letter-spacing:-.035em!important;
    }
  }
}

/* v202: desktop project image lightbox */
@media (min-width:761px) and (hover:hover) and (pointer:fine){
  body.project-body-class.project-page .project-board img,
  .project-page-main .project-board img,
  body.project-body-class.project-page .gallery-stack > img,
  .project-page-main .gallery-stack > img,
  body.project-body-class.project-page .gallery-two-row > img,
  .project-page-main .gallery-two-row > img,
  body.project-body-class.project-page .gallery-four-row > img,
  .project-page-main .gallery-four-row > img{
    cursor:zoom-in;
  }
}

.project-lightbox{
  position:fixed;
  inset:0;
  z-index:9999;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:28px 40px 96px;
  background:rgba(7,7,7,.94);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .22s ease, visibility 0s linear .22s;
  cursor:default;
}

.project-lightbox.is-open{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transition:opacity .22s ease, visibility 0s;
}

.project-lightbox__stage{
  position:relative;
  width:100%;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  user-select:none;
  touch-action:none;
  cursor:default;
}

.project-lightbox__image{
  display:block;
  width:auto;
  height:auto;
  max-width:calc(100vw - 80px);
  max-height:calc(100svh - 132px);
  object-fit:contain;
  transform:translate3d(var(--lb-x, 0px), var(--lb-y, 0px), 0) scale(var(--lb-scale, 1));
  transform-origin:center center;
  transition:transform .18s ease, opacity .18s ease;
  box-shadow:0 24px 80px rgba(0,0,0,.42);
  cursor:default;
}

.project-lightbox.is-zoomed .project-lightbox__image{
  cursor:grab;
}

.project-lightbox.is-dragging .project-lightbox__image{
  cursor:grabbing;
  transition:none;
}

.project-lightbox__close,
.project-lightbox__button,
.project-lightbox__download{
  appearance:none;
  border:0;
  background:rgba(255,255,255,.92);
  color:#070707;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:44px;
  height:44px;
  border-radius:999px;
  cursor:pointer;
  text-decoration:none;
  box-shadow:0 10px 30px rgba(0,0,0,.22);
  transition:transform .16s ease, background .16s ease, opacity .16s ease;
}

.project-lightbox__close:hover,
.project-lightbox__button:not(:disabled):hover,
.project-lightbox__download:hover{
  transform:translateY(-1px);
  background:#fff;
}

.project-lightbox__button:disabled{
  background:rgba(170,170,170,.56);
  color:rgba(20,20,20,.46);
  cursor:default;
  box-shadow:none;
  opacity:1;
  transform:none;
}

.project-lightbox__close:focus-visible,
.project-lightbox__button:focus-visible,
.project-lightbox__download:focus-visible{
  outline:2px solid #fff;
  outline-offset:4px;
}

.project-lightbox__close[hidden],
.project-lightbox__button[hidden],
.project-lightbox__download[hidden]{
  display:none!important;
}

.project-lightbox__close{
  position:absolute;
  top:24px;
  right:24px;
  z-index:2;
}

.project-lightbox__toolbar{
  position:absolute;
  left:50%;
  bottom:24px;
  z-index:2;
  transform:translateX(-50%);
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  padding:10px 12px;
  border-radius:999px;
  background:rgba(255,255,255,.22);
  border:1px solid rgba(255,255,255,.28);
  box-shadow:0 18px 48px rgba(0,0,0,.28);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}

.project-lightbox__counter{
  min-width:58px;
  color:#fff;
  font-family:Nimbus, Arial, sans-serif;
  font-size:14px;
  font-weight:700;
  line-height:1;
  text-align:center;
  letter-spacing:.02em;
  font-variant-numeric:tabular-nums;
}

.project-lightbox__button.is-active{
  background:#e91e73;
  color:#fff;
}

.project-lightbox__button.is-active:not(:disabled):hover{
  background:#e91e73;
  color:#fff;
}

.project-lightbox svg{
  width:18px;
  height:18px;
  display:block;
  fill:currentColor;
}

@media (max-width:760px), (hover:none), (pointer:coarse){
  .project-lightbox{
    display:none!important;
  }

  body.project-body-class.project-page .project-board img,
  .project-page-main .project-board img,
  body.project-body-class.project-page .gallery img,
  .project-page-main .gallery img{
    cursor:auto!important;
  }
}

/* v204: BOOK gallery module visual/admin refinement */
body.project-body-class.project-page .gallery-stack > .book-card-block,
.project-page-main .gallery-stack > .book-card-block,
body.project-body-class.project-page .gallery-stack .book-card-block,
.project-page-main .gallery-stack .book-card-block{
  --book-page-w:390px;
  --book-open-duration:1.5s;
  --book-ease:cubic-bezier(0.16, 1, 0.3, 1);
  width:100%!important;
  max-width:100%!important;
  margin:0 auto 92px!important;
  text-align:center!important;
  perspective:2000px!important;
  overflow:visible!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  box-sizing:border-box!important;
}

body.project-body-class.project-page .book-card,
.project-page-main .book-card{
  appearance:none!important;
  border:0!important;
  background:transparent!important;
  padding:0!important;
  position:relative!important;
  display:block!important;
  width:var(--book-page-w)!important;
  max-width:var(--book-page-w)!important;
  aspect-ratio:659 / 870!important;
  height:auto!important;
  margin:0 auto!important;
  cursor:pointer!important;
  transform-style:preserve-3d!important;
  transition:transform var(--book-open-duration) var(--book-ease)!important;
  will-change:transform!important;
  overflow:visible!important;
  box-shadow:none!important;
  border-radius:0!important;
}

body.project-body-class.project-page .book-page,
.project-page-main .book-page{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  transform-style:preserve-3d!important;
  border-radius:4px 8px 8px 4px!important;
  background:#fff!important;
  display:block!important;
  overflow:hidden!important;
}

body.project-body-class.project-page .book-card img,
.project-page-main .book-card img{
  position:absolute!important;
  inset:0!important;
  display:block!important;
  width:100%!important;
  min-width:100%!important;
  max-width:none!important;
  height:100%!important;
  min-height:100%!important;
  max-height:none!important;
  object-fit:cover!important;
  object-position:center center!important;
  margin:0!important;
  border-radius:inherit!important;
  pointer-events:none!important;
  box-shadow:none!important;
  transform:none!important;
  backface-visibility:visible!important;
  -webkit-backface-visibility:visible!important;
}

body.project-body-class.project-page .book-page-right,
.project-page-main .book-page-right{
  z-index:1!important;
  box-shadow:inset 10px 0 20px rgba(0,0,0,.10)!important;
}

body.project-body-class.project-page .book-cover,
.project-page-main .book-cover{
  z-index:2!important;
  transform-origin:left center!important;
  transition:transform var(--book-open-duration) var(--book-ease)!important;
  transform-style:preserve-3d!important;
  background:transparent!important;
}

body.project-body-class.project-page .book-cover-front,
body.project-body-class.project-page .book-cover-back,
.project-page-main .book-cover-front,
.project-page-main .book-cover-back{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  display:block!important;
  backface-visibility:hidden!important;
  border-radius:2px 8px 8px 2px!important;
  transform:translateZ(1px)!important;
  will-change:transform!important;
  background:#fff!important;
  overflow:hidden!important;
}

body.project-body-class.project-page .book-cover-back,
.project-page-main .book-cover-back{
  transform:rotateY(180deg) translateZ(1px)!important;
}

body.project-body-class.project-page .book-hover-icon,
.project-page-main .book-hover-icon{
  display:block!important;
  width:100px!important;
  min-width:100px!important;
  max-width:100px!important;
  height:auto!important;
  margin:18px auto 0!important;
  opacity:1!important;
  visibility:visible!important;
}

body.project-body-class.project-page .book-touch,
.project-page-main .book-touch{
  display:none!important;
  width:42px!important;
  min-width:42px!important;
  max-width:42px!important;
  height:auto!important;
  margin:18px auto 0!important;
}

@media (hover:hover) and (pointer:fine){
  body.project-body-class.project-page .book-card:hover,
  body.project-body-class.project-page .book-card:focus-visible,
  .project-page-main .book-card:hover,
  .project-page-main .book-card:focus-visible{
    transform:translateX(50%)!important;
  }
  body.project-body-class.project-page .book-card:hover .book-cover,
  body.project-body-class.project-page .book-card:focus-visible .book-cover,
  .project-page-main .book-card:hover .book-cover,
  .project-page-main .book-card:focus-visible .book-cover{
    transform:rotateY(-160deg)!important;
  }
}

@media (max-width:760px), (hover:none), (pointer:coarse){
  body.project-body-class.project-page .gallery-stack > .book-card-block,
  .project-page-main .gallery-stack > .book-card-block,
  body.project-body-class.project-page .gallery-stack .book-card-block,
  .project-page-main .gallery-stack .book-card-block{
    width:100%!important;
    max-width:100%!important;
    margin:0 auto!important;
    overflow:visible!important;
  }

  body.project-body-class.project-page .book-card,
  .project-page-main .book-card{
    width:50%!important;
    max-width:50%!important;
    min-width:0!important;
    transform:none!important;
    transition:transform var(--book-open-duration) var(--book-ease)!important;
    cursor:pointer!important;
  }

  body.project-body-class.project-page .book-card:hover,
  .project-page-main .book-card:hover{
    transform:none!important;
  }

  body.project-body-class.project-page .book-card:hover .book-cover,
  .project-page-main .book-card:hover .book-cover{
    transform:none!important;
  }

  body.project-body-class.project-page .book-card.is-open,
  .project-page-main .book-card.is-open{
    transform:translateX(50%)!important;
  }

  body.project-body-class.project-page .book-card.is-open .book-cover,
  .project-page-main .book-card.is-open .book-cover{
    transform:rotateY(-160deg)!important;
  }

  body.project-body-class.project-page .book-hover-icon,
  .project-page-main .book-hover-icon{
    display:none!important;
  }

  body.project-body-class.project-page .book-touch,
  .project-page-main .book-touch{
    display:block!important;
  }
}


/* v204: keep BOOK inner page images independent from generic gallery image rules */
body.project-body-class.project-page .gallery-stack .book-card .book-page > img,
body.project-body-class.project-page .gallery-stack .book-card .book-cover-front > img,
body.project-body-class.project-page .gallery-stack .book-card .book-cover-back > img,
.project-page-main .gallery-stack .book-card .book-page > img,
.project-page-main .gallery-stack .book-card .book-cover-front > img,
.project-page-main .gallery-stack .book-card .book-cover-back > img{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  min-width:100%!important;
  max-width:none!important;
  height:100%!important;
  min-height:100%!important;
  max-height:none!important;
  object-fit:cover!important;
  object-position:center center!important;
  margin:0!important;
  flex:none!important;
  border-radius:inherit!important;
  backface-visibility:visible!important;
  -webkit-backface-visibility:visible!important;
}
body.project-body-class.project-page .gallery-stack .book-card-block > img.book-hover-icon,
.project-page-main .gallery-stack .book-card-block > img.book-hover-icon{
  width:100px!important;
  min-width:100px!important;
  max-width:100px!important;
  height:auto!important;
  max-height:none!important;
  margin:18px auto 0!important;
}
body.project-body-class.project-page .gallery-stack .book-card-block > img.book-touch,
.project-page-main .gallery-stack .book-card-block > img.book-touch{
  width:42px!important;
  min-width:42px!important;
  max-width:42px!important;
  height:auto!important;
  max-height:none!important;
  margin:18px auto 0!important;
}

/* v205: BOOK left page face fix */
body.project-body-class.project-page .gallery-stack .book-card .book-cover-front,
body.project-body-class.project-page .gallery-stack .book-card .book-cover-back,
.project-page-main .gallery-stack .book-card .book-cover-front,
.project-page-main .gallery-stack .book-card .book-cover-back,
body.project-body-class.project-page .gallery-stack .book-card .book-cover-front > img,
body.project-body-class.project-page .gallery-stack .book-card .book-cover-back > img,
.project-page-main .gallery-stack .book-card .book-cover-front > img,
.project-page-main .gallery-stack .book-card .book-cover-back > img{
  backface-visibility:hidden!important;
  -webkit-backface-visibility:hidden!important;
}
body.project-body-class.project-page .gallery-stack .book-card .book-cover-front,
.project-page-main .gallery-stack .book-card .book-cover-front{
  transform:translateZ(1px)!important;
}
body.project-body-class.project-page .gallery-stack .book-card .book-cover-back,
.project-page-main .gallery-stack .book-card .book-cover-back{
  transform:rotateY(180deg) translateZ(1px)!important;
}


/* v207: BOOK left page reliable render + same bottom spacing as Flip */
body.project-body-class.project-page .book-cover-back,
.project-page-main .book-cover-back{
  background-size:cover!important;
  background-position:center center!important;
  background-repeat:no-repeat!important;
}

body.project-body-class.project-page .gallery-stack .book-card .book-cover-back > img,
.project-page-main .gallery-stack .book-card .book-cover-back > img{
  opacity:0!important;
}

body.project-body-class.project-page .gallery-stack .book-card .book-cover-front,
.project-page-main .gallery-stack .book-card .book-cover-front{
  opacity:1!important;
  transition:opacity .01s linear 0s!important;
}

@media (hover:hover) and (pointer:fine){
  body.project-body-class.project-page .book-card:hover .book-cover-front,
  body.project-body-class.project-page .book-card:focus-visible .book-cover-front,
  .project-page-main .book-card:hover .book-cover-front,
  .project-page-main .book-card:focus-visible .book-cover-front{
    opacity:0!important;
    transition-delay:.55s!important;
  }
  body.project-body-class.project-page .gallery-stack > .book-card-block:last-child,
  .project-page-main .gallery-stack > .book-card-block:last-child{
    margin-bottom:0!important;
  }
}

@media (max-width:760px), (hover:none), (pointer:coarse){
  body.project-body-class.project-page .book-card.is-open .book-cover-front,
  .project-page-main .book-card.is-open .book-cover-front{
    opacity:0!important;
    transition-delay:.55s!important;
  }
  body.project-body-class.project-page .gallery-stack > .book-card-block,
  .project-page-main .gallery-stack > .book-card-block,
  body.project-body-class.project-page .gallery-stack .book-card-block,
  .project-page-main .gallery-stack .book-card-block{
    margin-bottom:0!important;
  }
}
/* v207 clean BOOK render override */
body.project-body-class.project-page .gallery-stack > .book-card-block,
.project-page-main .gallery-stack > .book-card-block,
body.project-body-class.project-page .gallery-stack .book-card-block,
.project-page-main .gallery-stack .book-card-block{
  --book-page-w:390px!important;
  --book-open-duration:1.5s!important;
  --book-ease:cubic-bezier(0.16,1,0.3,1)!important;
  width:100%!important;max-width:100%!important;margin:0 auto 92px!important;text-align:center!important;perspective:2000px!important;overflow:visible!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;box-sizing:border-box!important;
}
body.project-body-class.project-page .book-card,
.project-page-main .book-card{
  appearance:none!important;border:0!important;background:transparent!important;padding:0!important;position:relative!important;display:block!important;width:var(--book-page-w)!important;max-width:var(--book-page-w)!important;aspect-ratio:659/870!important;height:auto!important;margin:0 auto!important;cursor:default!important;transform-style:preserve-3d!important;transition:transform var(--book-open-duration) var(--book-ease)!important;will-change:transform!important;overflow:visible!important;box-shadow:none!important;border-radius:0!important;line-height:0!important;
}
body.project-body-class.project-page .book-page,
.project-page-main .book-page{
  position:absolute!important;top:0!important;left:0!important;right:auto!important;bottom:auto!important;width:100%!important;height:100%!important;transform-style:preserve-3d!important;border-radius:4px 8px 8px 4px!important;background:#fff!important;display:block!important;overflow:hidden!important;opacity:1!important;
}
body.project-body-class.project-page .book-page-right,
.project-page-main .book-page-right{z-index:1!important;box-shadow:inset 10px 0 20px rgba(0,0,0,.10)!important;}
body.project-body-class.project-page .book-cover,
.project-page-main .book-cover{z-index:2!important;transform-origin:left center!important;transition:transform var(--book-open-duration) var(--book-ease)!important;transform-style:preserve-3d!important;background:transparent!important;overflow:visible!important;}
body.project-body-class.project-page .book-cover-front,
body.project-body-class.project-page .book-cover-back,
.project-page-main .book-cover-front,
.project-page-main .book-cover-back{
  position:absolute!important;top:0!important;left:0!important;right:auto!important;bottom:auto!important;width:100%!important;height:100%!important;display:block!important;backface-visibility:hidden!important;-webkit-backface-visibility:hidden!important;border-radius:2px 8px 8px 2px!important;transform:translateZ(1px)!important;will-change:transform!important;background:#fff!important;background-image:none!important;overflow:hidden!important;opacity:1!important;
}
body.project-body-class.project-page .book-cover-back,
.project-page-main .book-cover-back{transform:rotateY(180deg) translateZ(1px)!important;}
body.project-body-class.project-page .gallery-stack .book-card .book-page > img,
body.project-body-class.project-page .gallery-stack .book-card .book-cover-front > img,
body.project-body-class.project-page .gallery-stack .book-card .book-cover-back > img,
.project-page-main .gallery-stack .book-card .book-page > img,
.project-page-main .gallery-stack .book-card .book-cover-front > img,
.project-page-main .gallery-stack .book-card .book-cover-back > img{
  position:static!important;display:block!important;width:100%!important;min-width:0!important;max-width:100%!important;height:100%!important;min-height:0!important;max-height:100%!important;object-fit:cover!important;object-position:center center!important;margin:0!important;flex:none!important;border-radius:inherit!important;pointer-events:none!important;box-shadow:none!important;transform:none!important;opacity:1!important;backface-visibility:visible!important;-webkit-backface-visibility:visible!important;
}
@media (hover:hover) and (pointer:fine){
  body.project-body-class.project-page .book-card:hover,
  body.project-body-class.project-page .book-card:focus-visible,
  .project-page-main .book-card:hover,
  .project-page-main .book-card:focus-visible{transform:translateX(50%)!important;}
  body.project-body-class.project-page .book-card:hover .book-cover,
  body.project-body-class.project-page .book-card:focus-visible .book-cover,
  .project-page-main .book-card:hover .book-cover,
  .project-page-main .book-card:focus-visible .book-cover{transform:rotateY(-160deg)!important;}
  body.project-body-class.project-page .gallery-stack > .book-card-block:last-child,
  .project-page-main .gallery-stack > .book-card-block:last-child{margin-bottom:0!important;}
}
@media (max-width:760px), (hover:none), (pointer:coarse){
  body.project-body-class.project-page .gallery-stack > .book-card-block,
  .project-page-main .gallery-stack > .book-card-block,
  body.project-body-class.project-page .gallery-stack .book-card-block,
  .project-page-main .gallery-stack .book-card-block{width:100%!important;max-width:100%!important;margin:0 auto 52px!important;overflow:visible!important;}
  body.project-body-class.project-page .book-card,
  .project-page-main .book-card{width:50%!important;max-width:50%!important;min-width:0!important;transform:none!important;transition:transform var(--book-open-duration) var(--book-ease)!important;cursor:default!important;}
  body.project-body-class.project-page .book-card:hover,
  .project-page-main .book-card:hover{transform:none!important;}
  body.project-body-class.project-page .book-card:hover .book-cover,
  .project-page-main .book-card:hover .book-cover{transform:none!important;}
  body.project-body-class.project-page .book-card.is-open,
  .project-page-main .book-card.is-open{transform:translateX(50%)!important;}
  body.project-body-class.project-page .book-card.is-open .book-cover,
  .project-page-main .book-card.is-open .book-cover{transform:rotateY(-160deg)!important;}
}
body.project-body-class.project-page .flip-card,
.project-page-main .flip-card{cursor:default!important;}
body.project-body-class.project-page .book-hover-icon,
.project-page-main .book-hover-icon{cursor:default!important;}

/* v209: mobile BOOK bottom spacing aligned with Flip/rest of projects before See other projects */
@media (max-width:760px), (hover:none), (pointer:coarse){
  body.project-body-class.project-page .gallery-stack > .book-card-block,
  .project-page-main .gallery-stack > .book-card-block,
  body.project-body-class.project-page .gallery-stack .book-card-block,
  .project-page-main .gallery-stack .book-card-block{
    margin-bottom:0!important;
  }
}