:root{--bg:#060606;--fg:#f5f5f2;--muted:#a7a7a2;--line:rgba(255,255,255,.16);--panel:rgba(255,255,255,.055);--ease:cubic-bezier(.2,.8,.2,1)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--fg);font-family:Arial,Helvetica,sans-serif;overflow-x:hidden}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit}#motion-bg{position:fixed;inset:0;width:100%;height:100%;z-index:-1;opacity:.45}.topbar{position:fixed;top:0;left:0;right:0;height:82px;padding:0 4vw;display:flex;align-items:center;justify-content:space-between;z-index:30;mix-blend-mode:difference}.brand{font-weight:700;font-size:20px;letter-spacing:-1px}.brand span{font-weight:400}.topbar nav{display:flex;gap:28px;font-size:13px}.topbar nav a{position:relative}.topbar nav a:after{content:"";position:absolute;left:0;right:100%;bottom:-5px;height:1px;background:#fff;transition:right .35s var(--ease)}.topbar nav a:hover:after{right:0}.icon-btn{width:44px;height:44px;border:1px solid rgba(255,255,255,.5);border-radius:50%;display:grid;place-items:center;transition:.35s var(--ease)}.icon-btn:hover{background:#fff;color:#000;transform:none}
.section-progress-hud{position:fixed;right:18px;top:108px;transform:none;z-index:35;display:flex;flex-direction:column;align-items:flex-end;gap:9px;padding:0;border:0;background:transparent;box-shadow:none;opacity:.48;transition:opacity .3s var(--ease)}.section-progress-hud:hover{opacity:.92}
.section-progress-label{display:flex;flex-direction:column;align-items:flex-end;gap:2px;text-transform:uppercase;color:#d8d8d1;min-width:88px;padding-right:1px}
.section-progress-kicker{font-size:8px;letter-spacing:.12em;color:#8f8f89}
.section-progress-title{font-size:8px;letter-spacing:.16em;color:#d8d8d1;white-space:nowrap}
.section-progress-bars{display:flex;flex-direction:column;align-items:flex-end;gap:7px}
.progress-segment{width:24px;height:2px;border-radius:999px;background:rgba(255,255,255,.22);overflow:hidden;position:relative;transition:width .28s var(--ease),background .28s var(--ease)}
.progress-segment-fill{display:block;height:100%;width:0%;border-radius:inherit;background:#fff;transition:width .25s var(--ease),opacity .25s var(--ease)}
.progress-segment.done{width:19px}
.progress-segment.done .progress-segment-fill{width:100%;opacity:.72}
.progress-segment.active{width:31px;background:rgba(255,255,255,.12)}
.progress-segment.active .progress-segment-fill{opacity:1}
html{scrollbar-width:none}
body::-webkit-scrollbar{display:none}
.section{position:relative;padding:120px max(7vw,92px) 120px 5vw}.eyebrow{font-size:12px;letter-spacing:.22em;color:var(--muted);margin-bottom:44px}.hero{height:100svh;min-height:760px;padding-top:130px;overflow:hidden}.hero-kicker{font-size:12px;letter-spacing:.2em;color:#d0d0cb}.hero-title{position:relative;z-index:3;font-weight:400;font-size:clamp(70px,11.5vw,190px);line-height:.78;letter-spacing:-.075em;margin:70px 0 0}.hero-title span{display:block}.hero-title .line-two{margin-left:12vw}.portrait-wrap{position:absolute;right:5vw;bottom:-3vh;width:min(39vw,620px);height:78vh;z-index:2;transform-origin:50% 90%;pointer-events:none}.portrait{position:absolute;z-index:2;inset:auto 0 0;width:100%;max-height:100%;object-fit:contain;filter:contrast(1.04) drop-shadow(0 22px 50px rgba(0,0,0,.28))}.portrait-halo{position:absolute;inset:14% 8% 8%;border:1px solid rgba(255,255,255,.26);border-radius:48% 48% 8% 8%;transform:rotate(-5deg);box-shadow:0 0 80px rgba(255,255,255,.04)}.hero-copy{position:absolute;left:5vw;bottom:13vh;max-width:540px;z-index:3}.hero-copy p{font-size:clamp(18px,2vw,28px);line-height:1.25;letter-spacing:-.03em}.hero-actions{display:flex;align-items:center;gap:28px;margin-top:32px}.pill{display:inline-flex;align-items:center;gap:38px;padding:17px 22px;border:1px solid rgba(255,255,255,.45);border-radius:999px;transition:.35s var(--ease);background:rgba(0,0,0,.15);backdrop-filter:blur(8px)}.pill i{font-style:normal;transition:.35s var(--ease)}.pill:hover{background:#fff;color:#000;box-shadow:0 12px 50px rgba(255,255,255,.12)}.pill:hover i{transform:translate(3px,-3px)}.text-link{font-size:14px;color:#c6c6c0}.text-link span{display:inline-block;transition:.35s}.text-link:hover span{transform:translateY(3px)}.hero-meta{position:absolute;right:5vw;top:120px;display:flex;gap:24px;font-size:11px;letter-spacing:.12em;color:#c8c8c2;z-index:4}.reveal{opacity:0;transform:translateY(18px);animation:reveal .8s var(--ease) forwards}.hero-kicker{animation-delay:.15s}.hero-copy{animation-delay:.3s}.hero-meta{animation-delay:.45s}@keyframes reveal{to{opacity:1;transform:none}}
.about{min-height:200vh}.about-grid{display:grid;grid-template-columns:1fr 1.15fr;gap:8vw}.about-sticky{position:sticky;top:40vh;height:70vh}.about h2,.work h2,.endorsements h2,.resources h2{font-size:clamp(54px,7vw,112px);line-height:.9;letter-spacing:-.065em;font-weight:400;margin:0}.about h2 em,.work h2 em,.endorsements h2 em,.resources h2 em{font-family:Georgia,serif;font-weight:400}.orbit-word{position:absolute;left:0;bottom:6vh;font-size:clamp(64px,10vw,150px);font-weight:700;letter-spacing:-.07em;color:transparent;-webkit-text-stroke:1px rgba(255,255,255,.18);transform:rotate(-8deg);transition:.5s var(--ease)}.chapters{padding-top:4vh}.chapter{min-height:auto;padding:6vh 0;border-top:1px solid var(--line);opacity:.28;transition:.45s}.chapter.active{opacity:1}.chapter span{font-size:12px;letter-spacing:.18em;color:var(--muted)}.chapter h3{font-size:clamp(38px,5vw,78px);letter-spacing:-.055em;margin:30px 0}.chapter p{max-width:680px;font-size:clamp(18px,1.7vw,26px);line-height:1.45;color:#cdcdc7}
.journey{padding-bottom:0}.journey-shell{position:relative}.journey-stage{position:sticky;top:0;height:100vh;display:grid;grid-template-columns:1.1fr .9fr;align-items:center;gap:8vw}.logo-card{width:min(48vw,680px);aspect-ratio:1.4;border:1px solid var(--line);border-radius:36px;display:grid;place-items:center;background:linear-gradient(145deg,rgba(255,255,255,.1),rgba(255,255,255,.02));box-shadow:inset 0 1px rgba(255,255,255,.12),0 30px 100px rgba(0,0,0,.45);perspective:800px;transition:.35s var(--ease)}.logo-card span{font-size:clamp(80px,13vw,180px);font-weight:700;letter-spacing:-.08em}.journey-info{align-self:center}.counter{font-size:13px;color:var(--muted);letter-spacing:.14em;margin-bottom:70px}.journey-copy{min-height:260px}.journey-copy .type{font-size:12px;letter-spacing:.17em;color:var(--muted)}.journey-copy h3{font-size:clamp(42px,5vw,78px);line-height:.95;letter-spacing:-.055em;margin:25px 0}.journey-copy p{font-size:18px;color:#bbb}.journey-progress{height:1px;background:var(--line);margin-top:70px}.journey-progress span{display:block;height:1px;background:#fff;width:12.5%;transition:.4s var(--ease)}.journey-scroll-space{height:800vh}
.work-header{display:grid;grid-template-columns:1.2fr .8fr;gap:8vw;align-items:end;margin-bottom:100px}.work-header p{font-size:20px;line-height:1.5;color:#bbb;max-width:520px}.case-study{padding:70px 0 130px;border-top:1px solid var(--line)}.case-label{font-size:13px;letter-spacing:.16em;color:var(--muted);margin-bottom:45px}.metrics{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.metric{position:relative;text-align:left;border:1px solid var(--line);border-radius:24px;padding:28px;background:var(--panel);cursor:pointer;min-height:180px;overflow:hidden;transition:.35s var(--ease)}.metric:before{content:"";position:absolute;inset:100% 0 0;background:#fff;transition:.35s var(--ease)}.metric>*{position:relative;z-index:1}.metric strong{display:block;font-size:clamp(40px,5vw,72px);letter-spacing:-.06em}.metric span{display:block;margin-top:10px;color:#bbb}.metric small{position:absolute;left:28px;bottom:20px;opacity:0;color:#111;transition:.35s}.metric:hover{color:#000;transform:translateY(-3px)}.metric:hover:before{inset:0}.metric:hover span{color:#222}.metric:hover small{opacity:1}.media-rail{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(240px,1fr);gap:18px;margin:48px 0;overflow:hidden}.media-rail img{width:100%;height:480px;object-fit:cover;border-radius:22px;transition:.5s var(--ease);filter:grayscale(.2)}.media-rail img:hover{transform:scale(1.02);filter:grayscale(0)}.reverse .media-rail{direction:rtl}.reverse .media-rail img{direction:ltr}
.project-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:18px}.project-card{position:relative;grid-column:span 5;min-height:430px;border-radius:26px;overflow:hidden;background:#111;transition:transform .3s var(--ease)}.project-card.large{grid-column:span 7;grid-row:span 2;min-height:880px}.project-card.wide{grid-column:span 12;min-height:540px}.project-card img{width:100%;height:100%;object-fit:cover;transition:.7s var(--ease);filter:brightness(.75)}.project-card:after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 35%,rgba(0,0,0,.88));}.project-card div{position:absolute;z-index:2;left:28px;right:28px;bottom:28px}.project-card span{font-size:11px;letter-spacing:.15em;color:#ccc}.project-card h3{font-size:clamp(34px,4vw,64px);letter-spacing:-.05em;margin:10px 0}.project-card b{display:inline-block;font-size:13px;font-weight:400;opacity:0;transition:opacity .3s var(--ease)}.project-card:hover{transform:translateY(-3px)}.project-card:hover img{transform:scale(1.02);filter:brightness(.55)}.project-card:hover b{opacity:1}
.endorsements{min-height:100vh}.tabs{display:flex;gap:8px;overflow:auto;margin-top:90px;padding-bottom:8px}.tab{border:1px solid var(--line);border-radius:999px;padding:16px 24px;background:transparent;white-space:nowrap;cursor:pointer;transition:.3s}.tab:hover,.tab.active{background:#fff;color:#000}.endorsements blockquote{font-family:Georgia,serif;font-size:clamp(32px,5vw,74px);line-height:1.08;letter-spacing:-.035em;margin:70px 0 0;max-width:1200px}.endorsement-panel{max-width:1200px}.endorsement-meta{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:28px;color:var(--muted);font-size:13px;letter-spacing:.03em}.endorsement-meta strong{color:#fff;font-weight:500}.endorsement-meta #quoteStatus{width:100%;color:#d6b87a}.resources{padding-top:170px;padding-bottom:170px;background:#efefea;color:#090909;border-radius:48px 48px 0 0}.resources-inner{display:grid;grid-template-columns:1fr 1fr;gap:8vw}.resources .eyebrow{color:#666}.resource-list{border-top:1px solid rgba(0,0,0,.18)}
.latest-section{margin-top:130px;padding-top:90px;border-top:1px solid rgba(0,0,0,.16)}
.latest-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:32px;margin-bottom:42px}.latest-heading h3{font-size:clamp(44px,6vw,92px);line-height:.92;letter-spacing:-.06em;font-weight:400;margin:0}.latest-heading h3 em{font-family:Georgia,serif;font-weight:400}.latest-profile-link{display:inline-flex;align-items:center;gap:18px;padding-bottom:8px;border-bottom:1px solid rgba(0,0,0,.35);font-size:13px}.latest-profile-link span{transition:.3s var(--ease)}.latest-profile-link:hover span{transform:translate(3px,-3px)}
.latest-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.latest-card{min-height:330px;display:flex;flex-direction:column;justify-content:space-between;padding:28px;border:1px solid rgba(0,0,0,.16);border-radius:24px;background:rgba(255,255,255,.36);transition:.35s var(--ease);overflow:hidden}.latest-card:hover{transform:translateY(-3px);background:#fff;box-shadow:0 18px 48px rgba(0,0,0,.07)}.latest-card-meta,.latest-card-footer{display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#666}.latest-card p{font-size:clamp(22px,2vw,34px);line-height:1.12;letter-spacing:-.035em;margin:42px 0}.latest-card-footer i{font-style:normal;font-size:18px;transition:.3s var(--ease)}.latest-card:hover .latest-card-footer i{transform:translate(3px,-3px)}.resource-row{display:grid;grid-template-columns:42px 1fr auto 28px;align-items:center;gap:22px;padding:28px 4px;border-bottom:1px solid rgba(0,0,0,.18);transition:.3s}.resource-row strong{font-size:24px}.resource-row em{font-size:13px;color:#666;font-style:normal}.resource-row i{font-style:normal;transition:.3s}.resource-row:hover{padding-left:4px}.resource-row:hover i{transform:translate(3px,-3px)}footer{display:flex;justify-content:space-between;padding:35px 5vw;background:#efefea;color:#666;font-size:12px}
@media(max-width:900px) and (hover:none) and (pointer:coarse){.topbar nav{display:none}.section-progress-hud{right:8px;top:94px;bottom:auto;left:auto;transform:none;padding:0;border-radius:0;opacity:.42}.section-progress-label{display:none}.section-progress-bars{gap:6px}.progress-segment{width:18px;height:2px}.progress-segment.done{width:14px}.progress-segment.active{width:23px}.hero{min-height:760px}.hero-title{font-size:17vw;margin-top:90px}.hero-title .line-two{margin-left:0}.portrait-wrap{right:-8vw;width:82vw;height:57vh}.hero-copy{bottom:8vh;max-width:80vw}.hero-copy p{font-size:19px}.hero-meta{display:none}.about-grid,.journey-stage,.work-header,.resources-inner{grid-template-columns:1fr}.section{padding-right:48px}.latest-heading{align-items:flex-start;flex-direction:column}.latest-grid{grid-template-columns:1fr}.latest-card{min-height:280px}.about-sticky{position:relative;top:auto;height:50vh}.about{min-height:auto}.orbit-word{bottom:0}.journey-stage{padding-top:120px;align-content:start}.logo-card{width:100%;border-radius:24px}.journey-info{padding-bottom:40px}.journey-scroll-space{height:700vh}.metrics{grid-template-columns:1fr 1fr}.media-rail{overflow:auto;scroll-snap-type:x mandatory}.media-rail img{height:380px;scroll-snap-align:start}.project-card,.project-card.large,.project-card.wide{grid-column:span 12;min-height:500px}.project-card.large{min-height:650px}.resources{border-radius:30px 30px 0 0}.resource-row{grid-template-columns:30px 1fr 24px}.resource-row em{display:none}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.section-progress-hud{backdrop-filter:none}*,*:before,*:after{animation:none!important;transition:none!important}}

.about{--about-title-size:clamp(71px,8.74vw,140px)}
.about h2{font-size:var(--about-title-size)}
.about h2 br{display:none}
.about h2 em{font-family:Arial,Helvetica,sans-serif;font-style:normal;font-weight:400;margin-left:.2em}
.about .orbit-word{position:relative;left:auto;bottom:auto;width:max-content;max-width:none;margin-top:.03em;font-family:Georgia,serif;font-style:italic;font-size:var(--about-title-size);font-weight:400;line-height:.9;letter-spacing:-.065em;white-space:nowrap;text-transform:capitalize;color:var(--fg);-webkit-text-stroke:0;transform:none!important;transition:opacity .35s var(--ease)}
@media(max-width:900px) and (hover:none) and (pointer:coarse){.about{--about-title-size:clamp(42px,12.5vw,71px)}.about-sticky{height:42vh}.about .orbit-word{bottom:auto;margin-top:.06em}}

/* Directional, scroll-only comet trail for the Journey marker. */
.journey-master-progress i{box-shadow:none!important;isolation:isolate}
.journey-master-progress i::before,.journey-master-progress i::after{content:"";position:absolute;top:50%;width:64px;height:31px;pointer-events:none;opacity:0;transition:opacity .1s ease;background-repeat:no-repeat;will-change:opacity,transform}
.journey-master-progress i::before{right:3px;transform:translateY(-50%);background-image:linear-gradient(90deg,transparent,rgba(255,255,255,.88)),linear-gradient(90deg,transparent,rgba(255,255,255,.72)),linear-gradient(90deg,transparent,rgba(255,255,255,.58)),linear-gradient(90deg,transparent,rgba(255,255,255,.46)),linear-gradient(90deg,transparent,rgba(255,255,255,.36)),linear-gradient(90deg,transparent,rgba(255,255,255,.3)),linear-gradient(90deg,transparent,rgba(255,255,255,.24)),linear-gradient(90deg,transparent,rgba(255,255,255,.2)),linear-gradient(90deg,transparent,rgba(255,255,255,.16)),linear-gradient(90deg,transparent,rgba(255,255,255,.12));background-size:58px 1px,39px 1px,51px 1px,27px 1px,44px 1px,17px 1px,24px 1px,12px 1px,8px 1px,5px 1px;background-position:right 0 top 3px,right 7px top 7px,right 2px top 11px,right 26px top 14px,right 5px top 18px,right 34px top 21px,right 12px top 24px,right 43px top 27px,right 27px top 1px,right 50px top 16px}
.journey-master-progress i::after{left:3px;transform:translateY(-50%);background-image:linear-gradient(90deg,rgba(255,255,255,.88),transparent),linear-gradient(90deg,rgba(255,255,255,.72),transparent),linear-gradient(90deg,rgba(255,255,255,.58),transparent),linear-gradient(90deg,rgba(255,255,255,.46),transparent),linear-gradient(90deg,rgba(255,255,255,.36),transparent),linear-gradient(90deg,rgba(255,255,255,.3),transparent),linear-gradient(90deg,rgba(255,255,255,.24),transparent),linear-gradient(90deg,rgba(255,255,255,.2),transparent),linear-gradient(90deg,rgba(255,255,255,.16),transparent),linear-gradient(90deg,rgba(255,255,255,.12),transparent);background-size:58px 1px,39px 1px,51px 1px,27px 1px,44px 1px,17px 1px,24px 1px,12px 1px,8px 1px,5px 1px;background-position:left 0 top 3px,left 7px top 7px,left 2px top 11px,left 26px top 14px,left 5px top 18px,left 34px top 21px,left 12px top 24px,left 43px top 27px,left 27px top 1px,left 50px top 16px}
.journey-master-progress.is-scrolling.direction-forward i::before,.journey-master-progress.is-scrolling.direction-backward i::after{opacity:var(--journey-airflow-opacity,.62);animation:none}
@media(prefers-reduced-motion:reduce){.journey-master-progress i::before,.journey-master-progress i::after{display:none}}


/* Balanced Journey wind trail: equal visual weight above and below the marker. */
.journey-master-progress i::before,.journey-master-progress i::after{
  width:68px;
  height:35px;
}
.journey-master-progress i::before{
  background-image:linear-gradient(90deg,transparent,rgba(255,255,255,.88)),linear-gradient(90deg,transparent,rgba(255,255,255,.7)),linear-gradient(90deg,transparent,rgba(255,255,255,.56)),linear-gradient(90deg,transparent,rgba(255,255,255,.42)),linear-gradient(90deg,transparent,rgba(255,255,255,.3)),linear-gradient(90deg,transparent,rgba(255,255,255,.2)),linear-gradient(90deg,transparent,rgba(255,255,255,.88)),linear-gradient(90deg,transparent,rgba(255,255,255,.7)),linear-gradient(90deg,transparent,rgba(255,255,255,.56)),linear-gradient(90deg,transparent,rgba(255,255,255,.42)),linear-gradient(90deg,transparent,rgba(255,255,255,.3)),linear-gradient(90deg,transparent,rgba(255,255,255,.2));
  background-size:62px 1px,45px 1px,34px 1px,24px 1px,14px 1px,7px 1px,62px 1px,45px 1px,34px 1px,24px 1px,14px 1px,7px 1px;
  background-position:right 0 top 2px,right 8px top 5px,right 3px top 8px,right 25px top 11px,right 39px top 14px,right 52px top 16px,right 0 bottom 2px,right 8px bottom 5px,right 3px bottom 8px,right 25px bottom 11px,right 39px bottom 14px,right 52px bottom 16px;
}
.journey-master-progress i::after{
  background-image:linear-gradient(90deg,rgba(255,255,255,.88),transparent),linear-gradient(90deg,rgba(255,255,255,.7),transparent),linear-gradient(90deg,rgba(255,255,255,.56),transparent),linear-gradient(90deg,rgba(255,255,255,.42),transparent),linear-gradient(90deg,rgba(255,255,255,.3),transparent),linear-gradient(90deg,rgba(255,255,255,.2),transparent),linear-gradient(90deg,rgba(255,255,255,.88),transparent),linear-gradient(90deg,rgba(255,255,255,.7),transparent),linear-gradient(90deg,rgba(255,255,255,.56),transparent),linear-gradient(90deg,rgba(255,255,255,.42),transparent),linear-gradient(90deg,rgba(255,255,255,.3),transparent),linear-gradient(90deg,rgba(255,255,255,.2),transparent);
  background-size:62px 1px,45px 1px,34px 1px,24px 1px,14px 1px,7px 1px,62px 1px,45px 1px,34px 1px,24px 1px,14px 1px,7px 1px;
  background-position:left 0 top 2px,left 8px top 5px,left 3px top 8px,left 25px top 11px,left 39px top 14px,left 52px top 16px,left 0 bottom 2px,left 8px bottom 5px,left 3px bottom 8px,left 25px bottom 11px,left 39px bottom 14px,left 52px bottom 16px;
}

/* Restore deployment trigger — portfolio snapshot eb1e8c4 */

/* Social-post carousels */
.social-showcase{width:100%;min-width:0;margin-top:48px}
.social-slider-head{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:18px}
.social-slider-head>span{color:var(--muted);font-size:11px;letter-spacing:.16em;text-transform:uppercase}
.social-slider-controls{display:flex;align-items:center;gap:8px}
.social-slider-count{min-width:58px;margin-right:8px;color:var(--muted);font-size:11px;letter-spacing:.12em}
.social-slider-count b{color:#fff;font-weight:500}
.social-slider-controls button{width:42px;height:42px;display:grid;place-items:center;border:1px solid var(--line);border-radius:50%;background:transparent;color:#fff;font-size:18px;cursor:pointer;transition:background .2s var(--ease),color .2s var(--ease),border-color .2s var(--ease)}
.social-slider-controls button:hover{background:#fff;color:#050505;border-color:#fff}
.social-slider-viewport{width:100vw;padding-block:12px;margin-block:-12px;margin-left:-4vw;overflow-x:auto;overflow-y:clip;overscroll-behavior-inline:contain;scroll-snap-type:x mandatory;scroll-padding-inline:0;scroll-behavior:smooth;scrollbar-width:none;outline:none;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 18px,#000 calc(100% - 18px),transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 18px,#000 calc(100% - 18px),transparent 100%)}
.social-slider-viewport::-webkit-scrollbar{display:none}
.social-slider-viewport:focus-visible{outline:1px solid rgba(255,255,255,.5);outline-offset:8px}
.social-slider-track{display:flex;width:max-content;gap:14px;padding:0 0 8px}
.social-post-slide{position:relative;height:clamp(264px,25.8vw,372px);flex:0 0 auto;margin:0;overflow:hidden;border-radius:14px;background:#fff;scroll-snap-align:start;scroll-snap-stop:always;transform:scale(1);transform-origin:center;transition:transform .24s var(--ease);will-change:transform}
.social-post-slide :is(img,video){display:block;width:auto;height:100%;max-width:none;object-fit:contain;user-select:none;-webkit-user-drag:none}
@media(hover:hover) and (pointer:fine){
  .social-post-slide:hover{z-index:2;transform:scale(1.07)}
}
@media(max-width:900px) and (hover:none) and (pointer:coarse){
  .social-showcase{width:100%}
  .social-slider-head{align-items:flex-end}
  .social-slider-head>span{max-width:130px;line-height:1.5}
  .social-slider-controls button{width:40px;height:40px}
  .social-post-slide{height:min(46vh,360px);max-height:calc(100vw - 110px)}
}
@media(max-width:620px) and (hover:none) and (pointer:coarse){.social-showcase{width:100%}}
@media(prefers-reduced-motion:reduce){
  .social-slider-viewport{scroll-behavior:auto}
  .social-post-slide{transition:none}
}


/* Case-study carousel and expandable presentation viewer */
.case-studies-gallery{padding-top:0;margin-top:0;border-top:0}
.case-studies-heading{display:grid;grid-template-columns:1.2fr .8fr;gap:8vw;align-items:end;margin-bottom:72px}
.case-studies-heading h2{font-size:clamp(54px,7vw,112px);line-height:.9;letter-spacing:-.065em;font-weight:400;margin:0}
.case-studies-heading h2 em{font-family:Georgia,serif;font-weight:400}
.case-studies-heading p{font-size:20px;line-height:1.5;color:#bbb;max-width:520px}
.case-study-showcase{border-top:0;padding-top:0}
.case-study-slider-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px;color:#aaa;font-size:11px;letter-spacing:.15em;text-transform:uppercase}
.case-study-slider-controls{display:flex;gap:8px}
.case-study-slider-controls button{width:42px;height:42px;border:1px solid var(--line);border-radius:50%;background:transparent;cursor:pointer;transition:.3s var(--ease)}
.case-study-slider-controls button:hover{background:#fff;color:#000}
.case-study-card-viewport{overflow-x:auto;scrollbar-width:none;scroll-snap-type:x mandatory;outline:none;padding:8px 0 18px}
.case-study-card-viewport::-webkit-scrollbar{display:none}
.case-study-card-track{display:flex;gap:16px;width:max-content}
.case-study-card{position:relative;width:clamp(330px,41vw,610px);aspect-ratio:16/9;padding:0;border:1px solid var(--line);border-radius:25px;overflow:hidden;background:#111;color:#fff;text-align:left;cursor:pointer;scroll-snap-align:start;isolation:isolate;transition:transform .35s var(--ease),border-color .35s var(--ease)}
.case-study-card:after{content:"";position:absolute;z-index:1;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.05) 20%,rgba(0,0,0,.9) 100%)}
.case-study-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(.8) brightness(.8);transition:transform .65s var(--ease),filter .4s var(--ease)}
.case-study-card-number{position:absolute;z-index:2;top:22px;right:22px;font-size:10px;letter-spacing:.15em}
.case-study-card-copy{position:absolute;z-index:2;left:25px;right:25px;bottom:25px;display:flex;flex-direction:column}
.case-study-card-copy small{font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:#ccc}
.case-study-card-copy strong{font-size:clamp(29px,3vw,48px);line-height:.96;letter-spacing:-.05em;margin:10px 0 22px}
.case-study-card-copy em{font-style:normal;font-size:12px;opacity:.72}
.case-study-card:hover,.case-study-card:focus-visible{transform:translateY(-5px);border-color:rgba(255,255,255,.55)}
.case-study-card:hover img,.case-study-card:focus-visible img{transform:scale(1.035);filter:saturate(1) brightness(.62)}
.presentation-viewer[hidden]{display:none}
.presentation-viewer{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:24px}
.presentation-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.88);backdrop-filter:blur(18px)}
.presentation-shell{position:relative;z-index:1;width:min(94vw,1500px);height:min(92vh,960px);display:grid;grid-template-rows:auto 1fr auto;padding:25px;border:1px solid rgba(255,255,255,.2);border-radius:28px;background:#090909;box-shadow:0 32px 120px rgba(0,0,0,.7);animation:presentationIn .35s var(--ease)}
@keyframes presentationIn{from{opacity:0;transform:scale(.975) translateY(12px)}}
.presentation-header{display:flex;justify-content:flex-end;align-items:center;height:44px;padding:0 2px 12px}
.presentation-close{width:44px;height:44px;border:1px solid var(--line);border-radius:50%;background:transparent;font-size:26px;line-height:1;cursor:pointer}
.presentation-close:hover{background:#fff;color:#000}
.presentation-stage{min-height:0;display:grid;grid-template-columns:50px minmax(0,1fr) 50px;align-items:center;gap:16px}
.presentation-arrow{width:48px;height:48px;border:1px solid var(--line);border-radius:50%;background:rgba(0,0,0,.45);cursor:pointer;transition:.25s var(--ease)}
.presentation-arrow:hover{background:#fff;color:#000}
.presentation-slide{position:relative;width:100%;height:100%;min-height:0;border:1px solid rgba(255,255,255,.28);border-radius:16px;overflow:hidden;background:#000;color:#101010}
.presentation-slide.is-loading:after{content:"Loading slide";position:absolute;inset:0;display:grid;place-items:center;color:#777;font-size:10px;letter-spacing:.14em;text-transform:uppercase;background:#080808}
.presentation-slide.is-loading .presentation-media{opacity:0}
.placeholder-slide{width:100%;height:100%;display:grid;grid-template-columns:1.1fr .9fr;align-items:end;padding:clamp(28px,5vw,76px);background:var(--slide-bg);color:var(--slide-fg)}
.placeholder-slide div{align-self:start;font-size:10px;letter-spacing:.18em;text-transform:uppercase}
.placeholder-slide h3{font-size:clamp(44px,7vw,112px);line-height:.82;letter-spacing:-.075em;margin:0;max-width:900px}
.placeholder-slide p{font-size:clamp(16px,1.65vw,25px);line-height:1.35;max-width:470px;margin:0 0 5px}
.presentation-footer{display:grid;grid-template-columns:auto minmax(100px,1fr) auto;align-items:center;gap:20px;padding:30px 2px 0;background:transparent;color:#888;font-size:10px;letter-spacing:.12em;text-transform:uppercase}
#presentationProject{text-align:right}
.presentation-progress{height:1px;background:var(--line)}
.presentation-progress i{display:block;height:100%;width:20%;background:#fff;transition:width .3s var(--ease)}
body.presentation-open{overflow:hidden}
@media(max-width:900px) and (hover:none) and (pointer:coarse){
  .case-studies-heading{grid-template-columns:1fr;gap:28px}
  .case-studies-heading h2{font-size:clamp(42px,12vw,68px)}
  .case-study-card{width:min(84vw,480px)}
  .presentation-viewer{padding:8px}
  .presentation-shell{width:100%;height:calc(100svh - 16px);padding:16px;border-radius:20px}
  .presentation-stage{grid-template-columns:1fr;position:relative}
  .presentation-arrow{position:absolute;z-index:2;bottom:12px}
  .presentation-prev{left:12px}.presentation-next{right:12px}
  .placeholder-slide{grid-template-columns:1fr;align-content:space-between;padding:28px 24px 76px}
  .placeholder-slide h3{font-size:clamp(38px,13vw,70px)}
  .presentation-footer{grid-template-columns:auto 1fr}
  .presentation-footer>span:last-child{display:none}
}


/* Actual case-study presentation media */
.presentation-slide{display:grid;place-items:center;background:#000}
.presentation-media{display:block;width:100%;height:100%;object-fit:contain;background:#000;opacity:1;transition:opacity .18s ease}


/* Proof section refinement: borderless subsections, count-up results and writing portfolio */
.work-header{margin-bottom:54px}
.work>.case-study{padding:36px 0 92px;border-top:0}
.work>.case-study+.case-study{padding-top:44px}
.social-showcase{margin-top:0}
.social-slider-head{display:grid;grid-template-columns:max-content minmax(360px,560px) max-content;align-items:center;justify-content:space-between;column-gap:clamp(22px,3vw,54px);margin-bottom:36px}
.metrics{display:grid;grid-template-columns:repeat(4,max-content);justify-content:center;gap:clamp(18px,2.2vw,34px);margin:0;padding:0;border:0}
.metric{min-height:0;padding:0;border:0;border-radius:0;background:transparent;color:#fff;text-align:center;cursor:pointer;overflow:visible}
.metric:before,.metric small{display:none}
.metric>*{position:static}
.metric strong{display:block;font-size:clamp(24px,2.5vw,38px);font-weight:500;line-height:.9;letter-spacing:-.05em;font-variant-numeric:tabular-nums}
.metric span{display:block;max-width:100px;margin-top:7px;color:var(--muted);font-size:9px;line-height:1.3;letter-spacing:.08em;text-transform:uppercase;white-space:normal}
.metric:hover{color:#fff;transform:none}
.metric:hover span{color:var(--muted)}
.writing-gallery{padding:34px 0 110px}
.writing-showcase{width:100%;min-width:0}
.writing-slider-head{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:18px;color:var(--muted);font-size:11px;letter-spacing:.15em;text-transform:uppercase}
.writing-slider-controls{display:flex;align-items:center;gap:8px}
.writing-slider-count{margin-right:8px}
.writing-slider-controls button{width:42px;height:42px;display:grid;place-items:center;border:1px solid var(--line);border-radius:50%;background:transparent;color:#fff;font-size:18px;cursor:pointer;transition:.25s var(--ease)}
.writing-slider-controls button:hover{background:#fff;color:#050505;border-color:#fff}
.writing-card-viewport{width:100vw;margin-left:-4vw;padding:8px 4vw 18px;overflow-x:auto;scrollbar-width:none;scroll-snap-type:x mandatory;outline:none}
.writing-card-viewport::-webkit-scrollbar{display:none}
.writing-card-viewport:focus-visible{outline:1px solid rgba(255,255,255,.45);outline-offset:-4px}
.writing-card-track{display:flex;width:max-content;gap:16px}
.writing-card{position:relative;width:clamp(330px,41vw,610px);aspect-ratio:16/9;display:flex;flex-direction:column;align-items:flex-start;padding:clamp(24px,3vw,42px);border:1px solid var(--line);border-radius:22px;background:linear-gradient(145deg,#171717,#0d0d0d);color:#fff;text-align:left;cursor:pointer;scroll-snap-align:start;overflow:hidden;transition:transform .3s var(--ease),border-color .3s var(--ease),background .3s var(--ease)}
.writing-card:after{content:"";position:absolute;width:180px;height:180px;right:-50px;bottom:-80px;border:1px solid rgba(255,255,255,.1);border-radius:50%}
.writing-card-number{position:absolute;top:clamp(24px,3vw,42px);right:clamp(24px,3vw,42px);color:var(--muted);font-size:10px;letter-spacing:.14em}
.writing-card-type{color:var(--muted);font-size:10px;letter-spacing:.16em;text-transform:uppercase}
.writing-card strong{max-width:80%;margin-top:auto;font-size:clamp(28px,3.2vw,48px);font-weight:500;line-height:.96;letter-spacing:-.045em}
.writing-card p{margin:12px 0 20px;color:#aaa;font-size:13px;line-height:1.45}
.writing-card em{font-style:normal;font-size:11px;letter-spacing:.06em}
.writing-card:hover,.writing-card:focus-visible{transform:translateY(-5px);border-color:rgba(255,255,255,.55);background:linear-gradient(145deg,#202020,#101010)}
.writing-viewer[hidden]{display:none}
.writing-viewer{position:fixed;inset:0;z-index:110;display:grid;place-items:center;padding:24px}
.writing-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.9);backdrop-filter:blur(18px)}
.writing-viewer-shell{position:relative;z-index:1;width:min(94vw,1180px);max-height:92vh;display:grid;grid-template-rows:auto minmax(0,1fr);padding:clamp(24px,4vw,54px);border:1px solid rgba(255,255,255,.2);border-radius:28px;background:#090909;box-shadow:0 32px 120px rgba(0,0,0,.72);animation:presentationIn .35s var(--ease);overflow:hidden}
.writing-viewer-header{display:flex;justify-content:space-between;align-items:flex-start;padding-bottom:30px;border-bottom:1px solid var(--line)}
.writing-viewer-header span{color:#888;font-size:9px;letter-spacing:.18em}
.writing-viewer-header h2{margin:7px 0 0;font-size:clamp(30px,4.5vw,68px);line-height:.95;letter-spacing:-.05em}
.writing-viewer-close{flex:0 0 auto;width:44px;height:44px;border:1px solid var(--line);border-radius:50%;background:transparent;color:#fff;font-size:26px;cursor:pointer}
.writing-viewer-close:hover{background:#fff;color:#000}
.writing-viewer-body{overflow-y:auto;padding:clamp(28px,5vw,68px) 0 20px}
.writing-viewer-body .writing-deck{width:100%;max-width:none;margin:0}
.writing-viewer-body .writing-meta{margin-bottom:32px;color:#888;font-size:11px;letter-spacing:.12em;text-transform:uppercase}
.writing-viewer-body .writing-lede{font-size:clamp(20px,2.3vw,31px);line-height:1.4;letter-spacing:-.02em;color:#ddd}
.writing-viewer-body p{font-size:clamp(16px,1.45vw,19px);line-height:1.75;color:#bbb}
body.writing-open{overflow:hidden}
@media(max-width:760px) and (hover:none) and (pointer:coarse){
  .work-header{margin-bottom:34px}
  .work>.case-study{padding:28px 0 70px}
  .social-slider-head{grid-template-columns:1fr auto;align-items:end;row-gap:22px}
  .social-slider-head>.metrics{grid-column:1 / -1;grid-row:2;grid-template-columns:repeat(4,minmax(0,1fr));width:100%;gap:14px;order:3}
  .metric strong{font-size:clamp(25px,8.5vw,38px)}
  .metric span{max-width:none;font-size:8px}
  .writing-gallery{padding:10px 0 78px}
  .writing-slider-head{align-items:flex-start}
  .writing-slider-count{display:none}
  .writing-card-viewport{margin-left:-5vw;padding-inline:5vw}
  .writing-card{width:min(84vw,480px)}
  .writing-viewer{padding:10px}
  .writing-viewer-shell{width:100%;max-height:96vh;padding:22px;border-radius:20px}
}


/* Selected writing: shared count and assignment context */
.writing-slider-count b{font:inherit;color:inherit}
.writing-section-label{
  margin:0 0 14px;
  color:#888;
  font-size:10px;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.writing-scenario{
  margin:0 0 clamp(38px,6vw,72px);
  padding:0 0 clamp(34px,5vw,58px);
  border-bottom:1px solid rgba(255,255,255,.16);
}
.writing-scenario .writing-lede{margin-bottom:0}
@media (max-width:760px) and (hover:none) and (pointer:coarse){
  .writing-slider-count{display:inline-flex}
}


/* Proof metrics and fitted presentation viewer */
@media (min-width:761px), (hover:hover) and (pointer:fine){
  .social-slider-head{
    grid-template-columns:max-content minmax(300px,1fr) max-content;
    align-items:end;
  }
  .metrics{
    align-self:end;
    align-items:end;
    gap:clamp(12px,1.45vw,24px);
  }
  .metric{
    display:flex;
    min-width:0;
    flex-direction:column;
    justify-content:flex-end;
    align-items:center;
  }
  .metric strong{
    font-size:clamp(32px,3.25vw,52px);
    line-height:.82;
  }
  .metric span{
    display:flex;
    align-items:flex-end;
    justify-content:center;
    min-height:2.6em;
    max-width:120px;
    margin-top:8px;
  }
}
.case-study-slider-head{
  justify-content:flex-end;
}
.presentation-shell{
  width:min(92vw,1320px);
  height:auto;
  max-height:94vh;
  grid-template-rows:auto auto auto;
}
.presentation-stage{
  min-height:0;
}
.presentation-slide{
  width:min(100%,calc((94vh - 170px) * 16 / 9));
  height:auto;
  aspect-ratio:16 / 9;
  justify-self:center;
}
.presentation-media{
  width:100%;
  height:100%;
  object-fit:contain;
}
@media(max-width:900px) and (hover:none) and (pointer:coarse){
  .presentation-shell{
    height:auto;
    max-height:calc(100svh - 16px);
  }
  .presentation-slide{
    width:100%;
    max-height:calc(100svh - 150px);
    aspect-ratio:16 / 9;
  }
}


/* Media-first presentation viewer: the deck fills the popup and controls float above it. */
.presentation-viewer{padding:clamp(8px,2vw,24px)}
.presentation-shell{
  position:relative;
  width:min(96vw,calc(90svh * 16 / 9),1600px);
  height:auto;
  max-height:90svh;
  aspect-ratio:16/9;
  display:block;
  padding:0;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.3);
  border-radius:clamp(12px,1.5vw,24px);
  background:#000;
}
.presentation-stage{position:absolute;inset:0;display:block;min-height:0}
.presentation-slide{position:absolute;inset:0;width:100%;height:100%;border:0;border-radius:0}
.presentation-media{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}
.presentation-header{display:none}
.presentation-overlay-control{
  position:absolute;
  z-index:5;
  color:rgba(255,255,255,.76);
  mix-blend-mode:difference;
}
.presentation-close{
  top:clamp(12px,1.7vw,26px);
  right:clamp(12px,1.7vw,26px);
  width:42px;
  height:42px;
  border:0;
  background:transparent;
  opacity:.72;
  font-size:32px;
  line-height:1;
  transition:opacity .25s var(--ease),transform .25s var(--ease);
}
.presentation-arrow{
  top:50%;
  width:clamp(42px,4vw,58px);
  height:clamp(42px,4vw,58px);
  margin-top:calc(clamp(42px,4vw,58px) / -2);
  border:0;
  background:transparent;
  opacity:.5;
  font-size:clamp(28px,3vw,46px);
  line-height:1;
  transition:opacity .25s var(--ease),transform .25s var(--ease);
}
.presentation-prev{left:clamp(8px,1.8vw,28px)}
.presentation-next{right:clamp(8px,1.8vw,28px)}
.presentation-close:hover,.presentation-close:focus-visible,
.presentation-arrow:hover,.presentation-arrow:focus-visible{
  background:transparent;
  color:rgba(255,255,255,.95);
  opacity:1;
}
.presentation-prev:hover,.presentation-prev:focus-visible{transform:translateX(-3px)}
.presentation-next:hover,.presentation-next:focus-visible{transform:translateX(3px)}
.presentation-footer{
  left:clamp(18px,2.4vw,38px);
  right:clamp(18px,2.4vw,38px);
  bottom:clamp(14px,2vw,30px);
  display:grid;
  grid-template-columns:auto minmax(80px,1fr) auto;
  gap:clamp(12px,2vw,28px);
  padding:0;
  border:0;
  background:transparent;
  color:rgba(255,255,255,.72);
  font-size:9px;
}
.presentation-progress{height:2px;background:rgba(255,255,255,.3)}
.presentation-progress i{background:#fff}
@media(max-width:900px) and (hover:none) and (pointer:coarse){
  .presentation-viewer{padding:8px}
  .presentation-shell{
    width:min(calc(100vw - 16px),calc((100svh - 16px) * 16 / 9));
    height:auto;
    max-height:calc(100svh - 16px);
    aspect-ratio:16/9;
    padding:0;
    border-radius:14px;
  }
  .presentation-stage{position:absolute;inset:0;display:block}
  .presentation-arrow{top:50%;bottom:auto}
  .presentation-prev{left:6px}
  .presentation-next{right:6px}
  .presentation-footer{grid-template-columns:auto minmax(60px,1fr) auto;left:14px;right:14px;bottom:12px;gap:10px}
  .presentation-footer>span:last-child{display:block;max-width:36vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
}


/* Quiet, asset-first navigation and Journey refinements. */
.section-progress-hud{
  transition:opacity .42s var(--ease);
}
.section-progress-hud.is-idle{
  opacity:0!important;
}
.section-progress-hud:focus-within{
  opacity:.92!important;
}
.journey-logo span{
  display:none!important;
}
.journey-logo img{
  opacity:0;
  transition:opacity .18s var(--ease);
}
.journey-logo.has-image img{
  opacity:1;
}
.journey-logo.has-image.logo-remove-white{
  background:transparent!important;
  padding:5px;
}
.journey-logo.has-image.logo-transparent{
  background:transparent!important;
}
@media (min-width:901px), (hover:hover) and (pointer:fine){
  .about-sticky{
    height:max-content;
  }
}


/* Presentation control inactivity, About-to-Journey spacing and video-ready state. */
.presentation-overlay-control{
  transition-property:opacity,transform,color;
  transition-duration:.32s;
  transition-timing-function:var(--ease);
}
.presentation-shell.is-controls-idle .presentation-overlay-control{
  opacity:0!important;
  pointer-events:none;
}
.presentation-shell:not(.is-controls-idle) .presentation-overlay-control{
  visibility:visible;
}
@media (min-width:901px), (hover:hover) and (pointer:fine){
  /* Reduce the 600px About-to-Journey gap by 40%: 180px on each section. */
  .about{padding-bottom:180px}
  .journey{padding-top:180px}
}


/* Neutral, unframed presentation close control. */
.presentation-close,
.presentation-close:hover,
.presentation-close:focus,
.presentation-close:focus-visible,
.presentation-close:active{
  appearance:none;
  -webkit-appearance:none;
  border:0!important;
  border-radius:0!important;
  outline:0!important;
  box-shadow:none!important;
  background:transparent!important;
  color:rgba(255,255,255,.88)!important;
  -webkit-tap-highlight-color:transparent;
}
.presentation-close:hover,
.presentation-close:focus-visible{
  color:#fff!important;
  opacity:1;
  transform:scale(1.06);
}


/* Stable Safari-safe presentation clipping and minimal video control. */
.presentation-shell{
  isolation:isolate;
  overflow:hidden;
  overflow:clip;
  contain:paint;
  clip-path:none;
  -webkit-clip-path:none;
  -webkit-mask-image:-webkit-radial-gradient(white,black);
}
.presentation-stage,
.presentation-slide{
  border-radius:inherit;
  overflow:hidden;
  overflow:clip;
  clip-path:none;
  -webkit-clip-path:none;
  -webkit-mask-image:-webkit-radial-gradient(white,black);
}
.presentation-media{
  border-radius:inherit;
  clip-path:none;
  -webkit-clip-path:none;
  transform:none;
  backface-visibility:visible;
}
.presentation-video-toggle{
  position:absolute;
  z-index:6;
  left:50%;
  top:50%;
  width:clamp(42px,4.5vw,58px);
  height:clamp(42px,4.5vw,58px);
  transform:translate(-50%,-50%);
  display:grid;
  place-items:center;
  padding:0;
  border:0;
  border-radius:50%;
  background:rgba(0,0,0,.42);
  color:#fff;
  font:500 clamp(18px,2vw,25px)/1 system-ui,sans-serif;
  box-shadow:0 1px 12px rgba(0,0,0,.18);
  backdrop-filter:blur(7px);
  -webkit-backdrop-filter:blur(7px);
  opacity:1;
  transition:opacity .25s var(--ease),transform .25s var(--ease);
}
.presentation-video-toggle.is-idle{
  opacity:0;
  pointer-events:none;
}
.presentation-video-toggle:hover,
.presentation-video-toggle:focus-visible{
  background:rgba(0,0,0,.52);
  color:#fff;
  outline:1px solid rgba(255,255,255,.55);
}
@media(max-width:900px) and (hover:none) and (pointer:coarse){
  .presentation-shell{clip-path:inset(0 round 14px)}
}


/* Initial experience loading gate, case-study navigation and Leased wordmark. */
body.site-loading{overflow:hidden}
.site-loader{
  position:fixed;
  inset:0;
  z-index:10000;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:22px;
  background:var(--bg);
  color:rgba(255,255,255,.72);
  font-size:9px;
  letter-spacing:.18em;
  text-transform:uppercase;
  opacity:1;
  visibility:visible;
  transition:opacity .56s var(--ease),visibility 0s linear .56s;
}
.site-loader.is-ready{opacity:0;visibility:hidden;pointer-events:none}
.site-loader-logo{
  width:clamp(68px,6vw,88px);
  height:auto;
  overflow:visible;
  color:#fff;
  filter:drop-shadow(0 10px 32px rgba(255,255,255,.055));
}
.site-loader-logo-ghost{fill:currentColor;stroke:none;opacity:.055}
.site-loader-logo-draw{
  fill:none;
  stroke:currentColor;
  stroke-width:1.15;
  vector-effect:non-scaling-stroke;
  stroke-linecap:round;
  stroke-linejoin:round;
  stroke-dasharray:1;
  stroke-dashoffset:1;
  opacity:0;
  animation:site-loader-logo-draw 3.15s var(--ease) infinite;
}
.site-loader-copy{
  color:rgba(255,255,255,.48);
  animation:site-loader-copy-breathe 3.15s var(--ease) infinite;
}
@keyframes site-loader-logo-draw{
  0%{stroke-dashoffset:1;opacity:0}
  10%{opacity:.48}
  46%,62%{stroke-dashoffset:0;opacity:1}
  86%,100%{stroke-dashoffset:-1;opacity:0}
}
@keyframes site-loader-copy-breathe{
  0%,100%{opacity:.38;transform:translateY(1px)}
  48%,64%{opacity:.72;transform:translateY(0)}
}
.case-study-slider-controls{align-items:center}
.case-study-slider-count{margin-right:8px;color:var(--muted);font-variant-numeric:tabular-nums}
.case-study-slider-count b{color:var(--fg);font-weight:500}
.case-study-card-number{display:none!important}
.case-study-card-copy strong .leased-ease,
#presentationProject .leased-ease{
  font:inherit;
  font-style:italic;
  opacity:1;
}
@media(prefers-reduced-motion:reduce){
  .site-loader-spinner{animation-duration:1.6s!important}
}


/* PDAC writing, Journey logo containers and full-bleed case studies. */
.journey-logo.has-image.logo-remove-white,
.journey-logo.has-image.logo-transparent{
  background:rgba(255,255,255,.94)!important;
  padding:8px;
  border-color:rgba(255,255,255,.24)!important;
  box-shadow:none;
}
.case-study-slider-head{
  justify-content:space-between!important;
}
.case-study-card-viewport{
  width:100vw;
  margin-left:-4vw;
  padding:8px 4vw 18px;
}
.writing-source-link{
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin-top:clamp(28px,4vw,52px);
  padding-top:22px;
  border-top:1px solid rgba(255,255,255,.16);
  color:#fff;
  font-size:12px;
  line-height:1;
  letter-spacing:.08em;
  text-transform:uppercase;
  transition:opacity .25s var(--ease),transform .25s var(--ease);
}
.writing-source-link:hover{
  opacity:.72;
  transform:translateX(3px);
}
@media(max-width:760px) and (hover:none) and (pointer:coarse){
  .case-study-card-viewport{
    margin-left:-5vw;
    padding-inline:5vw;
  }
}


/* Writing CTAs: visually distinct from article headlines. */
.writing-inline-action,
.writing-source-link{
  width:fit-content;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  min-height:42px;
  padding:12px 18px;
  border:1px solid rgba(255,255,255,.34);
  border-radius:999px;
  background:transparent;
  color:#fff;
  font-size:10px;
  font-weight:500;
  line-height:1;
  letter-spacing:.12em;
  text-decoration:none;
  text-transform:uppercase;
  cursor:pointer;
  transition:background .25s var(--ease),color .25s var(--ease),border-color .25s var(--ease),transform .25s var(--ease);
}
.writing-inline-action:hover,
.writing-inline-action:focus-visible{
  border-color:#fff;
  background:#fff;
  color:#050505;
  transform:translateY(-2px);
}
.writing-inline-action:focus-visible,
.writing-source-link:focus-visible{
  outline:1px solid #fff;
  outline-offset:3px;
}
.writing-source-link{
  margin-top:clamp(28px,4vw,52px);
  padding:14px 20px;
  border:1px solid #fff;
  background:#fff;
  color:#050505;
}
.writing-source-link:hover{
  border-color:rgba(255,255,255,.72);
  background:rgba(255,255,255,.82);
  color:#050505;
  opacity:1;
  transform:translateY(-2px);
}
.writing-viewer-body p:has(> .writing-inline-action){
  margin:clamp(22px,3vw,34px) 0;
}


/* Quick Links: button reset and clipboard feedback */
.resource-copy-link{
  width:100%;
  appearance:none;
  -webkit-appearance:none;
  border-top:0;
  border-right:0;
  border-left:0;
  background:transparent;
  color:inherit;
  font:inherit;
  text-align:left;
  cursor:pointer;
}
.resource-copy-link:focus-visible{
  outline:2px solid currentColor;
  outline-offset:4px;
}


/* Keep the longer hero introduction readable without crossing the name lockup. */
.hero-copy p{
  font-size:clamp(17px,1.38vw,21px);
  line-height:1.38;
  letter-spacing:-.015em;
}
@media(max-width:900px) and (hover:none) and (pointer:coarse){
  .hero-copy p{
    font-size:clamp(15px,2.15vw,17px);
    line-height:1.42;
  }
}

/* Keep the desktop composition intact while computer windows scale. */
@media(hover:hover) and (pointer:fine){
  .topbar nav{gap:clamp(16px,2vw,28px)}
  .hero-copy{width:min(40vw,560px)}
  .hero-actions{gap:clamp(14px,2vw,28px)}
  .logo-card{width:100%;max-width:680px}
}
/* Match every part of the hero kicker to one muted colour and opacity. */
.hero-kicker-location,.hero-kicker-divider{opacity:1}
/* Keep compact desktop Macs clear of the name lockup without changing the mobile layout. */
@media(max-width:1599px) and (hover:hover) and (pointer:fine){
  .hero-copy{
    width:min(47vw,670px);
    max-width:670px;
    bottom:8vh;
  }
  .hero-copy p{
    font-size:clamp(17px,1.32vw,20px);
    line-height:1.38;
  }
}
/* Use the available negative space on 15/16-inch-class laptop viewports. */
@media(min-width:1600px) and (min-height:1000px) and (hover:hover) and (pointer:fine){
  .hero-copy{width:min(42vw,640px);max-width:640px}
  .hero-copy p{font-size:clamp(21px,1.55vw,23.5px);line-height:1.34}
}
@media(max-width:900px) and (hover:hover) and (pointer:fine){
  .section{padding-left:clamp(32px,5vw,45px);padding-right:clamp(48px,7vw,63px)}
  .about-grid,.journey-stage,.work-header,.resources-inner,.case-studies-heading{gap:5vw}
  .social-slider-head{grid-template-columns:max-content minmax(300px,1fr) max-content;column-gap:clamp(12px,2vw,18px)}
  .metrics{gap:clamp(8px,1.2vw,12px)}
  .metric strong{font-size:clamp(28px,4.2vw,34px)}
  .metric span{max-width:80px;font-size:8px}
}


/* PDAC proof points: one row, using the exact same metric spacing as Interac. */
[data-social-key="pdac"] .metrics{
  width:100%;
  grid-template-columns:repeat(6,max-content);
}
@media(hover:hover) and (pointer:fine){
  [data-social-key="pdac"] .social-slider-head{
    grid-template-columns:max-content minmax(0,1fr) max-content;
    column-gap:clamp(14px,2vw,32px);
  }
  [data-social-key="pdac"] .metric strong{
    font-size:clamp(26px,2.65vw,44px);
  }
  [data-social-key="pdac"] .metric span{
    font-size:clamp(7px,.52vw,9px);
  }
}
@media(max-width:760px) and (hover:none) and (pointer:coarse){
  [data-social-key="pdac"] .metrics{
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:14px;
  }
}


/* Public-work confidentiality note. */
.work-disclaimer{
  max-width:760px;
  margin:clamp(28px,4vw,52px) 0 0;
  color:var(--muted);
  font-size:11px;
  line-height:1.65;
  letter-spacing:.025em;
}


/* Shared Interac and PDAC results typography and tighter desktop spacing. */
@media(hover:hover) and (pointer:fine){
  .social-showcase .metrics{
    gap:clamp(8px,1vw,14px);
  }
  .social-showcase .metric strong,
  [data-social-key="pdac"] .metric strong{
    font-size:clamp(26px,2.65vw,44px);
  }
}
.case-study-credit-link{
  position:relative;
  z-index:3;
  color:inherit;
  text-decoration:none;
  border-bottom:1px solid rgba(255,255,255,.42);
  transition:color .2s var(--ease),border-color .2s var(--ease);
}
.case-study-credit-link:hover,
.case-study-credit-link:focus-visible{
  color:#fff;
  border-color:#fff;
}

/* Writing portfolio: light cards and light reader, scoped to writing only. */
.writing-card{
  border-color:rgba(0,0,0,.16);
  background:#efefea;
  color:#090909;
}
.writing-card:after{border-color:rgba(0,0,0,.12)}
.writing-card-number,
.writing-card-type{color:rgba(0,0,0,.52)}
.writing-card p{color:rgba(0,0,0,.66)}
.writing-card em{color:#090909}
.writing-card:hover,
.writing-card:focus-visible{
  border-color:rgba(0,0,0,.42);
  background:#e4e1d9;
}
.writing-viewer-shell{
  border-color:rgba(255,255,255,.32);
  background:#efefea;
  color:#090909;
  box-shadow:0 32px 120px rgba(0,0,0,.62);
}
.writing-viewer-header{border-bottom-color:rgba(0,0,0,.18)}
.writing-viewer-header span,
.writing-viewer-body .writing-meta,
.writing-section-label{color:rgba(0,0,0,.56)}
.writing-viewer-header h2,
.writing-viewer-body .writing-lede,
.writing-viewer-body p{color:#090909}
.writing-viewer-close{
  border-color:rgba(0,0,0,.24);
  color:#090909;
}
.writing-viewer-close:hover{background:#090909;color:#efefea}
.writing-scenario{border-bottom-color:rgba(0,0,0,.18)}
.writing-viewer .writing-inline-action{
  border-color:rgba(0,0,0,.35);
  color:#090909;
}
.writing-viewer .writing-inline-action:hover,
.writing-viewer .writing-inline-action:focus-visible{
  border-color:#090909;
  background:#090909;
  color:#efefea;
}
.writing-viewer .writing-source-link{
  border-color:#090909;
  background:#090909;
  color:#efefea;
}
.writing-viewer .writing-source-link:hover{
  border-color:rgba(0,0,0,.74);
  background:rgba(0,0,0,.82);
}
.writing-viewer .writing-inline-action:focus-visible,
.writing-viewer .writing-source-link:focus-visible{
  outline-color:#090909;
}

/* Media cards carry their own framing; neutral containers prevent edge hairlines. */
.social-post-slide{
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}

/* Let the portfolio note use the full work-section width. */
.work-disclaimer{
  width:100%;
  max-width:none;
}

/* Scoped social-card crop and video rounding fix. */
.social-slider-track{
  gap:12px;
}
[data-social-slider] .social-post-slide{
  border-radius:14px;
  overflow:hidden;
  isolation:isolate;
  background:#fff;
  clip-path:inset(0 round 14px);
  -webkit-clip-path:inset(0 round 14px);
  -webkit-mask-image:-webkit-radial-gradient(white,black);
}
[data-social-slider] .social-post-slide :is(img,video){
  border-radius:inherit;
}

/* Final PDAC seam and video-border cleanup. */
[data-social-key="pdac"] .social-post-slide{
  border:0!important;
  border-radius:14px!important;
  background:transparent!important;
  box-shadow:none!important;
  overflow:hidden!important;
  isolation:isolate;
  clip-path:inset(0 round 14px);
  -webkit-clip-path:inset(0 round 14px);
  -webkit-mask-image:-webkit-radial-gradient(white,black);
}
[data-social-key="pdac"] .social-post-slide>img{
  display:block;
  width:auto;
  height:calc(100% + 4px);
  max-width:none;
  margin:0;
  border:0!important;
  border-radius:0!important;
  outline:0!important;
  box-shadow:none!important;
  background:transparent!important;
  transform:translateY(-2px);
}
[data-social-key="pdac"] .social-post-slide>video{
  display:block;
  width:auto;
  height:calc(100% + 4px);
  max-width:none;
  margin:0;
  border:0!important;
  border-radius:0!important;
  outline:0!important;
  box-shadow:none!important;
  background:transparent!important;
  transform:translateY(-2px) scaleX(1.006);
  transform-origin:center;
}

/* Final Interac right-edge trim. */
[data-social-key="interac"] .social-post-slide:nth-child(3)>img{
  transform:scaleX(1.006);
  transform-origin:left center;
}

/* Motion performance refinements — preserve the existing choreography. */
.hero-dive-stage,
.portrait-wrap,
.hero-title .surname-text,
.social-post-slide,
.case-study-card,
.writing-card,
.presentation-shell{
  -webkit-backface-visibility:hidden;
  backface-visibility:hidden;
}
#motion-bg,
.hero-speed-tunnel{contain:strict}
@media(hover:hover) and (pointer:fine){
  .social-post-slide,
  .case-study-card,
  .writing-card{will-change:transform}
  .case-study-card img,
  .writing-card::after{will-change:transform,opacity}
}
@media(prefers-reduced-motion:reduce){
  .site-loader-logo-draw,
  .site-loader-copy{animation:none!important}
  .site-loader-logo-draw{stroke-dashoffset:0;opacity:1}
  .site-loader-copy{opacity:.62}
}

/* Hair-only profile loader and restored hero handoff. */
.site-loader-logo{
  width:clamp(34px,3vw,44px);
  height:auto;
  overflow:visible;
  color:#fff;
  filter:drop-shadow(0 8px 24px rgba(255,255,255,.045));
}
.site-loader-logo-ghost,
.site-loader-logo-draw{display:none}
.site-loader-logo-base{
  fill:none;
  stroke:currentColor;
  stroke-width:.82;
  vector-effect:non-scaling-stroke;
  stroke-linecap:round;
  stroke-linejoin:round;
  opacity:.22;
}
.site-loader-hair{
  fill:none;
  stroke:currentColor;
  stroke-width:1.18;
  vector-effect:non-scaling-stroke;
  stroke-linecap:round;
  stroke-linejoin:round;
  stroke-dasharray:1;
  stroke-dashoffset:1;
  opacity:0;
  animation:site-loader-hair-draw 3.8s var(--ease) infinite;
}
.site-loader-hair-crown{animation-delay:.16s}
.site-loader-hair-right{animation-delay:.32s}
.site-loader-hair-lower{animation-delay:.48s}
@keyframes site-loader-hair-draw{
  0%,8%{stroke-dashoffset:1;opacity:0}
  14%{opacity:.9}
  54%,70%{stroke-dashoffset:0;opacity:1}
  90%,100%{stroke-dashoffset:-1;opacity:0}
}
@media(prefers-reduced-motion:reduce){
  .site-loader-hair{
    animation:none!important;
    stroke-dashoffset:0;
    opacity:1;
  }
  .site-loader-copy{animation:none!important}
}


/* Safari line-tunnel restoration and softer loading mark. */
.hero-dive-stage {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
}
.hero-speed-tunnel {
  contain: none !important;
  background: transparent !important;
  isolation: isolate;
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
}
.site-loader-logo {
  color: rgba(255,255,255,.58) !important;
  filter: drop-shadow(0 8px 22px rgba(255,255,255,.018)) !important;
}
.site-loader-logo-base {
  opacity: .075 !important;
  stroke-width: .56 !important;
}
.site-loader-hair {
  stroke-width: .76 !important;
}
@keyframes site-loader-hair-draw {
  0%,8% { stroke-dashoffset: 1; opacity: 0; }
  14% { opacity: .42; }
  54%,70% { stroke-dashoffset: 0; opacity: .68; }
  90%,100% { stroke-dashoffset: -1; opacity: 0; }
}


/* Mobile-first layout and minimal-motion pass — 2026-08-08 */
@media(max-width:900px) and (hover:none) and (pointer:coarse){
  html{scroll-behavior:auto}
  body{overscroll-behavior-y:none}
  #motion-bg,.hero-speed-tunnel{display:none!important}
  .section-progress-hud{display:none!important}

  .topbar{height:68px;padding:0 4.5vw}
  .topbar nav{display:none!important}
  .icon-btn{width:40px;height:40px}
  .section{padding:88px 5vw 72px!important}
  .eyebrow{margin-bottom:28px;font-size:10px;letter-spacing:.18em}

  .hero{height:auto!important;min-height:100svh!important;padding:0!important;overflow:hidden!important}
  .hero-dive-stage{
    position:relative!important;
    top:auto!important;
    height:auto!important;
    min-height:100svh!important;
    padding:96px 5vw 54px!important;
    display:flex!important;
    flex-direction:column!important;
    overflow:hidden!important;
    transform:none!important;
    opacity:1!important;
    filter:none!important;
  }
  .hero-kicker{order:1;font-size:10px;line-height:1.5;letter-spacing:.13em;gap:6px!important}
  .hero-title{order:2;font-size:clamp(54px,15.4vw,74px)!important;line-height:.83;margin:44px 0 0!important;letter-spacing:-.07em}
  .hero-title .line-two{margin-left:0!important}
  .portrait-wrap{
    order:3;
    position:relative!important;
    right:auto!important;
    bottom:auto!important;
    align-self:flex-end;
    width:min(88vw,460px)!important;
    height:44svh!important;
    margin:-1vh -10vw 0 0;
  }
  .hero-copy{
    order:4;
    position:relative!important;
    left:auto!important;
    bottom:auto!important;
    width:100%!important;
    max-width:none!important;
    margin-top:-1vh;
  }
  .hero-copy p{font-size:16px!important;line-height:1.48!important;letter-spacing:-.012em}
  .hero-actions{margin-top:22px!important}
  .journey-prompt{font-size:10px;letter-spacing:.07em;animation:none!important;opacity:.7!important;transform:none!important}
  .journey-prompt:after{animation:none!important;transform:scaleX(.45)!important;opacity:.45!important}
  .reveal{animation:none!important;opacity:1!important;transform:none!important}

  .about{min-height:0!important;padding-top:88px!important;padding-bottom:80px!important}
  .about-grid{grid-template-columns:1fr!important;gap:0!important}
  .about-sticky{position:relative!important;top:auto!important;height:auto!important;margin-bottom:36px}
  .about-sticky h2{white-space:normal!important}
  .orbit-word{
    position:relative!important;
    left:auto!important;
    bottom:auto!important;
    margin-top:8px;
    font-size:clamp(42px,13vw,62px)!important;
    line-height:.92!important;
    transform:none!important;
    transition:none!important;
  }
  .chapters{padding-top:0!important}
  .chapter{padding:30px 0!important;min-height:0!important;opacity:1!important;transition:none!important}
  .chapter p{font-size:17px!important;line-height:1.55!important}

  .journey{padding-top:82px!important}
  .journey-stage{top:76px!important;height:calc(100svh - 76px)!important;padding:0 0 28px!important}
  .journey-title{margin-bottom:24px!important}
  .journey-title h2{font-size:clamp(42px,12vw,60px)!important}
  .journey-timeline-cluster{margin-bottom:24px!important}
  .journey-scroll-space{height:220vh!important}
  .journey-master-progress i::before,.journey-master-progress i::after{display:none!important}
  .journey-logo.is-flipping{animation:none!important}
  .journey-entry,.journey-entry-copy,.journey-logo img{transition:none!important}
  .journey-entry.is-entering,.journey-entry.is-visible,.journey-entry.is-leaving{transform:none!important;transition:none!important}

  .work-header{grid-template-columns:1fr!important;gap:24px!important;margin-bottom:30px!important}
  .work-header p{font-size:16px;line-height:1.55;margin:0}
  .work>.case-study{padding:26px 0 62px!important}
  .social-slider-head{grid-template-columns:1fr auto!important;row-gap:20px!important;margin-bottom:24px!important}
  .social-slider-head>.metrics{grid-column:1/-1!important;grid-row:2!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:18px 14px!important}
  [data-social-key="pdac"] .metrics{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:16px 10px!important}
  .metric strong{font-size:clamp(26px,9vw,36px)!important}
  .metric span{font-size:8px!important;line-height:1.35!important}
  .social-slider-controls button,.case-study-slider-controls button,.writing-slider-controls button{width:44px!important;height:44px!important}
  .social-slider-viewport,.case-study-card-viewport,.writing-card-viewport{scroll-behavior:auto!important;-webkit-overflow-scrolling:touch}
  .social-slider-viewport{-webkit-mask-image:none!important;mask-image:none!important}
  .social-post-slide{height:min(49svh,370px)!important;max-height:calc(100vw - 54px)!important;transition:none!important;will-change:auto!important}
  .case-study-card,.writing-card{width:min(86vw,440px)!important;border-radius:18px!important;transition:none!important}
  .case-study-card img{transition:none!important}
  .case-study-card-copy{left:20px;right:20px;bottom:20px}
  .case-study-card-copy strong{font-size:clamp(26px,8vw,38px);margin:8px 0 14px}
  .case-study-card-copy small{font-size:8px;line-height:1.4}
  .writing-card{padding:24px!important}
  .writing-card strong{max-width:88%;font-size:clamp(26px,8vw,38px)!important}
  .writing-card p{font-size:12px;line-height:1.45}

  .tabs{margin-top:46px!important;gap:7px;padding-bottom:12px;scrollbar-width:none}
  .tabs::-webkit-scrollbar{display:none}
  .tab{padding:12px 16px;font-size:12px;transition:none!important}
  .endorsements{min-height:0!important}
  .endorsements blockquote{margin-top:42px!important;font-size:clamp(20px,5.8vw,27px)!important;line-height:1.35!important}
  .endorsement-meta{font-size:12px;line-height:1.45}

  .resources{padding:88px 5vw 78px!important;border-radius:26px 26px 0 0!important}
  .resources-inner{grid-template-columns:1fr!important;gap:48px!important}
  .resource-row{grid-template-columns:28px minmax(0,1fr) 24px!important;gap:12px!important;padding:22px 2px!important;transition:none!important}
  .resource-row strong{font-size:20px!important}
  .resource-row em{display:none!important}
  .latest-section{margin-top:82px!important;padding-top:64px!important}
  .latest-heading{gap:24px!important;margin-bottom:28px!important}
  .latest-grid{grid-template-columns:1fr!important;gap:12px!important}
  .latest-card{min-height:220px!important;padding:22px!important;border-radius:20px!important;transition:none!important}
  .latest-card p{font-size:clamp(20px,6.3vw,27px)!important;margin:28px 0!important}
  footer{padding:28px 5vw;gap:18px;align-items:center}

  .writing-viewer{padding:0!important;place-items:stretch!important}
  .writing-viewer-shell{width:100%!important;height:100svh!important;max-height:100svh!important;padding:20px 18px!important;border:0!important;border-radius:0!important;animation:none!important}
  .writing-viewer-header{padding-bottom:20px!important}
  .writing-viewer-header h2{font-size:clamp(28px,9vw,42px)!important}
  .writing-viewer-body{padding-top:24px!important}
  .writing-viewer-body .writing-lede{font-size:19px!important;line-height:1.5!important}
  .writing-viewer-body p{font-size:16px!important;line-height:1.7!important}
  .writing-backdrop,.presentation-backdrop{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
  .presentation-shell{animation:none!important}
  .presentation-close,.presentation-arrow{min-width:44px;min-height:44px}

  .project-card,.project-card.large,.project-card.wide,.latest-card,.resource-row,.social-post-slide,.case-study-card,.writing-card{transform:none!important}
  .project-card img,.latest-card-footer i,.resource-row i{transform:none!important;transition:none!important}
}

@media(max-width:390px) and (hover:none) and (pointer:coarse){
  .topbar{padding-inline:16px}
  .hero-dive-stage{padding-left:18px!important;padding-right:18px!important}
  .section{padding-left:18px!important;padding-right:18px!important}
  .hero-title{font-size:clamp(50px,14.8vw,61px)!important}
  .portrait-wrap{width:94vw!important;margin-right:-18vw}
  [data-social-key="pdac"] .metrics{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .case-study-card,.writing-card{width:88vw!important}
  .resources{padding-left:18px!important;padding-right:18px!important}
}


/* Mobile experience v2 — hero, About, Journey, viewers and carousels. */
@media(max-width:900px) and (hover:none) and (pointer:coarse){
  /* Hero: portrait sits behind the surname, which always fits the viewport. */
  .hero{min-height:100svh!important;height:auto!important}
  .hero-dive-stage{
    min-height:100svh!important;
    height:auto!important;
    padding:88px 18px 56px!important;
    display:block!important;
    position:relative!important;
  }
  .hero-kicker{font-size:9px!important;letter-spacing:.11em!important;max-width:88vw}
  .hero-title{
    position:relative!important;
    z-index:5!important;
    margin:34px 0 0!important;
    font-size:clamp(43px,13.1vw,57px)!important;
    line-height:.82!important;
    letter-spacing:-.075em!important;
    width:100%!important;
  }
  .hero-title>span:first-child{position:relative;z-index:5}
  .hero-title .line-two{
    position:relative!important;
    z-index:5!important;
    display:block!important;
    width:100%!important;
    margin:clamp(230px,39svh,330px) 0 0!important;
    white-space:nowrap!important;
  }
  .hero-title .surname-text{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    font-size:.91em!important;
    letter-spacing:-.082em!important;
    white-space:nowrap!important;
  }
  .portrait-wrap{
    position:absolute!important;
    z-index:2!important;
    top:clamp(142px,21.5svh,184px)!important;
    right:-10vw!important;
    bottom:auto!important;
    width:min(91vw,455px)!important;
    height:clamp(290px,46svh,370px)!important;
    margin:0!important;
    pointer-events:none!important;
    overflow:hidden!important;
  }
  .portrait-wrap::after{
    content:"";
    position:absolute;
    z-index:4;
    left:-4%;right:-4%;bottom:-1px;
    height:34%;
    background:linear-gradient(180deg,rgba(6,6,6,0),rgba(6,6,6,.58) 48%,#060606 94%);
    pointer-events:none;
  }
  .portrait{z-index:2!important;filter:contrast(1.04) drop-shadow(0 18px 38px rgba(0,0,0,.2))!important}
  .hero-copy{
    position:relative!important;
    z-index:6!important;
    left:auto!important;
    bottom:auto!important;
    width:100%!important;
    max-width:none!important;
    margin:18px 0 0!important;
  }
  .hero-copy p{margin:0!important;font-size:15.5px!important;line-height:1.5!important}
  .hero-actions{display:none!important}

  /* About: sticky identity at 40% viewport height, copy chapters scroll beneath it. */
  .about{padding:84px 18px 56px!important;overflow:visible!important}
  .about-grid{display:block!important;position:relative!important;overflow:visible!important}
  .about-sticky{
    position:sticky!important;
    top:40svh!important;
    z-index:8!important;
    height:auto!important;
    margin:0!important;
    padding:0 0 20px!important;
    pointer-events:none;
    background:linear-gradient(180deg,#060606 0%,#060606 76%,rgba(6,6,6,0) 100%);
  }
  .about-sticky h2{
    margin:0!important;
    font-size:clamp(35px,9.5vw,46px)!important;
    line-height:.94!important;
    white-space:nowrap!important;
  }
  .orbit-word{
    position:relative!important;
    left:auto!important;
    bottom:auto!important;
    margin:4px 0 0!important;
    font-size:clamp(39px,11.2vw,54px)!important;
    line-height:.92!important;
    color:var(--fg)!important;
    -webkit-text-stroke:0!important;
    font-weight:400!important;
    letter-spacing:-.055em!important;
    transform:none!important;
  }
  .chapters{padding:29svh 0 3svh!important;margin:0!important}
  .chapter{
    min-height:60svh!important;
    padding:18svh 0 10svh!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:center!important;
    border-top:1px solid rgba(255,255,255,.14)!important;
    opacity:.22!important;
    transition:none!important;
  }
  .chapter.active{opacity:1!important}
  .chapter span{font-size:10px!important;letter-spacing:.16em!important}
  .chapter p{margin:18px 0 0!important;font-size:17px!important;line-height:1.58!important;max-width:94%!important}
  .chapter:last-child{padding-bottom:18svh!important}

  /* Journey gets its own compact chronological mobile timeline. */
  .journey{padding:88px 18px 78px!important}
  .journey>.eyebrow{margin-bottom:26px!important}
  .journey-shell{display:none!important}
  .journey-mobile-map{display:block!important}
  .journey-mobile-heading{margin-bottom:34px}
  .journey-mobile-heading h2{
    margin:0;
    font-size:clamp(44px,12.6vw,62px);
    line-height:.94;
    letter-spacing:-.06em;
    font-weight:400;
  }
  .journey-mobile-heading h2 em{font-family:Georgia,serif;font-weight:400}
  .journey-mobile-heading p{margin:18px 0 0;color:#aaa;font-size:14px;line-height:1.5;max-width:31em}
  .journey-mobile-list{position:relative;margin-top:18px;padding:2px 0 0}
  .journey-mobile-list::before{
    content:"";position:absolute;left:66px;top:0;bottom:0;width:1px;background:rgba(255,255,255,.16)
  }
  .journey-mobile-item{
    position:relative;
    display:grid;
    grid-template-columns:52px minmax(0,1fr);
    gap:30px;
    padding:0 0 26px;
  }
  .journey-mobile-item::before{
    content:"";position:absolute;left:63px;top:17px;width:7px;height:7px;border-radius:50%;background:#f4f4ef;box-shadow:0 0 0 5px #060606
  }
  .journey-mobile-date{padding-top:8px;color:#7f7f7a;font-size:8px;line-height:1.45;letter-spacing:.07em;text-transform:uppercase;text-align:right}
  .journey-mobile-card{
    min-width:0;
    padding:17px 17px 18px;
    border:1px solid rgba(255,255,255,.14);
    border-radius:17px;
    background:rgba(255,255,255,.035);
  }
  .journey-mobile-type{display:block;color:#8e8e89;font-size:8px;letter-spacing:.16em;text-transform:uppercase}
  .journey-mobile-card h3{margin:9px 0 6px;font-size:21px;line-height:1.08;letter-spacing:-.04em;font-weight:400}
  .journey-mobile-org{display:block;color:#c8c8c2;font-size:12px}
  .journey-mobile-card p{margin:12px 0 0;color:#93938e;font-size:11px;line-height:1.48}

  /* Work: compact one-line proof numbers, cleaner section labels and unified controls. */
  .social-slider-head>span{max-width:150px!important;line-height:1.34!important}
  .metric strong{font-size:clamp(22px,6.9vw,29px)!important;line-height:.9!important;white-space:nowrap!important}
  .metric span{font-size:7.5px!important;line-height:1.3!important}
  .social-slider-controls button,
  .writing-slider-controls button,
  .case-study-slider-controls button{
    appearance:none!important;
    -webkit-appearance:none!important;
    width:42px!important;
    height:42px!important;
    min-width:42px!important;
    min-height:42px!important;
    padding:0!important;
    display:grid!important;
    place-items:center!important;
    border:1px solid rgba(255,255,255,.26)!important;
    border-radius:50%!important;
    background:transparent!important;
    color:#fff!important;
    font-family:"Helvetica Neue",Arial,sans-serif!important;
    font-size:18px!important;
    font-weight:400!important;
    line-height:1!important;
    box-shadow:none!important;
  }
  .social-slider-controls,
  .writing-slider-controls,
  .case-study-slider-controls{gap:7px!important;align-items:center!important}
  .writing-slider-count,.case-study-slider-count{display:inline-flex!important;align-items:center!important;gap:5px!important;margin-right:5px!important;font-size:10px!important;letter-spacing:.08em!important}
  .writing-card strong{
    max-width:96%!important;
    font-size:clamp(21px,6.2vw,27px)!important;
    line-height:1.02!important;
    letter-spacing:-.04em!important;
    display:-webkit-box!important;
    -webkit-box-orient:vertical!important;
    -webkit-line-clamp:2!important;
    overflow:hidden!important;
  }
  .writing-card p{margin:10px 0 15px!important}

  /* Presentation decks become a vertical document on mobile. */
  .presentation-viewer{padding:0!important;place-items:stretch!important}
  .presentation-shell{
    width:100%!important;
    height:100svh!important;
    max-height:none!important;
    aspect-ratio:auto!important;
    border:0!important;
    border-radius:0!important;
    background:#050505!important;
    overflow:hidden!important;
    -webkit-mask-image:none!important;
  }
  .presentation-stage{
    position:relative!important;
    inset:auto!important;
    width:100%!important;
    height:100%!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    -webkit-overflow-scrolling:touch;
    border-radius:0!important;
  }
  .presentation-slide{
    position:relative!important;
    inset:auto!important;
    width:100%!important;
    height:auto!important;
    min-height:100%!important;
    aspect-ratio:auto!important;
    overflow:visible!important;
    border-radius:0!important;
    background:#050505!important;
    -webkit-mask-image:none!important;
  }
  .presentation-mobile-deck{display:grid;gap:10px;padding:68px 10px 26px}
  .presentation-mobile-page{position:relative;width:100%;aspect-ratio:16/9;overflow:hidden;background:#000;border:1px solid rgba(255,255,255,.13);border-radius:10px}
  .presentation-mobile-page img,.presentation-mobile-page video{display:block;width:100%;height:100%;object-fit:contain;background:#000}
  .presentation-mobile-page-number{position:absolute;right:9px;bottom:7px;padding:4px 6px;border-radius:999px;background:rgba(0,0,0,.55);color:rgba(255,255,255,.72);font-size:8px;letter-spacing:.08em}
  .presentation-arrow,.presentation-footer{display:none!important}
  .presentation-close{
    position:fixed!important;
    z-index:30!important;
    top:12px!important;
    right:12px!important;
    width:44px!important;
    height:44px!important;
    color:#fff!important;
    opacity:1!important;
    mix-blend-mode:normal!important;
    background:rgba(0,0,0,.32)!important;
    border-radius:50%!important;
    backdrop-filter:blur(5px);
    -webkit-backdrop-filter:blur(5px);
  }

  /* Latest posts become a touch carousel instead of a vertical stack. */
  .latest-heading{margin-bottom:18px!important}
  .latest-mobile-controls{display:flex;align-items:center;justify-content:flex-end;gap:7px;margin:0 0 18px}
  .latest-mobile-count{display:inline-flex;align-items:center;gap:5px;margin-right:5px;color:#666;font-size:10px;letter-spacing:.08em;font-variant-numeric:tabular-nums}
  .latest-mobile-count b{color:#090909;font-weight:500}
  .latest-mobile-controls button{
    appearance:none;-webkit-appearance:none;
    width:42px;height:42px;padding:0;display:grid;place-items:center;
    border:1px solid rgba(0,0,0,.24);border-radius:50%;background:transparent;color:#090909;
    font-family:"Helvetica Neue",Arial,sans-serif;font-size:18px;line-height:1
  }
  .latest-grid{
    display:flex!important;
    grid-template-columns:none!important;
    gap:12px!important;
    width:calc(100% + 5vw)!important;
    margin-right:-5vw!important;
    padding:0 5vw 8px 0!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    scroll-snap-type:x mandatory!important;
    scrollbar-width:none!important;
    -webkit-overflow-scrolling:touch;
  }
  .latest-grid::-webkit-scrollbar{display:none}
  .latest-card{flex:0 0 min(86vw,430px)!important;width:min(86vw,430px)!important;scroll-snap-align:start!important;scroll-snap-stop:always!important}

  /* Keep existing arrow glyphs as typographic arrows, not emoji artwork. */
  .icon-btn span,.resource-row i,.latest-card-footer i,
  .social-slider-controls button,.writing-slider-controls button,.case-study-slider-controls button,.latest-mobile-controls button{
    font-family:"Helvetica Neue",Arial,sans-serif!important;
    font-variant-emoji:text;
  }
}

@media(max-width:390px) and (hover:none) and (pointer:coarse){
  .hero-dive-stage{padding-left:16px!important;padding-right:16px!important}
  .hero-title{font-size:clamp(41px,12.6vw,49px)!important}
  .hero-title .surname-text{font-size:.9em!important}
  .portrait-wrap{right:-14vw!important;width:96vw!important}
  .about,.journey{padding-left:16px!important;padding-right:16px!important}
  .journey-mobile-item{grid-template-columns:48px minmax(0,1fr);gap:27px}
  .journey-mobile-list::before{left:61px}
  .journey-mobile-item::before{left:58px}
  .latest-card{flex-basis:88vw!important;width:88vw!important}
}


/* Mobile v2 final safeguards. */
@media(max-width:900px) and (hover:none) and (pointer:coarse){
  .presentation-shell.is-controls-idle .presentation-close{
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
  }
}


/* Mobile experience v3 — sticky About carousel and horizontal Journey timeline. */
@media(max-width:900px) and (hover:none) and (pointer:coarse){
  /* Keep real link arrows typographic rather than emoji-styled. */
  .icon-btn span,
  .resource-row i,
  .latest-profile-link span,
  .latest-card-footer i,
  .endorsement-source span,
  .case-study-card-copy em,
  .writing-card em,
  footer a{
    font-family:Arial,Helvetica,sans-serif!important;
    font-variant-emoji:text;
  }
  .icon-btn span{font-size:19px;line-height:1;transform:translateY(-1px)}

  /* Hero: keep the portrait/surname relationship, bring ALEX immediately above it. */
  .hero-title{margin-top:34px!important}
  .hero-title>span:first-child{
    position:absolute!important;
    z-index:6!important;
    left:0!important;
    top:calc(clamp(230px,39svh,330px) - .82em)!important;
    width:auto!important;
  }
  .hero-title .line-two{
    margin-top:clamp(230px,39svh,330px)!important;
  }
  .hero-title .surname-text{
    font-size:.89em!important;
    letter-spacing:-.084em!important;
  }

  /* The desktop About DOM stays untouched but is replaced visually by one sticky mobile carousel. */
  .about.mobile-about-v3{
    height:252svh!important;
    min-height:0!important;
    padding:0 18px!important;
    overflow:visible!important;
  }
  .about.mobile-about-v3>.eyebrow,
  .about.mobile-about-v3>.about-grid{display:none!important}
  .about-mobile-carousel{
    position:relative;
    height:100%;
    width:100%;
  }
  .about-mobile-sticky{
    position:sticky;
    top:40svh;
    z-index:12;
    width:100%;
    max-width:520px;
  }
  .about-mobile-sticky .eyebrow{
    margin:0 0 11px!important;
    color:var(--muted);
    font-size:9px!important;
    letter-spacing:.18em!important;
  }
  .about-mobile-title{
    margin:0!important;
    color:var(--fg);
    font-size:clamp(34px,9.4vw,44px)!important;
    line-height:.95!important;
    letter-spacing:-.055em!important;
    font-weight:400!important;
  }
  .about-mobile-title em{
    display:block;
    margin-top:2px;
    font-family:Georgia,serif;
    font-style:normal;
    font-weight:400;
  }
  .about-mobile-divider{
    width:100%;
    height:1px;
    margin:17px 0 18px;
    background:rgba(255,255,255,.18);
  }
  .about-mobile-copy{
    min-height:185px;
    opacity:1;
    transition:opacity .16s ease;
  }
  .about-mobile-copy.is-changing{opacity:0}
  .about-mobile-kicker{
    display:block;
    color:var(--muted);
    font-size:10px;
    line-height:1.3;
    letter-spacing:.16em;
    text-transform:uppercase;
  }
  .about-mobile-copy p{
    max-width:34em;
    margin:13px 0 0!important;
    color:#cdcdc7;
    font-size:16px!important;
    line-height:1.58!important;
    letter-spacing:-.01em;
  }

  /* Journey: horizontal time axis with duration bars and overlapping lanes. */
  .journey{padding:88px 0 80px!important;overflow:hidden!important}
  .journey>.eyebrow{padding:0 18px;margin-bottom:24px!important}
  .journey-shell,
  .journey-mobile-map{display:none!important}
  .journey-mobile-timeline{display:block!important;width:100%}
  .journey-mobile-timeline-heading{padding:0 18px 26px}
  .journey-mobile-timeline-heading h2{
    margin:0;
    font-size:clamp(43px,12.4vw,60px);
    line-height:.94;
    letter-spacing:-.06em;
    font-weight:400;
  }
  .journey-mobile-timeline-heading h2 em{font-family:Georgia,serif;font-weight:400}
  .journey-mobile-timeline-heading p{
    max-width:31em;
    margin:15px 0 0;
    color:#999994;
    font-size:13px;
    line-height:1.5;
  }
  .journey-timeline-scroll{
    width:100%;
    overflow-x:auto;
    overflow-y:hidden;
    padding:0 18px 16px;
    scrollbar-width:none;
    overscroll-behavior-inline:contain;
    -webkit-overflow-scrolling:touch;
    scroll-snap-type:x proximity;
  }
  .journey-timeline-scroll::-webkit-scrollbar{display:none}
  .journey-timeline-canvas{
    position:relative;
    min-width:1728px;
    border-top:1px solid rgba(255,255,255,.17);
    border-bottom:1px solid rgba(255,255,255,.12);
    background:linear-gradient(180deg,rgba(255,255,255,.025),rgba(255,255,255,.008));
  }
  .journey-timeline-axis{
    position:absolute;
    left:0;right:0;top:0;height:38px;
    border-bottom:1px solid rgba(255,255,255,.12);
  }
  .journey-timeline-year{
    position:absolute;
    top:12px;
    color:#8a8a85;
    font-size:9px;
    letter-spacing:.12em;
    transform:translateX(4px);
  }
  .journey-timeline-year::before{
    content:"";
    position:absolute;
    left:-4px;
    top:26px;
    width:1px;
    height:var(--journey-grid-height,520px);
    background:rgba(255,255,255,.065);
  }
  .journey-timeline-bar{
    position:absolute;
    height:48px;
    min-width:72px;
    padding:8px 10px 7px;
    border:1px solid rgba(255,255,255,.18);
    border-radius:12px;
    background:#111;
    overflow:visible;
    scroll-snap-align:start;
  }
  .journey-timeline-bar[data-type="Education"]{background:#151515}
  .journey-timeline-bar[data-type="Volunteer"]{background:#0d0d0d;border-style:dashed}
  .journey-timeline-bar strong{
    display:block;
    min-width:max-content;
    color:#f4f4ef;
    font-size:10px;
    line-height:1.12;
    font-weight:500;
    letter-spacing:-.012em;
    white-space:nowrap;
  }
  .journey-timeline-bar span{
    display:block;
    min-width:max-content;
    margin-top:4px;
    color:#8d8d88;
    font-size:7.5px;
    line-height:1;
    letter-spacing:.04em;
    white-space:nowrap;
  }
  .journey-timeline-legend{
    display:flex;
    gap:16px;
    padding:15px 18px 0;
    color:#8d8d88;
    font-size:8px;
    letter-spacing:.12em;
    text-transform:uppercase;
  }
  .journey-timeline-legend span{display:inline-flex;align-items:center;gap:6px}
  .journey-timeline-legend i{width:12px;height:1px;background:#aaa;display:block}
  .journey-timeline-legend span:last-child i{background:transparent;border-top:1px dashed #aaa}

  /* Results become one compact horizontal line; swipe if the row exceeds the viewport. */
  .social-slider-head{
    grid-template-columns:minmax(0,1fr) auto!important;
    align-items:center!important;
    row-gap:18px!important;
  }
  .social-slider-head>span{
    grid-column:1!important;
    grid-row:1!important;
    max-width:none!important;
    line-height:1.3!important;
  }
  .social-slider-head>.social-slider-controls{
    grid-column:2!important;
    grid-row:1!important;
    justify-self:end;
  }
  .social-slider-head>.metrics,
  [data-social-key="pdac"] .metrics{
    grid-column:1/-1!important;
    grid-row:2!important;
    display:flex!important;
    width:calc(100% + 18px)!important;
    margin-right:-18px!important;
    gap:18px!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    padding:1px 18px 7px 0!important;
    scrollbar-width:none;
    justify-content:flex-start!important;
  }
  .social-slider-head>.metrics::-webkit-scrollbar,
  [data-social-key="pdac"] .metrics::-webkit-scrollbar{display:none}
  .social-showcase .metric,
  [data-social-key="pdac"] .metric{
    flex:0 0 auto!important;
    display:inline-flex!important;
    align-items:baseline!important;
    gap:6px!important;
    width:auto!important;
    min-width:0!important;
    white-space:nowrap!important;
    text-align:left!important;
  }
  .social-showcase .metric strong,
  [data-social-key="pdac"] .metric strong{
    display:inline!important;
    flex:0 0 auto!important;
    font-size:20px!important;
    line-height:1!important;
    white-space:nowrap!important;
  }
  .social-showcase .metric span,
  [data-social-key="pdac"] .metric span{
    display:inline!important;
    flex:0 0 auto!important;
    width:auto!important;
    max-width:none!important;
    margin:0!important;
    font-size:7px!important;
    line-height:1!important;
    white-space:nowrap!important;
  }

  /* Touch interaction is the navigation; retain only the compact counters. */
  .social-slider-controls button,
  .writing-slider-controls button,
  .case-study-slider-controls button,
  .latest-mobile-controls{display:none!important}
  .social-slider-controls,
  .writing-slider-controls,
  .case-study-slider-controls{
    min-width:max-content;
    gap:0!important;
  }
  .social-slider-count,
  .writing-slider-count,
  .case-study-slider-count{
    display:inline-flex!important;
    align-items:center!important;
    gap:5px!important;
    min-width:0!important;
    margin:0!important;
    color:var(--muted)!important;
    font-size:10px!important;
    line-height:1!important;
    letter-spacing:.08em!important;
    font-variant-numeric:tabular-nums;
  }
  .social-slider-count b,
  .writing-slider-count b,
  .case-study-slider-count b{color:#fff!important;font-weight:500!important}
  .writing-slider-head,
  .case-study-slider-head{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:12px!important;
    min-height:28px;
  }
  .writing-slider-head>span,
  .case-study-slider-head>span{line-height:1.2!important}

  /* Keep mobile presentation pages perfectly centred inside the viewport. */
  .presentation-stage{width:100vw!important;max-width:100vw!important;padding:0!important;margin:0!important}
  .presentation-slide{width:100vw!important;max-width:100vw!important;margin:0!important;padding:0!important}
  .presentation-mobile-deck{
    box-sizing:border-box!important;
    width:100vw!important;
    max-width:100vw!important;
    margin:0 auto!important;
    padding:68px 12px 26px!important;
    justify-items:center!important;
  }
  .presentation-mobile-page{
    box-sizing:border-box!important;
    width:calc(100vw - 24px)!important;
    max-width:calc(100vw - 24px)!important;
    margin:0 auto!important;
  }

  /* Recent thinking remains swipeable, but carries no redundant controls. */
  .latest-mobile-controls{display:none!important}
}

@media(max-width:390px) and (hover:none) and (pointer:coarse){
  .hero-title>span:first-child{top:calc(clamp(218px,38svh,300px) - .82em)!important}
  .hero-title .line-two{margin-top:clamp(218px,38svh,300px)!important}
  .hero-title .surname-text{font-size:.86em!important}
  .about.mobile-about-v3{padding-inline:16px!important}
  .about-mobile-title{font-size:clamp(32px,9.2vw,39px)!important}
  .about-mobile-copy p{font-size:15px!important}
}


/* Mobile experience v4 — precise hero, fixed About viewport, readable timeline and proof grid. */
@media(max-width:900px) and (hover:none) and (pointer:coarse){
  /* Hero: headshot stays where it was; ALEX and ZHORAVOVYCH share one explicit anchor. */
  .hero-title{
    --mobile-surname-y:clamp(228px,38.5svh,318px);
    position:relative!important;
    height:calc(var(--mobile-surname-y) + 1.72em)!important;
    margin:34px 0 0!important;
    font-size:clamp(41px,12.6vw,55px)!important;
    line-height:.8!important;
  }
  .hero-title>span:first-child{
    position:absolute!important;
    left:0!important;
    top:calc(var(--mobile-surname-y) - .79em)!important;
    z-index:6!important;
    width:auto!important;
    font-size:1em!important;
    line-height:.8!important;
  }
  .hero-title .line-two{
    position:absolute!important;
    left:0!important;
    top:var(--mobile-surname-y)!important;
    z-index:6!important;
    display:block!important;
    width:100%!important;
    margin:0!important;
    line-height:.8!important;
  }
  .hero-title .surname-text{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    font-size:1em!important;
    line-height:.8!important;
    letter-spacing:-.086em!important;
    white-space:nowrap!important;
  }
  /* Keep the v2/v3 headshot placement intact. */
  .portrait-wrap{
    top:clamp(142px,21.5svh,184px)!important;
    right:-10vw!important;
    width:min(91vw,455px)!important;
    height:clamp(290px,46svh,370px)!important;
  }

  /* About: the viewport is fixed; ONLY the descriptions move through the slot. */
  .about.mobile-about-v3{
    height:300svh!important;
    min-height:0!important;
    padding:0 18px!important;
    overflow:visible!important;
  }
  .about-mobile-carousel{height:100%!important}
  .about-mobile-sticky{
    position:sticky!important;
    top:0!important;
    z-index:12!important;
    width:100%!important;
    max-width:none!important;
    height:100svh!important;
    box-sizing:border-box!important;
    padding:24svh 0 0!important;
    background:#060606!important;
  }
  .about-mobile-sticky .eyebrow{
    margin:0 0 10px!important;
  }
  .about-mobile-title{
    margin:0!important;
    font-size:clamp(30px,8.55vw,38px)!important;
    line-height:.96!important;
    white-space:nowrap!important;
  }
  .about-mobile-title em{
    display:inline!important;
    margin:0!important;
    padding:0!important;
    line-height:inherit!important;
  }
  .about-mobile-divider{
    margin:14px 0 0!important;
  }
  .about-mobile-copy{display:none!important}
  .about-mobile-copy-stage{
    position:relative;
    height:220px;
    margin-top:0;
    overflow:hidden;
  }
  .about-mobile-panel{
    position:absolute;
    inset:0;
    padding-top:16px;
    will-change:transform,opacity;
    pointer-events:none;
  }
  .about-mobile-panel span{
    display:block;
    color:var(--muted);
    font-size:10px;
    line-height:1.3;
    letter-spacing:.16em;
    text-transform:uppercase;
  }
  .about-mobile-panel p{
    max-width:34em;
    margin:13px 0 0!important;
    color:#cdcdc7;
    font-size:16px!important;
    line-height:1.58!important;
    letter-spacing:-.01em;
  }

  /* Timeline: no vertical year guides; bars may extend beyond exact duration to fit their labels. */
  .journey-timeline-year::before{display:none!important}
  .journey-timeline-canvas{
    min-width:0!important;
    background:linear-gradient(180deg,rgba(255,255,255,.025),rgba(255,255,255,.008))!important;
  }
  .journey-timeline-bar{
    min-width:120px!important;
    padding:9px 11px 8px!important;
    box-sizing:border-box!important;
    overflow:hidden!important;
  }
  .journey-timeline-bar strong,
  .journey-timeline-bar span{
    min-width:0!important;
    max-width:100%!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
  }

  /* Results: every metric is visible at once, with the label beneath the number. */
  .social-slider-head>.metrics,
  [data-social-key="pdac"] .metrics{
    display:grid!important;
    width:100%!important;
    margin:0!important;
    padding:0!important;
    overflow:visible!important;
    gap:8px!important;
    align-items:start!important;
  }
  [data-social-key="interac"] .metrics{
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
  }
  [data-social-key="pdac"] .metrics{
    grid-template-columns:repeat(6,minmax(0,1fr))!important;
  }
  .social-showcase .metric,
  [data-social-key="pdac"] .metric{
    display:flex!important;
    flex-direction:column!important;
    align-items:flex-start!important;
    justify-content:flex-start!important;
    gap:5px!important;
    width:100%!important;
    min-width:0!important;
    white-space:normal!important;
  }
  .social-showcase .metric strong,
  [data-social-key="pdac"] .metric strong{
    display:block!important;
    width:100%!important;
    font-size:clamp(18px,5.4vw,23px)!important;
    line-height:.92!important;
    white-space:nowrap!important;
  }
  .social-showcase .metric span,
  [data-social-key="pdac"] .metric span{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
    font-size:6.4px!important;
    line-height:1.22!important;
    letter-spacing:.015em!important;
    white-space:normal!important;
    overflow-wrap:anywhere;
  }
  [data-social-key="pdac"] .metric strong{font-size:clamp(16px,4.7vw,20px)!important}
  [data-social-key="pdac"] .metric span{font-size:5.8px!important;line-height:1.18!important}

  /* Presentation reader refinements. */
  .presentation-close{
    overflow:hidden!important;
    clip-path:circle(50%)!important;
    -webkit-clip-path:circle(50%)!important;
    border-radius:50%!important;
    background:rgba(12,12,12,.5)!important;
    backdrop-filter:blur(10px)!important;
    -webkit-backdrop-filter:blur(10px)!important;
    box-shadow:0 0 26px 10px rgba(0,0,0,.28)!important;
  }
  .presentation-mobile-page-number{display:none!important}

  /* No divider between Quick Links and Recent Thinking on mobile. */
  .latest-section{
    border-top:0!important;
    padding-top:46px!important;
  }
}

@media(max-width:390px) and (hover:none) and (pointer:coarse){
  .hero-title{
    --mobile-surname-y:clamp(220px,37.5svh,300px);
    font-size:clamp(39px,12.1vw,47px)!important;
  }
  .about.mobile-about-v3{padding-inline:16px!important}
  .about-mobile-title{font-size:clamp(29px,8.25vw,35px)!important}
  .about-mobile-panel p{font-size:15px!important}
  .social-slider-head>.metrics,[data-social-key="pdac"] .metrics{gap:6px!important}
  .social-showcase .metric strong{font-size:17px!important}
  [data-social-key="pdac"] .metric strong{font-size:15px!important}
  .social-showcase .metric span{font-size:6px!important}
  [data-social-key="pdac"] .metric span{font-size:5.3px!important}
}


/* Mobile experience v5 — compact hero, frictionless About, prioritized timeline and centred proof. */
@media(max-width:900px) and (hover:none) and (pointer:coarse){
  /* Hero: move the whole composition upward and place the kicker directly below the surname. */
  .hero-dive-stage.mobile-hero-v5{
    min-height:100svh!important;
    height:auto!important;
    padding:72px 18px 38px!important;
    display:block!important;
    position:relative!important;
    overflow:hidden!important;
  }
  .mobile-hero-v5 .hero-title{
    position:relative!important;
    z-index:6!important;
    width:100%!important;
    height:auto!important;
    margin:54px 0 0!important;
    font-size:clamp(39px,12.15vw,52px)!important;
    line-height:.80!important;
    letter-spacing:-.078em!important;
  }
  .mobile-hero-v5 .hero-title>span:first-child,
  .mobile-hero-v5 .hero-title .line-two{
    position:relative!important;
    left:auto!important;
    top:auto!important;
    right:auto!important;
    bottom:auto!important;
    width:100%!important;
    height:auto!important;
    margin:0!important;
    line-height:.80!important;
  }
  .mobile-hero-v5 .hero-title>span:first-child{
    display:block!important;
    font-size:1em!important;
    margin-bottom:-.035em!important;
  }
  .mobile-hero-v5 .hero-title .surname-text{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    font-size:1em!important;
    line-height:.80!important;
    letter-spacing:-.086em!important;
    white-space:nowrap!important;
  }
  .mobile-hero-v5 .portrait-wrap{
    position:absolute!important;
    z-index:2!important;
    top:104px!important;
    right:-10vw!important;
    bottom:auto!important;
    width:min(91vw,455px)!important;
    height:clamp(286px,43svh,356px)!important;
    margin:0!important;
  }
  .mobile-hero-v5 .hero-kicker{
    position:relative!important;
    z-index:7!important;
    display:flex!important;
    order:initial!important;
    margin:8px 0 0!important;
    padding:0!important;
    max-width:100%!important;
    font-size:8.5px!important;
    line-height:1.42!important;
    letter-spacing:.105em!important;
  }
  .mobile-hero-v5 .hero-copy{
    position:relative!important;
    z-index:7!important;
    left:auto!important;
    right:auto!important;
    top:auto!important;
    bottom:auto!important;
    width:100%!important;
    max-width:none!important;
    margin:25px 0 0!important;
    padding:0!important;
  }
  .mobile-hero-v5 .hero-copy p{
    margin:0!important;
    font-size:15.5px!important;
    line-height:1.5!important;
  }

  /* About v5: a shorter sticky viewport. Only the three descriptions move. */
  .about.mobile-about-v5{
    height:190svh!important;
    min-height:0!important;
    padding:0 18px!important;
    overflow:visible!important;
  }
  .about.mobile-about-v5>.eyebrow,
  .about.mobile-about-v5>.about-grid,
  .about.mobile-about-v5>.about-mobile-carousel{display:none!important}
  .about-mobile-v5-carousel{position:relative;width:100%;height:100%}
  .about-mobile-v5-sticky{
    position:sticky;
    top:0;
    z-index:12;
    width:100%;
    height:82svh;
    box-sizing:border-box;
    padding:20svh 0 0;
    background:#060606;
  }
  .about-mobile-v5-sticky .eyebrow{
    margin:0 0 9px!important;
    color:var(--muted);
    font-size:9px!important;
    letter-spacing:.18em!important;
  }
  .about-mobile-v5-title{
    margin:0!important;
    color:var(--fg);
    font-size:clamp(30px,8.55vw,38px)!important;
    line-height:.96!important;
    letter-spacing:-.055em!important;
    font-weight:400!important;
    white-space:nowrap!important;
  }
  .about-mobile-v5-title em{
    display:inline!important;
    margin:0!important;
    padding:0!important;
    font-family:Georgia,serif;
    font-size:inherit!important;
    line-height:inherit!important;
    font-weight:400!important;
    font-style:normal;
  }
  .about-mobile-v5-divider{
    width:100%;
    height:1px;
    margin:13px 0 0;
    background:rgba(255,255,255,.18);
  }
  .about-mobile-v5-stage{
    position:relative;
    height:222px;
    margin-top:0;
    overflow:hidden;
    contain:layout paint;
  }
  .about-mobile-v5-panel{
    position:absolute;
    inset:0;
    padding-top:15px;
    will-change:transform,opacity;
    transform:translate3d(0,0,0);
    backface-visibility:hidden;
    pointer-events:none;
  }
  .about-mobile-v5-panel span{
    display:block;
    color:var(--muted);
    font-size:10px;
    line-height:1.3;
    letter-spacing:.16em;
    text-transform:uppercase;
  }
  .about-mobile-v5-panel p{
    max-width:34em;
    margin:12px 0 0!important;
    color:#cdcdc7;
    font-size:16px!important;
    line-height:1.56!important;
    letter-spacing:-.01em;
  }

  /* Journey v5 retains the horizontal chart but prioritizes Work / Education / Volunteer vertically. */
  .journey-timeline-year::before{display:none!important}
  .journey-timeline-bar{overflow:hidden!important}

  /* Proof metrics: centre everything and use one shared type scale across Interac and PDAC. */
  [data-social-key="interac"] .metrics,
  [data-social-key="pdac"] .metrics{
    width:100%!important;
    margin:0!important;
    justify-items:center!important;
    align-items:start!important;
  }
  .social-showcase .metric,
  [data-social-key="pdac"] .metric{
    align-items:center!important;
    justify-content:flex-start!important;
    text-align:center!important;
  }
  .social-showcase .metric strong,
  [data-social-key="pdac"] .metric strong{
    font-size:clamp(16px,4.35vw,19px)!important;
    line-height:.94!important;
    text-align:center!important;
  }
  .social-showcase .metric span,
  [data-social-key="pdac"] .metric span{
    font-size:5.9px!important;
    line-height:1.2!important;
    text-align:center!important;
    overflow-wrap:normal!important;
    word-break:normal!important;
  }

  /* Latest: more breathing room after View all posts and no sticky touch-hover state. */
  .latest-heading{margin-bottom:40px!important}
  .latest-grid{margin-top:8px!important}
  .latest-card,
  .latest-card:hover,
  .latest-card:active,
  .latest-card:focus-visible{
    background:rgba(255,255,255,.36)!important;
    box-shadow:none!important;
    transform:none!important;
  }
  .latest-card .latest-card-footer i,
  .latest-card:hover .latest-card-footer i,
  .latest-card:active .latest-card-footer i,
  .latest-card:focus-visible .latest-card-footer i{
    transform:none!important;
  }
  .latest-profile-link:hover span,
  .latest-profile-link:active span{transform:none!important}
}

@media(max-width:390px) and (hover:none) and (pointer:coarse){
  .hero-dive-stage.mobile-hero-v5{padding:68px 16px 34px!important}
  .mobile-hero-v5 .hero-title{margin-top:48px!important;font-size:clamp(38px,11.9vw,46px)!important}
  .mobile-hero-v5 .portrait-wrap{top:96px!important;right:-14vw!important;width:96vw!important;height:clamp(272px,42svh,334px)!important}
  .mobile-hero-v5 .hero-copy p{font-size:15px!important}
  .about.mobile-about-v5{padding-inline:16px!important}
  .about-mobile-v5-title{font-size:clamp(29px,8.25vw,35px)!important}
  .about-mobile-v5-panel p{font-size:15px!important}
  .social-showcase .metric strong,[data-social-key="pdac"] .metric strong{font-size:15.5px!important}
  .social-showcase .metric span,[data-social-key="pdac"] .metric span{font-size:5.45px!important}
}


/* Mobile experience v6 — hero alignment, smoother About, chronological Journey and animated proof. */
@media(max-width:900px) and (hover:none) and (pointer:coarse){
  /* Hero: portrait begins below the 68px header; surname begins where the portrait ends. */
  .hero-dive-stage.mobile-hero-v5{
    --mobile-stage-pad-top:76px;
    --mobile-portrait-top:68px;
    --mobile-portrait-height:clamp(276px,40svh,320px);
    min-height:100svh!important;
    padding:var(--mobile-stage-pad-top) 18px 40px!important;
  }
  .mobile-hero-v5 .portrait-wrap{
    top:var(--mobile-portrait-top)!important;
    right:-10vw!important;
    width:min(91vw,455px)!important;
    height:var(--mobile-portrait-height)!important;
  }
  .mobile-hero-v5 .hero-title{
    margin-top:calc(var(--mobile-portrait-top) + var(--mobile-portrait-height) - var(--mobile-stage-pad-top) - .80em)!important;
    font-size:clamp(39px,12.15vw,52px)!important;
  }
  .mobile-hero-v5 .hero-title>span:first-child{margin-bottom:-.035em!important}
  .mobile-hero-v5 .hero-kicker{margin-top:9px!important}
  .mobile-hero-v5 .hero-copy{margin-top:27px!important}

  /* About v6: same composition, but the panels are driven directly by scrollY with no timed easing. */
  .about.mobile-about-v6{
    height:188svh!important;
    min-height:0!important;
    padding:0 18px!important;
    overflow:visible!important;
  }
  .about.mobile-about-v6>.eyebrow,
  .about.mobile-about-v6>.about-grid,
  .about.mobile-about-v6>.about-mobile-carousel,
  .about.mobile-about-v6>.about-mobile-v5-carousel{display:none!important}
  .about-mobile-v6-carousel{position:relative;width:100%;height:100%}
  .about-mobile-v6-sticky{
    position:sticky;
    top:0;
    z-index:12;
    width:100%;
    height:80svh;
    box-sizing:border-box;
    padding:19svh 0 0;
    background:#060606;
  }
  .about-mobile-v6-sticky .eyebrow{
    margin:0 0 9px!important;
    color:var(--muted);
    font-size:9px!important;
    letter-spacing:.18em!important;
  }
  .about-mobile-v6-title{
    margin:0!important;
    color:var(--fg);
    font-size:clamp(30px,8.55vw,38px)!important;
    line-height:.96!important;
    letter-spacing:-.055em!important;
    font-weight:400!important;
    white-space:nowrap!important;
  }
  .about-mobile-v6-title em{
    display:inline!important;
    margin:0!important;
    padding:0!important;
    font-family:Georgia,serif;
    font-size:inherit!important;
    line-height:inherit!important;
    font-weight:400!important;
    font-style:normal;
  }
  .about-mobile-v6-divider{
    width:100%;height:1px;margin:13px 0 0;background:rgba(255,255,255,.18);
  }
  .about-mobile-v6-stage{
    position:relative;height:222px;margin-top:0;overflow:hidden;
  }
  .about-mobile-v6-panel{
    position:absolute;inset:0;padding-top:15px;
    transform:translate3d(0,0,0);
    will-change:transform,opacity;
    backface-visibility:hidden;
    pointer-events:none;
  }
  .about-mobile-v6-panel span{
    display:block;color:var(--muted);font-size:10px;line-height:1.3;letter-spacing:.16em;text-transform:uppercase;
  }
  .about-mobile-v6-panel p{
    max-width:34em;margin:12px 0 0!important;color:#cdcdc7;font-size:16px!important;line-height:1.56!important;letter-spacing:-.01em;
  }
}

@media(max-width:390px) and (hover:none) and (pointer:coarse){
  .hero-dive-stage.mobile-hero-v5{
    --mobile-stage-pad-top:72px;
    --mobile-portrait-top:68px;
    --mobile-portrait-height:clamp(264px,39svh,292px);
    padding-left:16px!important;padding-right:16px!important;
  }
  .mobile-hero-v5 .portrait-wrap{right:-14vw!important;width:96vw!important}
  .mobile-hero-v5 .hero-title{font-size:clamp(38px,11.9vw,46px)!important}
  .about.mobile-about-v6{padding-inline:16px!important}
  .about-mobile-v6-title{font-size:clamp(29px,8.25vw,35px)!important}
  .about-mobile-v6-panel p{font-size:15px!important}
}


/* Mobile experience v7 — lifted hero and snap-controlled About. */
@media(max-width:900px) and (hover:none) and (pointer:coarse){
  /* Lift the complete hero composition while preserving the portrait/name relationship. */
  .hero{min-height:88svh!important;height:auto!important}
  .hero-dive-stage.mobile-hero-v5{
    --mobile-stage-pad-top:60px;
    --mobile-portrait-top:50px;
    --mobile-portrait-height:clamp(276px,40svh,320px);
    min-height:88svh!important;
    padding:var(--mobile-stage-pad-top) 18px 26px!important;
  }
  .mobile-hero-v5 .portrait-wrap{
    top:var(--mobile-portrait-top)!important;
    height:var(--mobile-portrait-height)!important;
  }
  .mobile-hero-v5 .hero-title{
    margin-top:calc(var(--mobile-portrait-top) + var(--mobile-portrait-height) - var(--mobile-stage-pad-top) - .80em)!important;
  }
  .mobile-hero-v5 .hero-kicker{margin-top:8px!important}
  .mobile-hero-v5 .hero-copy{margin-top:23px!important}

  /* Keep Quick Links centred in the mobile header and use the right CTA for LinkedIn. */
  .topbar nav{
    display:flex!important;
    position:absolute!important;
    left:50%!important;
    top:50%!important;
    transform:translate(-50%,-50%)!important;
    align-items:center!important;
    gap:0!important;
    white-space:nowrap!important;
  }
  .topbar nav a:first-child{display:none!important}
  .topbar nav a[href="#resources"]{
    display:block!important;
    font-size:11px!important;
    letter-spacing:.02em!important;
  }

  /* About v7 is a controlled three-position vertical carousel. */
  .about.mobile-about-v7{
    height:176svh!important;
    min-height:0!important;
    padding:0 18px!important;
    overflow:visible!important;
  }
  .about.mobile-about-v7>.eyebrow,
  .about.mobile-about-v7>.about-grid,
  .about.mobile-about-v7>.about-mobile-carousel,
  .about.mobile-about-v7>.about-mobile-v5-carousel,
  .about.mobile-about-v7>.about-mobile-v6-carousel{display:none!important}
  .about-mobile-v7-carousel{position:relative;width:100%;height:100%}
  .about-mobile-v7-sticky{
    position:sticky;
    top:0;
    z-index:12;
    width:100%;
    height:78svh;
    box-sizing:border-box;
    padding:18svh 0 0;
    background:#060606;
  }
  .about-mobile-v7-sticky .eyebrow{
    margin:0 0 9px!important;
    color:var(--muted);
    font-size:9px!important;
    letter-spacing:.18em!important;
  }
  .about-mobile-v7-title{
    margin:0!important;
    color:var(--fg);
    font-size:clamp(30px,8.55vw,38px)!important;
    line-height:.96!important;
    letter-spacing:-.055em!important;
    font-weight:400!important;
    white-space:nowrap!important;
  }
  .about-mobile-v7-title em{
    display:inline!important;
    margin:0!important;
    padding:0!important;
    font-family:Georgia,serif;
    font-size:inherit!important;
    line-height:inherit!important;
    font-weight:400!important;
    font-style:normal;
  }
  .about-mobile-v7-divider{width:100%;height:1px;margin:13px 0 0;background:rgba(255,255,255,.18)}
  .about-mobile-v7-stage{position:relative;height:222px;overflow:hidden}
  .about-mobile-v7-panel{
    position:absolute;
    inset:0;
    padding-top:15px;
    opacity:0;
    transform:translate3d(0,24px,0);
    transition:transform .32s cubic-bezier(.22,.8,.25,1),opacity .28s linear;
    backface-visibility:hidden;
    will-change:transform,opacity;
    pointer-events:none;
  }
  .about-mobile-v7-panel.is-active{opacity:1;transform:translate3d(0,0,0)}
  .about-mobile-v7-panel.is-before{opacity:0;transform:translate3d(0,-24px,0)}
  .about-mobile-v7-panel span{display:block;color:var(--muted);font-size:10px;line-height:1.3;letter-spacing:.16em;text-transform:uppercase}
  .about-mobile-v7-panel p{max-width:34em;margin:12px 0 0!important;color:#cdcdc7;font-size:16px!important;line-height:1.56!important;letter-spacing:-.01em}
}

@media(max-width:390px) and (hover:none) and (pointer:coarse){
  .hero-dive-stage.mobile-hero-v5{
    --mobile-stage-pad-top:56px;
    --mobile-portrait-top:46px;
    --mobile-portrait-height:clamp(264px,39svh,292px);
    min-height:87svh!important;
    padding-left:16px!important;
    padding-right:16px!important;
  }
  .about.mobile-about-v7{padding-inline:16px!important}
  .about-mobile-v7-title{font-size:clamp(29px,8.25vw,35px)!important}
  .about-mobile-v7-panel p{font-size:15px!important}
}


/* Mobile experience v8 — larger centred portrait and stricter About gesture gating. */
@media(max-width:900px) and (hover:none) and (pointer:coarse){
  .hero{min-height:96svh!important;height:auto!important}
  .hero-dive-stage.mobile-hero-v5{
    --mobile-portrait-top:50px;
    --mobile-portrait-height:clamp(391px,56.4svh,458px);
    min-height:96svh!important;
  }
  .mobile-hero-v5 .portrait-wrap{
    top:var(--mobile-portrait-top)!important;
    left:50%!important;
    right:auto!important;
    width:min(130vw,648px)!important;
    height:var(--mobile-portrait-height)!important;
    transform:translateX(-50%)!important;
    transform-origin:center top!important;
  }
  .mobile-hero-v5 .hero-title{
    margin-top:calc(var(--mobile-portrait-top) + var(--mobile-portrait-height) - var(--mobile-stage-pad-top) - .80em)!important;
  }
}

@media(max-width:390px) and (hover:none) and (pointer:coarse){
  .hero{min-height:95svh!important}
  .hero-dive-stage.mobile-hero-v5{
    --mobile-portrait-top:46px;
    --mobile-portrait-height:clamp(374px,55.2svh,425px);
    min-height:95svh!important;
  }
  .mobile-hero-v5 .portrait-wrap{
    left:50%!important;
    right:auto!important;
    width:min(134vw,564px)!important;
    transform:translateX(-50%)!important;
  }
}


/* Hero kicker uniform colour — desktop + mobile. */
.hero-kicker .hero-kicker-divider,
.hero-kicker .hero-kicker-location{
  color:inherit!important;
  opacity:1!important;
}


/* Mobile resources heading — keep the intended two-line composition. */
@media(max-width:900px) and (hover:none) and (pointer:coarse){
  .resources h2{
    font-size:clamp(32px,10.2vw,46px)!important;
    white-space:nowrap!important;
  }
}


/* Mobile portrait office scene — quiet illustrated day/night cycle. */
.mobile-office-scene{display:none}
@media(max-width:900px) and (hover:none) and (pointer:coarse){
  .mobile-hero-v5 .portrait-wrap{
    isolation:isolate!important;
    overflow:visible!important;
  }
  .mobile-office-scene{
    display:block;
    position:absolute;
    z-index:0;
    left:50%;
    bottom:2%;
    width:86%;
    height:auto;
    transform:translateX(-50%);
    overflow:visible;
    color:rgba(245,245,242,.24);
    pointer-events:none;
  }
  .mobile-office-scene .office-buildings path,
  .mobile-office-scene .office-sun path,
  .mobile-office-scene .office-sun circle,
  .mobile-office-scene .office-moon path{
    fill:none;
    stroke:currentColor;
    stroke-width:1.35;
    stroke-linecap:round;
    stroke-linejoin:round;
    vector-effect:non-scaling-stroke;
  }
  .mobile-office-scene .office-ground{opacity:.52}
  .mobile-office-scene .office-building-a{opacity:.58}
  .mobile-office-scene .office-building-b{opacity:.72}
  .mobile-office-scene .office-building-c{opacity:.48}
  .mobile-office-scene .office-sun,
  .mobile-office-scene .office-moon{
    transform-origin:492px 86px;
    animation-duration:60s;
    animation-timing-function:ease-in-out;
    animation-iteration-count:infinite;
  }
  .mobile-office-scene .office-sun{animation-name:mobile-office-sun-cycle}
  .mobile-office-scene .office-moon{animation-name:mobile-office-moon-cycle}
  .mobile-office-scene .office-light{
    fill:#fff;
    stroke:none;
    opacity:0;
    animation:mobile-office-window-cycle 60s ease-in-out infinite;
  }
  .mobile-office-scene .light-2,
  .mobile-office-scene .light-4{animation-delay:.7s}
  .mobile-office-scene .light-5{animation-delay:1.1s}
  .mobile-office-scene .light-6{animation-delay:.35s}
  .mobile-hero-v5 .portrait-halo{z-index:1!important;opacity:.42}
  .mobile-hero-v5 .portrait{z-index:2!important}
}
@keyframes mobile-office-sun-cycle{
  0%,42%{opacity:.62;transform:translateY(0) rotate(0deg)}
  48%,94%{opacity:0;transform:translateY(8px) rotate(10deg)}
  100%{opacity:.62;transform:translateY(0) rotate(0deg)}
}
@keyframes mobile-office-moon-cycle{
  0%,44%{opacity:0;transform:translateY(-8px)}
  50%,92%{opacity:.66;transform:translateY(0)}
  98%,100%{opacity:0;transform:translateY(-8px)}
}
@keyframes mobile-office-window-cycle{
  0%,48%{opacity:0}
  54%,86%{opacity:.88}
  94%,100%{opacity:0}
}
@media(max-width:900px) and (hover:none) and (pointer:coarse) and (prefers-reduced-motion:reduce){
  .mobile-office-scene .office-sun{animation:none!important;opacity:.58!important}
  .mobile-office-scene .office-moon,
  .mobile-office-scene .office-light{display:none!important;animation:none!important}
}


/* Mobile office v2 — taller skyline and explicit 3s/15s day-night timing. */
@media(max-width:900px) and (hover:none) and (pointer:coarse){
  .mobile-office-scene .office-buildings{
    transform-box:fill-box;
    transform-origin:center bottom;
    transform:translateY(-18px) scaleY(1.18);
  }
  .mobile-office-scene .office-sun,
  .mobile-office-scene .office-moon,
  .mobile-office-scene .office-light{
    animation:none!important;
  }
  .mobile-office-scene .office-sun{
    opacity:.62;
    transform:translateY(0) rotate(0deg);
    transition:opacity .9s ease,transform .9s ease;
  }
  .mobile-office-scene .office-moon{
    opacity:0;
    transform:translateY(-8px);
    transition:opacity .9s ease,transform .9s ease;
  }
  .mobile-office-scene .office-light{
    opacity:0;
    transition:opacity .55s ease;
  }
  .mobile-office-scene.is-night .office-sun{
    opacity:0;
    transform:translateY(8px) rotate(10deg);
  }
  .mobile-office-scene.is-night .office-moon{
    opacity:.66;
    transform:translateY(0);
  }
  .mobile-office-scene.is-night .office-light{opacity:.9}
  .mobile-office-scene.is-night .light-2,
  .mobile-office-scene.is-night .light-4{transition-delay:.18s}
  .mobile-office-scene.is-night .light-5{transition-delay:.34s}
  .mobile-office-scene.is-night .light-6{transition-delay:.1s}
}
@media(max-width:900px) and (hover:none) and (pointer:coarse) and (prefers-reduced-motion:reduce){
  .mobile-office-scene .office-buildings{transform:translateY(-18px) scaleY(1.18)!important}
  .mobile-office-scene .office-sun{opacity:.58!important;transform:none!important}
  .mobile-office-scene .office-moon,
  .mobile-office-scene .office-light{display:none!important}
}


/* Mobile Toronto skyline refinement — CN Tower + staggered office lights. */
@media(max-width:900px) and (hover:none) and (pointer:coarse){
  .mobile-office-scene .office-cn-tower{
    color:rgba(245,245,242,.18);
    opacity:.72;
    transform-origin:center bottom;
    transform:translateY(-5px) scaleY(1.03);
  }
  .mobile-office-scene .office-cn-tower path{
    fill:none;
    stroke:currentColor;
    stroke-width:1.05;
    stroke-linecap:round;
    stroke-linejoin:round;
    vector-effect:non-scaling-stroke;
  }

  /* Night lights turn on gradually, like different offices staying late. */
  .mobile-office-scene.is-night .light-1{transition-delay:.08s}
  .mobile-office-scene.is-night .light-7{transition-delay:.42s}
  .mobile-office-scene.is-night .light-3{transition-delay:.72s}
  .mobile-office-scene.is-night .light-12{transition-delay:1.04s}
  .mobile-office-scene.is-night .light-2{transition-delay:1.34s}
  .mobile-office-scene.is-night .light-9{transition-delay:1.68s}
  .mobile-office-scene.is-night .light-6{transition-delay:2.02s}
  .mobile-office-scene.is-night .light-10{transition-delay:2.38s}
  .mobile-office-scene.is-night .light-4{transition-delay:2.72s}
  .mobile-office-scene.is-night .light-8{transition-delay:3.08s}
  .mobile-office-scene.is-night .light-5{transition-delay:3.46s}
  .mobile-office-scene.is-night .light-11{transition-delay:3.88s}

  /* Lights switch off promptly when day returns instead of inheriting night delays. */
  .mobile-office-scene:not(.is-night) .office-light{transition-delay:0s!important}
}
@media(max-width:900px) and (hover:none) and (pointer:coarse) and (prefers-reduced-motion:reduce){
  .mobile-office-scene .office-cn-tower{transform:translateY(-5px) scaleY(1.03)!important}
}


/* Mobile CN Tower v2 — recognizable silhouette in the right-side negative space. */
@media(max-width:900px) and (hover:none) and (pointer:coarse){
  .mobile-office-scene .office-cn-tower{
    color:rgba(245,245,242,.19);
    opacity:.76;
    transform-origin:553px 408px;
    transform:translate(28px,-11px) scaleY(1.08);
  }
  .mobile-office-scene .office-cn-tower path{
    fill:none;
    stroke:currentColor;
    stroke-width:1.1;
    stroke-linecap:round;
    stroke-linejoin:round;
    vector-effect:non-scaling-stroke;
  }
  .mobile-office-scene .office-cn-tower .cn-deck,
  .mobile-office-scene .office-cn-tower .cn-upper-pod{
    fill:rgba(245,245,242,.025);
  }
  .mobile-office-scene .office-cn-tower .cn-mast,
  .mobile-office-scene .office-cn-tower .cn-antenna{
    stroke-width:.95;
  }
}
@media(max-width:900px) and (hover:none) and (pointer:coarse) and (prefers-reduced-motion:reduce){
  .mobile-office-scene .office-cn-tower{transform:translate(28px,-11px) scaleY(1.08)!important}
}


/* Mobile CN Tower v3 — taller, left-side silhouette with one rotating platform. */
@media(max-width:900px) and (hover:none) and (pointer:coarse){
  .mobile-office-scene .office-cn-tower{
    color:rgba(245,245,242,.2);
    opacity:.8;
    transform-origin:111px 408px;
    transform:translate(-18px,-20px) scaleY(1.16);
  }
  .mobile-office-scene .office-cn-tower path,
  .mobile-office-scene .office-cn-tower ellipse{
    fill:none;
    stroke:currentColor;
    stroke-width:1.12;
    stroke-linecap:round;
    stroke-linejoin:round;
    vector-effect:non-scaling-stroke;
  }
  .mobile-office-scene .office-cn-tower .cn-platform-body{
    fill:rgba(245,245,242,.025);
  }
  .mobile-office-scene .office-cn-tower .cn-mast,
  .mobile-office-scene .office-cn-tower .cn-antenna{
    stroke-width:.96;
  }
  .mobile-office-scene .office-cn-tower .cn-platform-rotor{
    stroke:rgba(245,245,242,.5);
    stroke-width:1.18;
    stroke-dasharray:18 68;
    animation:mobile-cn-platform-rotate 4.8s linear infinite;
  }
}
@keyframes mobile-cn-platform-rotate{
  to{stroke-dashoffset:-86}
}
@media(max-width:900px) and (hover:none) and (pointer:coarse) and (prefers-reduced-motion:reduce){
  .mobile-office-scene .office-cn-tower{
    transform:translate(-18px,-20px) scaleY(1.16)!important;
  }
  .mobile-office-scene .office-cn-tower .cn-platform-rotor{
    animation:none!important;
    stroke-dasharray:none!important;
    opacity:.35;
  }
}


/* Mobile CN Tower v4 — higher platform and true building occlusion. */
@media(max-width:900px) and (hover:none) and (pointer:coarse){
  .mobile-office-scene .office-building-occluder{
    fill:#060606!important;
    stroke:none!important;
    opacity:1!important;
  }
  .mobile-office-scene .office-cn-tower .cn-platform-rotor{
    transform-origin:111px 156px;
  }
}