:root{--ink:#151515;--paper:#f4f4ef;--lime:#d0ff62;--muted:#a4a49e;--line:#393936}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;background:var(--ink);color:var(--paper);font-family:'DM Sans',Arial,sans-serif;font-size:16px;line-height:1.55}::selection{background:var(--lime);color:var(--ink)}a{color:inherit;text-decoration:none}button,a,summary{-webkit-tap-highlight-color:transparent}a:focus-visible,summary:focus-visible{outline:3px solid #839aef;outline-offset:6px}.skip{position:fixed;top:-80px;left:20px;padding:12px;background:var(--lime);color:var(--ink);z-index:100}.skip:focus{top:10px}.progress{height:3px;background:var(--lime);position:fixed;top:0;left:0;width:0;z-index:30}header{height:94px;padding:0 5%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.wordmark{font-weight:800;font-size:36px;letter-spacing:-2px}.wordmark span{font-size:14px;vertical-align:top;display:inline-block;padding-top:9px;letter-spacing:0}nav{display:flex;gap:38px;align-items:center;font-size:14px}nav a{position:relative}nav a:after{content:'';position:absolute;height:1px;background:currentColor;bottom:-5px;left:0;width:0;transition:width .3s}nav a:hover:after{width:100%}nav sup{font-size:10px;color:var(--lime)}.contact-nav{border:1px solid #696962;padding:10px 19px;border-radius:40px}.contact-nav span{margin-left:20px}.hero{padding:38px 5% 20px}.hero-meta,.hero-foot{display:flex;justify-content:space-between;font-size:12px;letter-spacing:1px}.hero-meta{color:#b7b7af;margin-bottom:36px}h1{font-family:'Manrope',Arial,sans-serif;font-size:clamp(50px,8.6vw,142px);line-height:1.06;font-weight:800;letter-spacing:-.068em;margin:0}.line{display:block}.outline{color:var(--lime)}.spark{display:inline-block;color:var(--lime);font-size:.85em;line-height:1;margin-left:.28em;transition:transform .8s cubic-bezier(.2,.8,.2,1)}h1:hover .spark{transform:rotate(100deg)}.hero-bottom{display:grid;grid-template-columns:1fr 1fr 100px;align-items:center;gap:35px;margin:42px 0 52px}.role{font-size:16px;font-weight:500}.role span{color:var(--muted);font-size:14px}.intro{font-size:18px;max-width:440px;margin:0;color:#c9c9c1}.circle-link{height:70px;width:70px;border-radius:50%;border:1px solid #66665e;display:grid;place-items:center;font-size:32px;justify-self:end;transition:background .3s,color .3s,transform .3s}.circle-link:hover{background:var(--lime);color:var(--ink);transform:translateY(5px)}.hero-foot{border-top:1px solid var(--line);padding-top:18px;color:#96968e}.section{padding:100px 5%}.work{background:var(--paper);color:var(--ink)}.section-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:40px;margin-bottom:54px}.eyebrow{font-size:12px;letter-spacing:1.6px;display:block;font-weight:500}h2{font-family:Manrope,Arial,sans-serif;font-size:clamp(38px,4.9vw,72px);line-height:1.08;font-weight:500;letter-spacing:-.05em;margin:24px 0 0}h2 em{font-family:Georgia,serif;font-weight:400}.section-heading>p{font-size:16px;color:#66665e;max-width:330px}.project{min-width:0}.open-arrow{font-size:24px;width:43px;height:43px;border-radius:50%;border:1px solid currentColor;display:grid;place-items:center;transition:transform .4s}.project-visual:hover .open-arrow{transform:rotate(45deg)}.funnel{display:flex;align-items:center;gap:10px;font-size:10px}.funnel span{padding:9px 12px;background:#151515;color:#d0ff62;border-radius:30px}.funnel i{font-style:normal}.focus{background:#ff834e}h3{font-size:21px;letter-spacing:-.7px;font-weight:500;margin:0}details{border-top:1px solid #d0d0c6;border-bottom:1px solid #d0d0c6;scroll-margin-top:30px}summary{cursor:pointer;font-size:14px;list-style:none;display:flex;justify-content:space-between;padding:13px 0}summary::-webkit-details-marker{display:none}summary span{font-size:19px;transition:transform .3s}details[open] summary span{transform:rotate(45deg)}.case-body{padding-bottom:24px;animation:appear .3s ease}.case-body h4{font-size:14px;margin:18px 0 6px}.case-body p{font-size:15px;color:#56564f;margin:0}.about{display:grid;grid-template-columns:1fr 1fr;gap:8%;border-bottom:1px solid var(--line)}.about h2 em{color:var(--lime)}.about-meta{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin-top:34px}.about-meta div:last-child{grid-column:1/-1}.about-meta small{display:block;font-size:10px;letter-spacing:1px;color:#909088;margin-bottom:5px}.about-meta span{font-size:14px}.capabilities{padding-bottom:90px}.skill-row{border-top:1px solid var(--line);padding:26px 0;display:grid;grid-template-columns:60px 1fr 40%;align-items:center;gap:15px;transition:padding .3s,color .3s}.skill-row:last-child{border-bottom:1px solid var(--line)}.skill-row>span{font-size:12px;color:#97978d}.skill-row h3{font-size:clamp(22px,2.5vw,36px)}.skill-row p{font-size:14px;color:#a7a79e;margin:0}.skill-row:hover{color:var(--lime);padding-left:12px}.experience{background:#e8e8df;color:var(--ink)}.job{display:grid;grid-template-columns:20% 42% 1fr;gap:20px;border-top:1px solid #c8c8bc;padding:25px 0}.job>span{font-size:13px;color:#64645b;padding-top:5px}.job h3 small{display:block;font-size:13px;letter-spacing:0;color:#68685f;margin-top:5px}.job p{font-size:14px;margin:3px 0;color:#5d5d54}.contact{background:var(--lime);color:var(--ink)}.contact-title{font:600 clamp(52px,9.5vw,145px)/1.05 Manrope,Arial,sans-serif;letter-spacing:-.065em;display:block;margin:34px 0 60px;position:relative}.contact-title>span{position:absolute;right:0;bottom:5px;font-weight:400;transition:transform .4s}.contact-title:hover>span{transform:translate(10px,-10px)}.contact-bottom{display:flex;justify-content:space-between;gap:25px;border-top:1px solid #9bbd4c;padding-top:25px;font-size:15px}.contact-bottom a:hover{text-decoration:underline}footer{padding:24px 5%;display:flex;justify-content:space-between;color:#9d9d94;font-size:12px}.reveal{opacity:1}.motion .reveal{opacity:0;transform:translateY(28px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1)}.motion .reveal.visible{opacity:1;transform:translateY(0)}@keyframes appear{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}
@media(min-width:1600px){body{max-width:1800px;margin:auto}}@media(max-width:850px){header{height:80px}nav{gap:20px}.hero-meta{font-size:10px}h1{font-size:9vw}.hero-bottom{grid-template-columns:1fr 1fr;gap:20px}.circle-link{display:none}.intro{font-size:16px}.section{padding:70px 5%}.funnel{gap:4px}.funnel span{padding:6px;font-size:8px}.about{gap:6%}.job{grid-template-columns:22% 1fr}.job p{grid-column:2}.contact-bottom{font-size:13px}}
@media(max-width:580px){header{padding:0 6%;height:74px}.wordmark{font-size:30px}nav{gap:16px;font-size:12px}nav sup{display:none}.contact-nav{padding:7px 10px}.contact-nav span{margin-left:5px}.hero{padding:28px 6% 18px}.hero-meta{display:block;margin-bottom:35px}.hero-meta span:last-child{display:block;margin-top:5px;font-size:9px}h1{font-size:9.3vw;letter-spacing:-.055em;line-height:1.13}.hero-bottom{grid-template-columns:1fr;margin:30px 0}.role{margin:0}.intro{font-size:16px;max-width:90%}.hero-foot{font-size:8px;gap:15px}.section{padding:60px 6%}.section-heading{display:block;margin-bottom:32px}.section-heading>p{margin-top:23px;font-size:14px}h2{font-size:43px}.eyebrow{font-size:10px}.funnel{gap:8px}.funnel span{font-size:9px;padding:8px}.about{grid-template-columns:1fr}.skill-row{grid-template-columns:30px 1fr;gap:9px}.skill-row h3{font-size:23px}.skill-row p{grid-column:2;font-size:13px;margin-top:7px}.job{grid-template-columns:1fr;gap:7px;padding:22px 0}.job p{grid-column:1;font-size:13px}.job h3{font-size:21px}.contact-title{font-size:12vw;margin-bottom:38px}.contact-bottom{flex-direction:column;gap:14px}.contact-title>span{font-size:.8em}.contact .eyebrow{font-size:9px}footer{font-size:10px;gap:20px}footer span:last-child{max-width:130px;text-align:right}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.motion .reveal{opacity:1;transform:none}}
/* Personal photography and a layered, interactive data-field background. */
.hero{position:relative;isolation:isolate;overflow:hidden;background:#121611}.hero>:not(.parallax-background){position:relative;z-index:1}.parallax-background{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0;--mx:0px;--my:0px;--sy:0px}.light-field{position:absolute;inset:-30%;background:radial-gradient(ellipse at 76% 25%,#91c94830 0,transparent 42%),radial-gradient(ellipse at 35% 70%,#43877f25 0,transparent 40%);transform:translate3d(var(--mx),calc(var(--my) + var(--sy)),0);animation:light-drift 18s ease-in-out infinite alternate}.data-grid{position:absolute;inset:-150px;background-image:linear-gradient(#d0ff6210 1px,transparent 1px),linear-gradient(90deg,#d0ff6210 1px,transparent 1px);background-size:72px 72px;mask-image:linear-gradient(90deg,transparent 5%,#000 65%,#000);transform:translate3d(calc(var(--mx) * -.4),calc(var(--sy) * .5),0) rotate(-12deg);opacity:.7}.orbit{position:absolute;border:1px solid #d0ff621e;border-radius:50%;width:620px;height:620px;right:-210px;top:30px;transform:translate3d(calc(var(--mx) * -1),calc(var(--my) * -1 + var(--sy)),0)}.orbit-two{width:840px;height:840px;right:-320px;top:-80px}.hero-stage{display:grid;grid-template-columns:minmax(0,1.75fr) minmax(0,1fr);align-items:center;gap:4%;margin:16px 0}.hero h1{font-size:clamp(44px,6.2vw,102px);letter-spacing:-.064em;line-height:1.12}.hero .spark{margin-left:.16em}.hero-portrait{margin:0;transform:rotate(3deg);max-width:390px;justify-self:end;width:100%;padding:10px;background:#262d23;border:1px solid #576044;box-shadow:0 22px 60px #0005}.photo-window{overflow:hidden;position:relative}.hero-portrait .photo-window{aspect-ratio:3/4}.photo-window img{display:block;width:100%;height:116%;max-width:none;position:absolute;top:-8%;object-fit:cover;object-position:50% 58%;transform:translate3d(0,var(--photo-y,0px),0);will-change:transform}.hero-portrait figcaption{display:flex;justify-content:space-between;gap:8px;padding:14px 4px 4px;font-size:10px;letter-spacing:1px;color:#d3d8c9}.hero-bottom{margin-top:40px}.hero-foot{align-items:center;gap:15px}.about-portrait{margin:42px 0 0;max-width:420px}.about-portrait .photo-window{aspect-ratio:4/4.5}.about-portrait img{object-position:50% 47%}.about-portrait figcaption{font-size:11px;letter-spacing:1.5px;color:#a4a49e;margin-top:14px}.contact-intro{display:flex;align-items:center;gap:24px}.contact-portrait{width:128px;height:96px;overflow:hidden;margin:0;border-radius:60px;flex-shrink:0}.contact-portrait img{width:100%;height:100%;object-fit:cover;object-position:48% 50%;display:block}.motion-paused .light-field{animation-play-state:paused}.motion-paused .parallax-background{--mx:0px!important;--my:0px!important;--sy:0px!important}.motion-paused .photo-window img{transform:none}.motion-paused .reveal{opacity:1;transform:none;transition:none}.motion-paused{scroll-behavior:auto}.motion-paused *{animation-play-state:paused!important}.motion-paused .spark,.motion-paused .open-arrow{transform:none!important}.motion-paused *{transition:none!important}@keyframes light-drift{from{opacity:.5;scale:1}to{opacity:1;scale:1.12}}
@media(min-width:1600px){.hero h1{font-size:100px}}@media(max-width:850px){.hero-stage{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:3%}.hero h1{font-size:6vw}.hero-portrait{padding:6px}.hero-portrait figcaption{font-size:8px;letter-spacing:.4px}.hero-portrait figcaption span:last-child{display:none}.about-portrait{margin-top:30px}.contact-portrait{width:110px;height:82px}}@media(max-width:580px){.hero-stage{grid-template-columns:1fr;gap:28px}.hero h1{font-size:9.2vw}.hero-portrait{width:65%;max-width:250px;justify-self:center;margin:5px 0 8px}.hero-portrait .photo-window{aspect-ratio:4/4.5}.hero-portrait figcaption{font-size:9px}.hero-portrait figcaption span:last-child{display:block;font-size:7px}.hero-foot{flex-wrap:wrap}.hero-foot>span:first-child{width:100%}.about-portrait{max-width:100%}.about-portrait .photo-window{aspect-ratio:1}.contact-intro{gap:16px}.contact-intro .eyebrow{line-height:1.6;max-width:190px}.contact-portrait{width:90px;height:70px}.data-grid{background-size:55px 55px}.light-field{animation:none}.orbit{opacity:.5}}
@media(prefers-reduced-motion:reduce){.light-field{animation:none}.parallax-background{--mx:0px!important;--my:0px!important;--sy:0px!important}.photo-window img{transform:none!important;will-change:auto}}
/* Narrative structure and honest, labelled evidence placeholders. */
.hero h1{font-size:clamp(42px,5.6vw,91px)}.story{border-bottom:1px solid var(--line)}.story-lead{max-width:890px;font-size:21px;color:#cacac1;line-height:1.7;margin:0 0 46px}.approach-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:26px}.approach-grid>div{border-top:1px solid #5a634b;padding-top:20px}.approach-grid>div>span{font-size:12px;color:var(--lime);letter-spacing:1px}.approach-grid h3{margin-top:16px}.approach-grid p{color:#b4b4ab;font-size:16px}.project{margin-bottom:80px}.project:last-child{margin-bottom:0}.project summary{font-size:15px;padding:18px 0}.story-case{padding:28px 0 12px}.story-case .case-title{font:500 clamp(28px,3.2vw,44px)/1.15 Manrope,Arial,sans-serif;letter-spacing:-1.5px;margin:16px 0 12px;max-width:860px}.story-case .case-meta{font-size:14px;color:#68685f;padding-bottom:20px}.case-context{display:grid;grid-template-columns:1fr 1fr;gap:40px}.story-case h4{font-size:17px;margin:24px 0 10px}.story-case p{font-size:16px;line-height:1.7;max-width:960px}.role-box{border-left:3px solid #718745;padding:2px 24px 18px;margin-top:25px;background:#eaece0}.case-steps{padding-left:24px;max-width:1000px}.case-steps li{padding:5px 0 13px 8px}.case-steps h5{font-size:17px;font-weight:600;margin:7px 0}.case-outcome{padding:5px 25px 24px;background:#dfe9cb;margin:24px 0}.case-outcome p{color:#25301b}.case-insight{max-width:900px}.evidence-heading{border-top:1px solid #cecec2;margin-top:36px;padding-top:8px}.evidence-heading p{font-size:14px;color:#6b6b61}.evidence-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin:24px 0}.evidence-frame{margin:0;min-width:0}.frame-blank{aspect-ratio:16/9;border:1px dashed #919885;background:#e9ece2;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;color:#656d59}.frame-cross{font-size:36px;line-height:1;font-weight:400}.frame-blank>span:last-child{font-size:12px;letter-spacing:1px}.evidence-frame h5{font-size:13px;letter-spacing:.6px;margin:18px 0 10px}.evidence-frame figcaption>p{font-size:14px;line-height:1.65}.evidence-frame .frame-note{font-size:13px;color:#727267;border-top:1px solid #d8d8ce;padding-top:10px;margin-top:12px}.work .section-heading>p{max-width:390px}.case-body{animation:none}
@media(max-width:850px){.approach-grid{grid-template-columns:1fr 1fr}.evidence-grid{grid-template-columns:1fr 1fr}.evidence-frame:last-child{grid-column:1/-1;max-width:calc(50% - 11px)}.hero h1{font-size:5.2vw}.funnel{margin-top:20px}.case-context{gap:24px}.story-lead{font-size:18px}}
@media(max-width:580px){.hero h1{font-size:8.6vw}.approach-grid{grid-template-columns:1fr;gap:16px}.story-lead{font-size:17px}.case-context{grid-template-columns:1fr;gap:0}.project{margin-bottom:55px}.story-case .case-title{font-size:30px}.evidence-grid{grid-template-columns:1fr;gap:30px}.evidence-frame:last-child{grid-column:auto;max-width:none}.story-case p{font-size:16px}.evidence-frame figcaption>p{font-size:14px}.evidence-frame .frame-note{font-size:13px}.role-box{padding-left:16px;padding-right:16px}.case-outcome{padding-left:16px;padding-right:16px}.hero .spark{font-size:.65em}}
/* Horizontal editorial gallery; details expand beneath the gallery. */
.work{overflow:hidden}.work .section-heading{margin-bottom:28px}.project-toggle{width:100%;display:flex;align-items:center;justify-content:space-between;gap:20px;border:0;border-top:1px solid #babfb0;border-bottom:1px solid #babfb0;background:transparent;color:var(--ink);padding:16px 0;font:500 16px 'DM Sans',Arial,sans-serif;cursor:pointer;transition:padding .3s,background .3s}.project-toggle:hover,.project-toggle[aria-expanded="true"]{background:#e0e8d2;padding-inline:16px}.toggle-icon{width:32px;height:32px;display:grid;place-items:center;border-radius:50%;border:1px solid #7a846a;font-size:24px;font-weight:400;transition:transform .35s,background .35s}.project-toggle[aria-expanded="true"] .toggle-icon{transform:rotate(45deg);background:var(--lime)}.project-toggle:focus-visible,.close-case:focus-visible{outline:3px solid #6170bc;outline-offset:4px}.project-panels{margin-top:22px}.project-panels details{scroll-margin-top:24px}.work-enhanced .project-panels details>summary{display:none}.work-enhanced .project-panels details:not([open]){display:none}.project-panels .story-case{padding-top:34px}.close-case{display:flex;align-items:center;justify-content:space-between;gap:45px;cursor:pointer;border:1px solid #979e8a;background:transparent;padding:13px 20px;color:var(--ink);font:500 15px 'DM Sans',Arial,sans-serif;margin:30px 0 12px}.close-case:hover{background:var(--lime)}.close-case span{font-size:24px;line-height:1}.project-panels details[open]{border-top:2px solid #6b7f4a}.project-panels .story-case>.eyebrow{color:#52613d}@media(max-width:580px){.project-toggle{font-size:15px}.project-panels .story-case{padding-top:25px}}
/* Scroll down through a pinned desktop gallery; release after the final card. */
.work{overflow:visible}
/* Short branded entrance. CSS closes the overlay even if application JS fails. */
.site-intro{display:none}.intro-enabled .site-intro{position:fixed;inset:0;z-index:100;display:flex;flex-direction:column;justify-content:center;align-items:center;background:#141811;color:#d0ff62;pointer-events:none;animation:intro-curtain 1.4s cubic-bezier(.76,0,.24,1) forwards;gap:22px}.intro-brand{font:800 clamp(80px,15vw,190px)/1 Manrope,Arial,sans-serif;letter-spacing:-.085em;animation:intro-mark .65s cubic-bezier(.2,.75,.2,1) both}.intro-brand>span{font-size:.15em;vertical-align:top;letter-spacing:0;display:inline-block;margin-top:.9em;margin-left:.25em}.intro-disciplines{display:flex;gap:18px;align-items:center;font-size:12px;letter-spacing:2px}.intro-disciplines i{font-style:normal;color:#66704e}.intro-rule{width:180px;height:2px;background:#d0ff62;transform-origin:left;animation:intro-rule .8s cubic-bezier(.2,.7,.3,1) both}.intro-edition{font-size:10px;letter-spacing:1.5px;color:#b9c3aa;position:absolute;bottom:32px}.intro-enabled .hero h1 .line{animation:hero-line .9s cubic-bezier(.2,.75,.2,1) both;animation-delay:.65s}.intro-enabled .hero h1 .line:nth-child(2){animation-delay:.78s}.intro-enabled .hero h1 .line:nth-child(3){animation-delay:.91s}.hero h1 .line{transform-origin:left center}.intro-enabled .hero-portrait{animation:portrait-arrive 1s cubic-bezier(.2,.75,.2,1) .75s both}.intro-finished .site-intro{display:none}.intro-finished .hero-portrait{animation:none}.hero-stage{perspective:1100px}
/* Depth from the supplied photography, rather than an unrelated 3D object. */
.depth-surface{--tilt-x:0deg;--tilt-y:0deg;--shine-x:50%;--shine-y:50%;will-change:auto}.hero-portrait.depth-surface{transform:perspective(1100px) rotateX(var(--tilt-x)) rotateY(var(--tilt-y)) rotate(3deg);transition:transform .35s ease-out,box-shadow .35s}.hero-portrait.depth-surface:hover{box-shadow:0 32px 75px #0007,0 0 35px #b5f15a16}.hero-portrait:after{content:'';pointer-events:none;position:absolute;inset:10px;background:radial-gradient(circle at var(--shine-x) var(--shine-y),#ffffff18,transparent 55%);mix-blend-mode:screen}.depth-surface .open-arrow{transition:transform .45s cubic-bezier(.2,.85,.2,1),background .3s}.depth-surface:hover .open-arrow{transform:rotate(45deg) scale(1.1)}
/* Low-contrast ambient light ribbons: entirely decorative and non-blocking. */
.ambient-band{position:absolute;width:105%;height:38%;left:15%;top:34%;border-radius:50%;border-top:1px solid #ccff6666;border-bottom:2px solid #91e4ba33;box-shadow:0 -8px 22px #b6f35f10,inset 0 9px 25px #b6f35f08;transform:translate3d(calc(var(--mx) * -.5),var(--sy),0) rotate(-18deg);animation:ambient-ribbon 14s ease-in-out infinite alternate;opacity:.6}.band-two{top:43%;left:3%;width:120%;height:32%;border-color:#8acecd44;animation-delay:-5s;animation-duration:19s;opacity:.4}.band-three{top:53%;left:17%;height:23%;width:95%;border-color:#c9fa6333;animation-delay:-9s;animation-duration:16s;opacity:.45}.ambient-halo{position:absolute;right:5%;top:18%;width:50%;height:65%;background:radial-gradient(ellipse,#a1e76520,transparent 65%);filter:blur(30px);animation:halo-breathe 10s ease-in-out infinite alternate;pointer-events:none}.parallax-background{background:linear-gradient(90deg,#121611 0%,#12161188 46%,transparent 80%)}.hero-meta,.hero-bottom,.hero h1{text-shadow:0 2px 22px #12161166}
/* Line-by-line editorial reveals and kinetic action labels. */
.headline-mask{display:block;overflow:hidden;padding-bottom:.08em;margin-bottom:-.08em}.headline-line{display:block}.motion .reveal .headline-line{transform:translateY(110%);transition:transform .85s cubic-bezier(.22,.75,.2,1);transition-delay:calc(var(--line-index,0) * 85ms)}.motion .reveal.visible .headline-line{transform:translateY(0)}.approach-grid>div{transition:transform .5s cubic-bezier(.2,.8,.2,1),border-color .4s}.approach-grid>div:hover{border-color:var(--lime)}.approach-grid h3{transition:color .3s}.approach-grid>div:hover h3{color:var(--lime)}.roll-label{display:inline-block;position:relative;overflow:hidden;vertical-align:middle;line-height:1.4}.roll-front,.roll-back{display:block;transition:transform .4s cubic-bezier(.2,.8,.2,1)}.roll-back{position:absolute;inset:0;transform:translateY(110%)}a:hover .roll-front,a:focus-visible .roll-front{transform:translateY(-110%)}a:hover .roll-back,a:focus-visible .roll-back{transform:translateY(0)}.motion-paused .headline-line{transform:none!important}.motion-paused .site-intro{display:none}.motion-paused .depth-surface{--tilt-x:0deg!important;--tilt-y:0deg!important}.motion-paused .roll-front{transform:none!important}.motion-paused .roll-back{display:none}.motion-paused .hero h1 .line{animation:none!important;opacity:1!important;transform:none!important;clip-path:none!important}
@keyframes intro-curtain{0%,58%{transform:translateY(0);visibility:visible}100%{transform:translateY(-101%);visibility:hidden}}@keyframes intro-mark{from{opacity:0;transform:translateY(24px) scale(.95);filter:blur(6px)}to{opacity:1;transform:translateY(0) scale(1);filter:blur(0)}}@keyframes intro-rule{from{transform:scaleX(0)}to{transform:scaleX(1)}}@keyframes hero-line{from{opacity:0;transform:translateY(30px);clip-path:inset(100% 0 0 0)}to{opacity:1;transform:translateY(0);clip-path:inset(0)}}@keyframes portrait-arrive{from{opacity:0;transform:perspective(1100px) rotateY(-12deg) rotate(0deg) translateY(25px)}to{opacity:1;transform:perspective(1100px) rotateY(0) rotate(3deg) translateY(0)}}@keyframes ambient-ribbon{from{translate:0 -10px;rotate:-3deg;opacity:.3}to{translate:-3% 20px;rotate:4deg;opacity:.65}}@keyframes halo-breathe{from{opacity:.4;scale:.9}to{opacity:.9;scale:1.15}}
@media(max-width:580px){.intro-disciplines{font-size:9px;gap:10px;letter-spacing:1px}.ambient-band{width:180%;left:-20%;top:44%;opacity:.3;animation:none}.band-two{top:49%}.band-three{top:56%}.ambient-halo{width:90%;right:0;animation:none}.hero-portrait.depth-surface{transform:rotate(3deg)}.intro-enabled .hero-portrait{animation-duration:.7s}}
@media(prefers-reduced-motion:reduce){.site-intro{display:none!important}.hero h1 .line{opacity:1!important;transform:none!important;clip-path:none!important}.headline-line{transform:none!important}.depth-surface{--tilt-x:0deg!important;--tilt-y:0deg!important}.ambient-band,.ambient-halo{animation:none!important}.roll-front{transform:none!important}.roll-back{display:none}}
.tab-inactive .ambient-band,.tab-inactive .ambient-halo,.tab-inactive .light-field{animation-play-state:paused}.contact-nav .roll-label{margin-left:0}.contact-nav .roll-front,.contact-nav .roll-back{margin-left:0}

/* ============================================================
   LAYOUT REVISION: dán TOÀN BỘ khối này vào CUỐI file style.css
   (hoặc lưu thành file riêng và <link> ngay SAU style.css)

   1. Bỏ scroll-hijacking ở khu Selected work → gallery tĩnh
   2. Header dính (sticky) để nav luôn trong tầm tay
   3. Nhịp khoảng cách + giới hạn bề ngang trên màn hình lớn
   4. Ẩn khung "IMAGE TO ADD" cho tới khi có ảnh thật
   5. Responsive cho bố cục mới
   ============================================================ */

/* --- 1. Header dính ---------------------------------------- */
header{
  position:sticky;top:0;z-index:40;
  background:rgba(21,21,21,.88);
  -webkit-backdrop-filter:saturate(150%) blur(16px);
  backdrop-filter:saturate(150%) blur(16px);
}
.progress{z-index:41}

/* --- 2. Gallery dự án tĩnh (thay cho rail cuộn ngang) ------- */
.work{overflow:visible}

/* Bề mặt card */

/* Cỡ chữ số liệu: card featured to, 3 card còn lại nhỏ lại cho vừa cột */

/* Caption dưới card */
.project-panels{margin-top:44px}

/* --- 3. Nhịp khoảng cách & bề ngang ------------------------- */
.section{padding-block:clamp(64px,7.2vw,112px)}
.work .section-heading{margin-bottom:46px}
.section-heading>p{max-width:360px}
@media(min-width:1700px){
  header,.hero,.section,footer{
    padding-inline:clamp(5%,calc((100% - 1560px) / 2),14%)}
}

/* --- 4. Khung ảnh minh chứng ------------------------------- */
/* Xoá đúng 1 dòng dưới đây khi đã có screenshot thật để hiện lại. */
.evidence-heading,.evidence-grid{display:none}

/* --- 5. Responsive ----------------------------------------- */
@media(max-width:700px){
  header{height:70px}
}

/* ============================================================
   LAYOUT REVISION: dán TOÀN BỘ khối này vào CUỐI file style.css
   (hoặc lưu thành file riêng và <link> ngay SAU style.css)

   1. Header dính
   2. Selected work: lưới tĩnh (mặc định + fallback khi không ghim được)
   3. Selected work: dải cuộn ngang có ghim (bản chính trên desktop)
   4. Nhịp khoảng cách + bề ngang
   5. Ẩn khung "IMAGE TO ADD"
   ============================================================ */

/* --- 1. Header dính ---------------------------------------- */
header{
  position:sticky;top:0;z-index:40;
  background:rgba(21,21,21,.88);
  -webkit-backdrop-filter:saturate(150%) blur(16px);
  backdrop-filter:saturate(150%) blur(16px);
}
.progress{z-index:41}

/* --- 2. Lưới tĩnh -------------------------------------------
   Đây là mặc định: chạy khi JS chưa/không chạy, trên điện thoại,
   khi cửa sổ thấp, khi bật reduced-motion hoặc bấm "Pause motion".
   ------------------------------------------------------------ */
.work{overflow:visible}
.project-panels{margin-top:44px}
@media(max-width:700px){
  header{height:70px}
}

/* --- 3. Dải cuộn ngang có ghim -------------------------------
   Chỉ bật khi app.js thêm class .work-pinned. Tiêu đề đứng yên bên
   trái, các card trượt ngang qua nó theo cuộn dọc. Không thanh cuộn,
   không nút điều hướng.
   ------------------------------------------------------------ */

/* Dải: tiêu đề là "thẻ" đầu tiên, trôi ra trái cùng các card.
   (Ghim cứng tiêu đề tại chỗ sẽ bị card chạy đè lên.) */
/* Trong dải ngang card featured hẹp hơn nên để 1 cột: funnel nằm dưới,
   đủ rộng để 4 chặng LEAD → MQL → SQL → STUDENT nằm gọn trên một dòng. */

/* Ô ảnh dự án: dùng khi thay khối màu bằng ảnh thật.
   Thêm <img class="project-photo" src="..." alt="..."> vào .project-visual. */
.project-visual:has(.project-photo)>:not(.project-photo){position:relative;z-index:1}
.project-visual:has(.project-photo){
  background:#151515;
  color:#f4f4ef;
  text-shadow:0 1px 18px rgba(0,0,0,.55)}

/* Không thanh cuộn, không nút, không chỉ báo trang: chỉ cuộn. */

/* --- 4. Nhịp khoảng cách & bề ngang ------------------------- */
.section{padding-block:clamp(64px,7.2vw,112px)}
.work .section-heading{margin-bottom:46px}
.section-heading>p{max-width:360px}
@media(min-width:1700px){
  header,.hero,.section,footer{
    padding-inline:clamp(5%,calc((100% - 1560px) / 2),14%)}
}

/* --- 5. Khung ảnh minh chứng ------------------------------- */
/* Xoá đúng 1 dòng dưới đây khi đã có screenshot thật để hiện lại. */
.evidence-heading,.evidence-grid{display:none}

/* Selected project media */
.project-visual:has(.project-photo)::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.38),rgba(0,0,0,.02) 35%,rgba(0,0,0,.76));pointer-events:none;z-index:0}
.project-media{margin:48px 0;padding-top:32px;border-top:1px solid #444}
.project-media-heading{margin-bottom:24px}
.project-media-heading h4{font-size:clamp(22px,3vw,34px);margin:12px 0}
.project-media-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;align-items:start}
.project-media-item{margin:0;min-width:0}
.media-image-link{position:relative;display:block;background:#222;overflow:hidden;border-radius:12px}
.media-image-link img{display:block;width:100%;height:420px;object-fit:contain;transition:transform .5s ease}
.media-image-link:hover img{transform:scale(1.025)}
.media-image-link>span{position:absolute;right:12px;bottom:12px;background:#151515dd;padding:9px 13px;border-radius:30px;color:#f4f4ef;font-size:11px}
.project-media-item video{display:block;width:100%;height:420px;background:#080808;border-radius:12px;object-fit:contain}
.project-media-item figcaption{padding:16px 0 4px}
.project-media-item figcaption h5{font-size:17px;margin:0 0 8px}
.project-media-item figcaption p{font-size:13px;line-height:1.6;max-width:48ch}
.project-media-item figcaption a{text-decoration:underline;text-underline-offset:3px}
#case-access .project-media-grid{grid-template-columns:1fr}
#case-access .media-image-link img{height:auto;max-height:580px}
@media(max-width:650px){.project-media-grid{grid-template-columns:1fr}.media-image-link img,.project-media-item video{height:380px}.project-media{margin-top:32px}}
@media(prefers-reduced-motion:reduce){.media-image-link img{transition:none}}
.motion-paused .media-image-link img{transition:none}
/* Project directory: readable vertical case list */
.work-list{overflow:visible}
.work-list .section-heading{margin-bottom:56px}
.project-directory{display:block}
.project-entry{padding:46px 0;border-top:1px solid #b7bbae;scroll-margin-top:100px}
.project-list-head{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(28px,5vw,76px);align-items:start}
.project-list-image{position:relative;display:block;overflow:hidden;border-radius:8px;background:#e5e6de;aspect-ratio:1.15}
.project-list-image img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.project-list-image:hover img{transform:scale(1.04)}
#project-access .project-list-image img{object-fit:contain;background:#fff7e9}
.project-number{position:absolute;left:18px;top:18px;border-radius:50%;width:44px;height:44px;display:grid;place-items:center;background:#d0ff62;color:#151515;font-size:14px;font-weight:600}
.project-list-copy .eyebrow{font-size:12px;letter-spacing:.08em;color:#5b6648}
.project-list-copy h3{font-size:clamp(30px,3.6vw,52px);letter-spacing:-.045em;line-height:1.08;margin:15px 0}
.project-purpose{font-size:21px;line-height:1.4;margin:0 0 12px}
.project-scope{font-size:14px;color:#666b5e;margin-bottom:20px}
.my-work{font-size:16px;line-height:1.65;margin:0 0 24px;max-width:64ch}
.my-work b{display:block;font-size:12px;letter-spacing:.08em;text-transform:uppercase;margin-bottom:5px}
.achievement-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px;padding:22px 0;border-block:1px solid #b7bbae}
.achievement-strip strong{display:block;font-size:clamp(23px,2.3vw,37px);line-height:1.1;letter-spacing:-.045em;color:#25331c;overflow-wrap:anywhere}
.achievement-strip span{display:block;font-size:13px;line-height:1.4;margin-top:9px;color:#5c6255}
.work-list .project-toggle{font-size:15px}
.work-list .project-panels{margin-top:0}
.work-list .project-panels details{scroll-margin-top:110px}
.work-list .project-panels details[open]{margin-top:32px}
.work-evidence-gallery{display:grid;grid-template-columns:1fr;gap:34px;margin:36px 0}
.proof-image{margin:0;min-width:0}.proof-image>a{display:block;position:relative;border:1px solid #c9cbbf;border-radius:8px;overflow:hidden;background:#fff}
.proof-image img{display:block;width:100%;height:auto;max-height:650px;object-fit:contain}
.proof-image>a>span{position:absolute;right:12px;bottom:12px;background:#151515e8;color:#fff;padding:9px 13px;border-radius:30px;font-size:12px}
.proof-image figcaption{padding-top:14px}.proof-image h5{font-size:17px;margin:0 0 7px}.proof-image figcaption p{font-size:13px;line-height:1.55;color:#616757}
.focus-list-art{height:100%;display:flex;flex-direction:column;justify-content:center;padding:30px;gap:24px;background:#d0ff62;color:#151515}
.focus-list-art strong{font-size:clamp(48px,7vw,100px);letter-spacing:-.06em}.focus-list-art span{font-size:13px;letter-spacing:.1em}
.work-list .case-outcome strong{font-size:1.15em}
@media(max-width:800px){.project-list-head{grid-template-columns:1fr;gap:24px}.project-list-image{aspect-ratio:1.7}.project-entry{padding:32px 0}.achievement-strip strong{font-size:28px}.work-list .section-heading{margin-bottom:30px}}
@media(max-width:420px){.achievement-strip{gap:10px}.achievement-strip strong{font-size:23px}.achievement-strip span{font-size:12px}}
@media(prefers-reduced-motion:reduce){.project-list-image img{transition:none}}
.motion-paused .project-list-image img{transition:none}
/* Track record stays behind the projects as they scroll into view. */
.work-track-record{position:relative;isolation:isolate;background:#151515;color:#f4f4ef;padding-top:48px;padding-bottom:0;overflow:visible}
.track-record-sticky{display:flex;flex-direction:column;justify-content:center}
.record-hero{display:flex;align-items:center;justify-content:space-between;gap:40px;padding:26px 0 32px;border-bottom:1px solid #3f4538;background:radial-gradient(ellipse at 80% 50%,#d0ff6212,transparent 60%)}
.record-heading .eyebrow{color:#b7bdad;font-size:12px}
.record-heading h2{font-size:clamp(34px,4.6vw,68px);line-height:1.03;margin:20px 0 0;letter-spacing:-.055em}
.record-heading h2 em{color:#d0ff62;font-style:normal}
.record-experience{text-align:center;min-width:32%}
.record-experience strong{display:block;font-size:clamp(100px,14vw,210px);line-height:1;font-weight:600;letter-spacing:-.08em;color:#d0ff62}
.record-experience>span{font-size:14px;color:#c4c8bd}
.record-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));padding-top:24px;gap:0}
.record-stat{position:relative;padding:20px 28px;border-right:1px solid #3f4538;min-width:0}
.record-stat:first-child{padding-left:0}.record-stat:last-child{border-right:0}
.record-stat strong{display:block;color:#d0ff62;font-size:clamp(40px,5.3vw,80px);font-weight:500;line-height:1.1;letter-spacing:-.055em;font-variant-numeric:tabular-nums}
.record-unit{display:block;font-size:12px;letter-spacing:.1em;margin-top:12px;color:#f4f4ef}
.record-stat p{font-size:14px;color:#aeb5a3;margin:7px 0 0}
.record-footer{display:flex;justify-content:space-between;gap:20px;padding:24px 0;color:#8f9785;font-size:11px;letter-spacing:.08em}

.work-track-record .project-entry:first-child{border-top:0}
.work-track-record .achievement-strip{padding:0;gap:10px;border:0;margin:20px 0}
.work-track-record .achievement-strip>div{position:relative;padding:18px 13px;min-width:0;border:1px solid #cad7b6;background:#e4edda;border-radius:8px;transition:background .3s,transform .3s,border-color .3s}
.work-track-record .achievement-strip>div:hover{background:#d0ff62;transform:translateY(-4px);border-color:#9dbe65}
.work-track-record .achievement-strip strong{color:#294918;font-size:clamp(22px,2.1vw,33px);font-weight:650;letter-spacing:-.05em;font-variant-numeric:tabular-nums}
.work-track-record .achievement-strip span{color:#4f6141}
.budget-highlight{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:18px 22px;background:#192116;color:#d0ff62;border-radius:9px;position:relative;overflow:hidden;margin-top:20px}
.budget-highlight::before{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 15%,#d0ff621a 45%,transparent 70%);transform:translateX(-100%);transition:transform .7s;pointer-events:none}
.budget-highlight:hover::before{transform:translateX(100%)}
.budget-highlight>span{font-size:12px;letter-spacing:.1em;color:#cfddbf}
.budget-highlight>div{display:flex;align-items:baseline;gap:9px}
.budget-highlight strong{font-size:clamp(38px,4vw,58px);line-height:1;letter-spacing:-.06em;font-weight:600;font-variant-numeric:tabular-nums}
.budget-highlight>div>span{font-size:13px;color:#bbd39c}
.work-track-record .case-outcome{border-left:3px solid #71994b;border-radius:0 8px 8px 0}
.work-track-record .case-outcome strong{color:#315c17}
[data-count]{font-variant-numeric:tabular-nums}
@media(min-width:801px) and (max-height:750px){.record-hero{padding-block:15px}.record-experience strong{font-size:120px}.record-heading h2{font-size:42px}.record-stat strong{font-size:46px}.record-stats{padding-top:12px}.record-stat{padding-block:14px}.record-footer{padding-block:16px}}
@media(max-width:800px){.record-hero{gap:20px}.record-heading h2{font-size:38px}.record-experience strong{font-size:100px}.record-stats{gap:0}.record-stat{padding:15px 12px}.record-stat strong{font-size:clamp(28px,6.5vw,48px)}.record-unit{font-size:10px}.record-stat p{font-size:12px}.record-footer{font-size:10px}.work-track-record .achievement-strip strong{font-size:24px}.work-track-record .achievement-strip>div{padding:15px 10px}}
@media(max-width:480px){.record-hero{align-items:flex-end}.record-heading h2{font-size:32px}.record-heading .eyebrow{font-size:10px}.record-experience strong{font-size:84px}.record-experience>span{display:block;max-width:110px;font-size:12px}.record-footer span:first-child{display:none}.record-footer{justify-content:flex-end}.work-track-record .achievement-strip{grid-template-columns:1fr}.work-track-record .achievement-strip>div{display:flex;align-items:center;justify-content:space-between;gap:14px}.work-track-record .achievement-strip span{margin:0;text-align:right;max-width:55%}.work-track-record .achievement-strip strong{font-size:30px;white-space:nowrap}.budget-highlight{padding:17px 14px}.budget-highlight>span{max-width:100px}.budget-highlight strong{font-size:43px}}
@media(prefers-reduced-motion:reduce){.achievement-strip>div,.budget-highlight::before{transition:none!important}}
.motion-paused .achievement-strip>div,.motion-paused .budget-highlight::before{transition:none}
/* Translucent project grid. */
.work-track-record .project-entry{position:relative;min-width:0;padding:25px;background:rgba(244,244,239,.79);border:1px solid rgba(119,134,100,.4);transition:background .3s,border-color .3s;align-self:stretch}
.work-track-record .project-entry:first-child{border-top:1px solid rgba(119,134,100,.4)}
.work-track-record .project-entry:hover{background:rgba(244,244,239,.89);border-color:#8ba762}
.work-track-record .project-entry::before,.work-track-record .project-entry::after{content:"";position:absolute;width:16px;height:16px;border-color:#688548;pointer-events:none}
.work-track-record .project-entry::before{top:10px;left:10px;border-top:1px solid;border-left:1px solid}
.work-track-record .project-entry::after{bottom:10px;right:10px;border-bottom:1px solid;border-right:1px solid}
.work-track-record .project-list-head{display:flex;flex-direction:column;gap:22px;height:100%}
.work-track-record .project-list-image{width:100%;aspect-ratio:1.65;border-radius:3px;flex:none}
.work-track-record .project-number{width:34px;height:34px;left:12px;top:12px;font-size:12px}
.work-track-record .project-list-copy{display:flex;flex-direction:column;width:100%;flex:1;min-width:0}
.work-track-record .project-list-copy h3{font-size:clamp(25px,2.3vw,34px);margin:13px 0;line-height:1.1}
.work-track-record .project-list-copy .eyebrow{font-size:11px;line-height:1.5;min-height:33px}
.work-track-record .project-purpose{font-size:18px;line-height:1.45}
.work-track-record .project-scope{font-size:13px;margin:0 0 18px}
.work-track-record .my-work{font-size:15px;line-height:1.65;margin-bottom:18px}
.work-track-record .achievement-strip{grid-template-columns:1fr;gap:6px;margin:16px 0 22px}
.work-track-record .achievement-strip>div{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:13px;background:rgba(212,235,181,.64);border-color:rgba(116,147,73,.25);border-radius:3px}
.work-track-record .achievement-strip>div:hover{transform:translateX(3px);background:rgba(208,255,98,.9)}
.work-track-record .achievement-strip strong{font-size:clamp(23px,2.2vw,31px);white-space:nowrap;flex:none}
.work-track-record .achievement-strip span{font-size:12px;text-align:right;max-width:53%;margin:0;line-height:1.4;color:#394d2c}
.work-track-record .budget-highlight{padding:16px 13px;margin-top:0;gap:10px;border-radius:4px}
.work-track-record .budget-highlight>span{font-size:11px;max-width:85px}
.work-track-record .budget-highlight strong{font-size:clamp(34px,3.1vw,45px)}
.work-track-record .project-toggle{margin-top:auto;min-height:52px;font-size:14px}
.work-track-record .focus-list-art{padding:20px;gap:9px}.work-track-record .focus-list-art strong{font-size:60px}
/* Open the selected case across the grid, keeping the disclosure next to its project. */
.work-track-record .project-entry:has(details[open]){grid-column:1/-1;background:rgba(244,244,239,.96);height:auto}
.work-track-record .project-entry:has(details[open]) .project-list-head{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:40px;height:auto}
.work-track-record .project-entry:has(details[open]) .project-list-copy h3{font-size:clamp(30px,3.6vw,48px)}
.work-track-record .project-entry:has(details[open]) .project-list-image{aspect-ratio:1.25}
.work-track-record .project-entry:has(details[open]) .project-list-copy .eyebrow{min-height:0}
@media(max-width:1100px) and (min-width:701px){.work-track-record .project-directory{grid-template-columns:repeat(2,minmax(0,1fr))}.work-track-record .project-entry{padding:22px}}
@media(max-width:700px){.work-track-record .project-directory{grid-template-columns:1fr;padding:0 0 30px}.work-track-record .project-entry{padding:22px}.work-track-record .project-entry:has(details[open]) .project-list-head{display:flex;gap:22px}.work-track-record .project-entry:has(details[open]) .project-list-image{aspect-ratio:1.65}.work-track-record .project-list-copy .eyebrow{min-height:0}.work-track-record .achievement-strip strong{font-size:29px}.work-track-record .project-list-copy h3{font-size:30px}}
@media(prefers-reduced-motion:reduce){.work-track-record .project-entry{transition:none}}
.motion-paused .project-entry{transition:none}

/* Project rows. */
.work-track-record .project-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));align-items:stretch;gap:0}
.work-track-record .project-row>.project-entry{grid-column:var(--project-column)}
.work-track-record .project-row>.project-entry:has(details[open]){grid-column:1/-1}
@media(min-width:701px) and (max-width:1100px){.work-track-record .project-row{grid-template-columns:repeat(2,minmax(0,1fr))}.work-track-record .project-row>.project-entry{grid-column:auto}.work-track-record .project-row>.project-entry:has(details[open]){grid-column:1/-1}}
@media(max-width:700px){.work-track-record .project-row{grid-template-columns:minmax(0,1fr)}.work-track-record .project-row>.project-entry{grid-column:1/-1}}

/* Journey: a stationary introduction beside the naturally scrolling career story. */
.journey-scroll{overflow:visible;background:#e8e8df}
.journey-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(40px,7vw,120px);align-items:start}
.journey-intro{position:sticky;top:120px;padding-bottom:24px}
.journey-intro h2{font-size:clamp(48px,6vw,88px);line-height:1.03;letter-spacing:-.06em;margin:24px 0 38px}
.journey-intro h2 em{font-style:normal;color:#49632c}
.journey-chapter{display:flex;align-items:baseline;gap:20px;font-variant-numeric:tabular-nums;border-top:1px solid #bfc5b4;padding-top:26px}
.journey-current{font-size:clamp(90px,13vw,176px);line-height:1;letter-spacing:-.08em;color:#49632c}
.journey-total{font-size:24px;color:#71766a}
.journey-timeline{position:relative;min-width:0;padding-bottom:12vh}
.journey-rail{position:absolute;left:11px;top:8px;bottom:12vh;width:2px;background:#c2c9b7}
.journey-fill{width:100%;height:100%;background:#526e32;transform:scaleY(var(--journey-progress,0));transform-origin:top}
.journey-scroll .journey-job{position:relative;display:block;border:0;padding:0 0 clamp(90px,12vh,150px) 64px;min-height:340px}
.journey-scroll .journey-job:last-child{padding-bottom:0;min-height:260px}
.journey-dot{position:absolute;left:0;top:2px;width:24px;height:24px;display:grid;place-items:center;border-radius:50%;background:#bcc4af;color:#fff;font-size:19px;line-height:1;transition:background .3s,color .3s}
.journey-scroll .journey-index{display:block;font-size:13px;letter-spacing:.1em;color:#5f6654;margin-bottom:40px}
.journey-scroll .journey-job-content>span:not(.journey-index){font-size:14px;color:#5f6654;display:block;margin-bottom:14px}
.journey-scroll .journey-job h3{font-size:clamp(28px,3vw,42px);letter-spacing:-.035em;line-height:1.16;margin:0}
.journey-scroll .journey-job h3 small{font-size:16px;line-height:1.5;color:#5b644f;margin-top:16px;font-weight:400}
.journey-scroll .journey-job p{font-size:18px;line-height:1.6;color:#505747;margin:25px 0 0;max-width:470px}
.journey-job.is-current .journey-dot,.journey-job.is-past .journey-dot{background:#49632c;color:#d0ff62}
.journey-job.is-current .journey-index{color:#38531f}
@media(max-width:800px){.journey-layout{grid-template-columns:minmax(0,1fr);gap:55px}.journey-intro{position:relative;top:auto;padding:0}.journey-intro h2{font-size:56px;margin-bottom:0}.journey-chapter{display:none}.journey-scroll .journey-job{padding-left:45px;min-height:0;padding-bottom:70px}.journey-scroll .journey-job:last-child{min-height:0}.journey-scroll .journey-index{margin-bottom:24px}.journey-scroll .journey-job h3{font-size:30px}.journey-scroll .journey-job p{font-size:16px}.journey-timeline{padding-bottom:0}.journey-rail{bottom:0}}
@media(min-width:801px) and (max-height:650px){.journey-intro{top:90px}.journey-intro h2{font-size:48px;margin:16px 0 22px}.journey-current{font-size:88px}}
@media(prefers-reduced-motion:reduce){.journey-dot{transition:none}.journey-intro{position:relative;top:auto}.journey-fill{transform:scaleY(1)}}
.motion-paused .journey-dot{transition:none}.motion-paused .journey-intro{position:relative;top:auto}.motion-paused .journey-fill{transform:scaleY(1)}

/* About and career history share one continuous, split-column story. */
.about-journey .journey-intro{top:100px}
.about-journey .journey-intro h2{font-size:clamp(36px,4vw,58px);margin:20px 0 24px}
.about-journey .about-portrait{margin:0;max-width:340px}
.about-journey .about-portrait .photo-window{aspect-ratio:1.55}
.about-journey .about-portrait img{object-position:50% 38%}
.about-journey .about-portrait figcaption{font-size:11px;color:#616958;margin-top:10px}
.about-journey .journey-chapter{margin-top:24px;padding-top:16px;justify-content:space-between;align-items:center;max-width:340px;gap:12px}
.about-journey .journey-chapter>span{font-size:11px;letter-spacing:.08em;color:#616958}
.about-journey .journey-current{font-size:36px;letter-spacing:-.04em}
.about-journey .journey-total{font-size:16px}
.journey-story{min-width:0}
.journey-bio{padding:0 0 76px}
.journey-bio p{font-size:17px;line-height:1.75;color:#505747;margin:0 0 22px}
.journey-bio .large-copy{font-size:30px;line-height:1.2;color:#20251b;letter-spacing:-.04em;margin-bottom:28px}
.journey-bio .about-meta{border-top:1px solid #c2c9b7;padding-top:28px;margin-top:34px}
.journey-bio .about-meta small{font-size:12px;color:#686f5e}
.journey-bio .about-meta span{font-size:14px;color:#303928}
.journey-history{scroll-margin-top:110px}
.journey-history-title{font-size:28px;letter-spacing:-.035em;padding-top:32px;border-top:1px solid #bfc5b4;margin:0 0 52px}
@media(min-width:801px) and (max-height:740px){.about-journey .journey-intro{top:88px}.about-journey .journey-intro h2{font-size:36px;margin:14px 0 18px}.about-journey .about-portrait{max-width:280px}.about-journey .about-portrait .photo-window{aspect-ratio:1.8}.about-journey .journey-chapter{margin-top:16px;max-width:280px}}
@media(max-width:800px){.about-journey .journey-intro{position:relative;top:auto}.about-journey .journey-intro h2{font-size:clamp(38px,8vw,58px)}.about-journey .about-portrait{max-width:420px}.about-journey .about-portrait .photo-window{aspect-ratio:1.3}.about-journey .journey-chapter{display:none}.journey-bio{padding-bottom:38px}.journey-bio p{font-size:16px}.journey-history-title{font-size:26px}}
@media(prefers-reduced-motion:reduce){.about-journey .journey-intro{position:relative;top:auto}}
.motion-paused .about-journey .journey-intro{position:relative;top:auto}
/* v17: hero name + actions, grouped project directory. */
.hero h1 .hero-kicker{display:block;font-family:'DM Sans',Arial,sans-serif;font-size:clamp(16px,1.45vw,22px);font-weight:500;letter-spacing:0;line-height:1.4;color:#e7ecdc;margin:0 0 .9em}
.hero-copy{min-width:0}.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}
.hero-btn{display:inline-flex;align-items:center;gap:10px;padding:12px 20px;border:1px solid #66665e;border-radius:40px;font-size:14px;font-weight:500;color:var(--paper);transition:background .3s,color .3s,border-color .3s}
.hero-btn:hover{border-color:var(--lime);color:var(--lime)}
.hero-btn-primary{background:var(--lime);border-color:var(--lime);color:var(--ink)}
.hero-btn-primary:hover{background:transparent;color:var(--lime)}
.work-track-record .project-group{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);align-items:end;gap:12px 40px;padding:30px clamp(20px,3vw,34px);background:rgba(20,24,18,.92);border:1px solid rgba(119,134,100,.4);color:var(--paper)}
.work-track-record .project-group .eyebrow{grid-column:1/-1;color:var(--lime)}
.work-track-record .project-group h3{font-family:Manrope,Arial,sans-serif;font-size:clamp(28px,3vw,44px);font-weight:500;letter-spacing:-.045em;line-height:1.1;margin:0}
.work-track-record .project-group p{margin:0;max-width:560px;font-size:15px;line-height:1.6;color:#b9c0ad}
.work-track-record .project-group-agency{margin-top:64px}
@media(max-width:700px){.work-track-record .project-group{grid-template-columns:1fr;padding:24px 22px}.work-track-record .project-group-agency{margin-top:40px}.hero-actions{margin-top:20px}.hero-btn{padding:11px 16px;font-size:13px}}
@media(max-width:480px){.record-stat strong{font-size:clamp(22px,6.2vw,48px)}}

/* More visible autonomous motion, with native reduced-motion support. */
@media(prefers-reduced-motion:no-preference){
.light-field{background:radial-gradient(ellipse at 76% 25%,#91c94860 0,transparent 45%),radial-gradient(ellipse at 35% 70%,#43877f50 0,transparent 43%);animation:light-sweep 5s ease-in-out infinite alternate}
.data-grid{opacity:.95;animation:grid-travel 7s linear infinite}
.ambient-band{border-top-color:#ccff66aa;border-bottom-color:#91e4ba77;box-shadow:0 -8px 24px #b6f35f30,inset 0 9px 25px #b6f35f18;animation:ribbon-sweep 4.2s ease-in-out infinite alternate;opacity:.85}
.band-two{animation-duration:5.5s;animation-delay:-2s;border-color:#8acecd88}
.band-three{animation-duration:4.8s;animation-delay:-3s}
.ambient-halo{background:radial-gradient(ellipse,#a1e76550,transparent 65%);animation:halo-sweep 4s ease-in-out infinite alternate}
.orbit{border-color:#d0ff6255;animation:orbit-drift 6s ease-in-out infinite alternate}.orbit-two{animation-delay:-3s;animation-duration:8s}
.hero-portrait.depth-surface,.intro-enabled .hero-portrait,.intro-finished .hero-portrait{animation:portrait-float 5.5s ease-in-out infinite;transform-style:preserve-3d;will-change:transform}
.about-portrait{animation:portrait-float 7s ease-in-out -2s infinite;transform-style:preserve-3d}
.hero-portrait:after{animation:portrait-shine 5.5s ease-in-out infinite}
}
@keyframes light-sweep{from{translate:-4% -3%;scale:1;opacity:.75}to{translate:7% 6%;scale:1.2;opacity:1}}
@keyframes grid-travel{from{background-position:0 0}to{background-position:72px 72px}}
@keyframes ribbon-sweep{from{translate:5% -45px;rotate:-9deg;opacity:.55}to{translate:-8% 55px;rotate:10deg;opacity:.95}}
@keyframes halo-sweep{from{translate:-12% 9%;scale:.9;opacity:.65}to{translate:12% -10%;scale:1.22;opacity:1}}
@keyframes orbit-drift{from{translate:-25px -25px;scale:.92}to{translate:25px 35px;scale:1.1}}
@keyframes portrait-float{0%,100%{transform:perspective(1100px) translateY(-9px) rotateX(5deg) rotateY(-9deg) rotate(-2deg)}50%{transform:perspective(1100px) translateY(10px) rotateX(-5deg) rotateY(9deg) rotate(3deg)}}
@keyframes portrait-shine{0%,100%{opacity:.3;translate:-4% 0}50%{opacity:1;translate:4% 0}}
.tab-inactive .parallax-background *,.tab-inactive .hero-portrait,.tab-inactive .about-portrait,.tab-inactive .hero-portrait:after{animation-play-state:paused!important}
@media(prefers-reduced-motion:reduce){.hero-portrait,.about-portrait,.parallax-background *{animation:none!important}}

/* Personal portraits stay still; ambient background motion is retained. */
.hero-portrait,.intro-enabled .hero-portrait,.intro-finished .hero-portrait,.about-portrait{animation:none!important;transform:none!important;transition:none!important;will-change:auto}
.hero-portrait:after{animation:none!important;translate:none;opacity:.35}
.hero-portrait .photo-window img,.about-portrait .photo-window img,.contact-portrait img{animation:none!important;transform:none!important;will-change:auto}

/* Separate paid-media returns from the company's overall revenue. */
.record-intertu .record-paid-revenue{margin-top:14px;line-height:1.45}
.record-intertu .record-paid-revenue b{display:block;color:#e6f5cd;font-size:clamp(16px,1.7vw,24px);font-weight:500;letter-spacing:-.025em}
.record-intertu .record-paid-revenue span{display:block;font-size:12px;color:#b9c0af;margin-top:3px}
.record-intertu .record-company-revenue{border-top:1px solid #3f4538;padding-top:10px;margin-top:12px;font-size:12px;line-height:1.5}
.record-intertu .record-company-revenue span,.record-intertu .record-company-revenue b{display:block}
.record-intertu .record-company-revenue b{font-weight:400;color:#c4cbb9}
@media(max-width:480px){.record-intertu .record-paid-revenue b{font-size:16px}.record-intertu .record-paid-revenue span,.record-intertu .record-company-revenue{font-size:11px}}

/* Career evidence: results first, supporting detail on demand. */
.story-lead strong{color:#e5ffc2;font-weight:500}
.result-heading{padding-top:34px;margin-top:30px;border-top:1px solid #c0c9b2}
.story-case .result-heading h4{font-size:clamp(25px,3vw,38px);letter-spacing:-.04em;line-height:1.15;margin:14px 0}
.story-case .result-heading p{font-size:13px;color:#647056}
.result-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:24px 0}
.result-tile{background:#1d2918;color:#edfadf;padding:24px 20px;min-width:0;border-radius:5px;position:relative;overflow:hidden;border:1px solid #3a4b2e}
.result-tile>span{font-size:10px;letter-spacing:.08em;display:block;min-height:30px;color:#b9cba8}
.result-tile>strong{display:block;font:550 clamp(34px,4.2vw,58px)/1.2 Manrope,Arial,sans-serif;letter-spacing:-.065em;color:#d0ff62;margin:13px 0}
.story-case .result-tile p{color:#edf5e6;font-size:16px;line-height:1.4}.result-tile p small{font-size:10px}
.result-tile i{font-style:normal;font-size:11px;line-height:1.5;color:#b4c2a6;display:block;margin-top:12px}
.result-grid-three{grid-template-columns:repeat(3,minmax(0,1fr))}
.story-case .comparison-notes{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin:24px 0 32px}
.story-case .comparison-notes p{font-size:13px;line-height:1.65;border-left:2px solid #85a25a;padding-left:17px}
.dashboard-evidence{gap:28px}.dashboard-evidence .proof-image img{max-height:none;object-fit:contain}
.story-case .metric-note{font-size:12px;line-height:1.65;color:#697160;margin:12px 0 24px;max-width:none}
.story-case .diagram-intro{font-size:14px;max-width:760px;margin:0 0 20px}
.funnel-system{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px;margin:22px 0}
.funnel-system>div{position:relative;background:#e3edda;border:1px solid #b3c59a;padding:20px 16px;min-width:0}
.funnel-system>div:not(:last-child):after{content:'→';position:absolute;right:-13px;top:45%;color:#425e2d;z-index:1;font-size:16px}
.funnel-system small{display:block;color:#738861;font-size:11px}.funnel-system strong{font:500 21px Manrope,Arial,sans-serif;display:block;margin:12px 0 6px;letter-spacing:-.03em}.funnel-system span{font-size:12px;color:#5e6a52}
.execution-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;margin:40px 0}
.execution-grid>div{border-top:1px solid #a8b498;padding-top:18px;min-width:0}.execution-grid>div>span{font-size:11px;letter-spacing:.07em;color:#5e7449}
.execution-grid h5{font-size:21px;line-height:1.25;letter-spacing:-.04em;margin:14px 0}
.story-case .execution-grid p{font-size:14px;line-height:1.65}
.system-map{display:grid;grid-template-columns:.8fr 1fr 1.2fr;gap:24px;align-items:center;background:#202b1c;color:#eef6e6;padding:30px;border-radius:6px;margin:30px 0}
.system-inputs{display:grid;gap:9px}.system-inputs span{padding:12px 14px;background:#ffffff0b;border:1px solid #91aa7555;font-size:13px;border-radius:4px}
.system-core,.system-output{padding:10px 0 10px 24px;border-left:1px solid #798d6255;display:flex;flex-direction:column;gap:15px}
.system-map small{font-size:10px;letter-spacing:.08em;color:#b8cf9b}.system-map strong{font-size:20px;line-height:1.3;font-weight:500;color:#d0ff62;letter-spacing:-.03em}.system-map span{font-size:12px;line-height:1.6}
.evidence-pair{grid-template-columns:1fr 1fr;gap:24px}.evidence-pair img{object-fit:contain;background:#fff;height:auto}.evidence-pair .proof-image h5{font-size:17px}
.commerce-comparison{display:grid;grid-template-columns:1fr 1fr;gap:32px;margin:24px 0;padding:28px;background:#e3edda;border:1px solid #bdcda9;border-radius:5px}
.commerce-comparison>div>span{font-size:11px;color:#546645;letter-spacing:.1em}.commerce-comparison strong{font:500 clamp(40px,5.8vw,80px)/1.15 Manrope,Arial,sans-serif;display:block;letter-spacing:-.06em;color:#2a481a;margin:13px 0}.commerce-comparison strong small{font-size:13px;letter-spacing:0;margin-left:8px}
.story-case .commerce-comparison p{font-size:13px;color:#5b6a4e}.revenue-bar{height:7px;background:#71944e;width:var(--bar);margin-top:22px;border-radius:2px}
.agency-mandate{display:flex;gap:24px;align-items:center;background:#e5ecd9;padding:16px 20px;border-left:2px solid #7b9558;font-size:13px;margin:12px 0 28px}.agency-mandate b{color:#385026;white-space:nowrap}.agency-mandate span{color:#5c6850}
.journey-takeaway{margin-top:20px;padding:11px 14px;border:1px solid #b4c49f;color:#3e5b2a;font-size:13px;line-height:1.5;display:inline-block;background:#dce8ce}
#project-intertu .project-list-image img{object-fit:contain;background:#eeeee8}
@media(max-width:900px){.result-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.result-grid-three{grid-template-columns:repeat(3,minmax(0,1fr))}.result-tile{padding:20px 16px}.result-tile>strong{font-size:38px}.funnel-system{gap:10px}.funnel-system>div{padding:14px 10px}.funnel-system strong{font-size:17px}.system-map{grid-template-columns:1fr;padding:24px}.system-inputs{grid-template-columns:repeat(3,minmax(0,1fr))}.system-core,.system-output{padding:20px 0 0;border-left:0;border-top:1px solid #798d6255}.system-map strong{font-size:22px}}
@media(max-width:650px){.result-grid,.result-grid-three{grid-template-columns:1fr 1fr;gap:8px}.result-grid-three>div:last-child{grid-column:1/-1}.result-tile{padding:18px 13px}.result-tile>strong{font-size:34px}.story-case .result-tile p{font-size:13px}.result-tile>span{font-size:9px}.story-case .comparison-notes,.execution-grid,.commerce-comparison,.evidence-pair{grid-template-columns:1fr}.funnel-system{grid-template-columns:1fr;gap:10px}.funnel-system>div{display:grid;grid-template-columns:25px 1fr 1.1fr;align-items:center;gap:10px;padding:16px}.funnel-system strong{margin:0;font-size:18px}.funnel-system>div:not(:last-child):after{content:'↓';right:auto;left:27px;top:auto;bottom:-14px}.system-inputs{grid-template-columns:1fr}.execution-grid{gap:22px;margin:28px 0}.commerce-comparison{padding:22px;gap:25px}.commerce-comparison strong{font-size:54px}.agency-mandate{display:block}.agency-mandate span{display:block;margin-top:8px}.dashboard-evidence .proof-image a{overflow-x:auto}.journey-scroll .journey-job p{font-size:16px}}

/* Uploaded v18: case KPI tiles, funnel and system diagrams. */
.approach-grid .block-proof{margin-top:14px;padding-top:12px;border-top:1px dashed #3c4a2c;font-size:13px;line-height:1.5;color:var(--lime)}
.case-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:28px 0 8px}
.case-kpis>div{padding:18px 16px;background:#e4edda;border:1px solid #cad7b6;border-radius:8px;min-width:0}
.case-kpis strong{display:block;font-family:Manrope,Arial,sans-serif;font-size:clamp(24px,2.4vw,34px);font-weight:650;letter-spacing:-.04em;line-height:1.1;color:#294918;font-variant-numeric:tabular-nums}
.case-kpis span{display:block;margin-top:8px;font-size:13px;color:#394d2c;font-weight:500}
.case-kpis small{display:block;margin-top:3px;font-size:12px;color:#536247}
.funnel-flow{list-style:none;padding:0;margin:14px 0 8px;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;counter-reset:f}
.funnel-flow li{position:relative;padding:16px 14px 16px;background:#192116;color:#e7ecdc;border-radius:6px;min-width:0}
.funnel-flow li:nth-child(1){background:#2b3424}.funnel-flow li:nth-child(2){background:#24301c}.funnel-flow li:nth-child(3){background:#1f2c16}.funnel-flow li:nth-child(4){background:#1b2812}.funnel-flow li:nth-child(5){background:#d0ff62;color:#151515}
.funnel-flow b{display:block;font-family:Manrope,Arial,sans-serif;font-size:18px;letter-spacing:-.02em;margin-bottom:6px}
.funnel-flow li:not(:last-child) b::after{content:" →";color:#d0ff62}
.funnel-flow span{display:block;font-size:12.5px;line-height:1.45;opacity:.85}
.system-flow{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin:14px 0 6px}
.system-flow>div{position:relative;padding:16px;border:1px solid #c9cbbf;border-radius:8px;background:#fff;min-width:0}
.system-flow>div:not(:last-child)::after{content:"→";position:absolute;right:-12px;top:50%;transform:translateY(-50%);width:14px;text-align:center;color:#4f6b2c;font-weight:700;z-index:1}
.system-flow .eyebrow{color:#4f6b2c;margin-bottom:10px}
.system-flow ul{margin:0;padding-left:16px;font-size:13.5px;line-height:1.55;color:#3d3d37}
.system-flow>div:last-child{background:#192116;border-color:#192116}.system-flow>div:last-child ul{color:#e7ecdc}.system-flow>div:last-child .eyebrow{color:#d0ff62}
.system-note{font-size:13px;color:#5f6f52;margin:6px 0 0}
@media(max-width:900px){.funnel-flow{grid-template-columns:1fr}.funnel-flow li:not(:last-child) b::after{content:" ↓"}.system-flow{grid-template-columns:1fr 1fr}.system-flow>div::after{display:none}}
@media(max-width:560px){.system-flow{grid-template-columns:1fr}}
@media(max-width:700px){.case-kpis{grid-template-columns:1fr 1fr}}
.proof-image.proof-narrow{max-width:640px}

/* Fit long KPI comparisons and keep proof legible on small screens. */
.case-kpis strong{font-size:clamp(22px,2.2vw,32px);overflow-wrap:anywhere;line-height:1.2}
.story-case .system-note{font-size:13px;line-height:1.65;color:#5f6f52;margin:12px 0 20px}
.case-kpis span{font-size:14px;line-height:1.5}.case-kpis small{line-height:1.5}
.metric-caveat{border-left:2px solid #a3b68c;padding-left:16px}
.funnel-flow span{font-size:14px}.system-flow ul{font-size:14px}
#project-intertu .project-list-image img{object-fit:contain;background:#0b0b0b}
@media(max-width:480px){.case-kpis{grid-template-columns:1fr}.case-kpis>div{padding:18px}.case-kpis strong{font-size:29px}.case-kpis small{font-size:13px}}


/* Clear reading hierarchy: results, evidence, thinking, then a compact next step. */
header{position:sticky;top:0;z-index:20;height:78px;background:rgba(21,21,21,.94);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
header nav a.is-active{color:var(--lime)}
button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid #779bff;outline-offset:5px}
.section[id],.project-group[id]{scroll-margin-top:16px}
.work-list .project-panels details,.work-track-record .project-entry{scroll-margin-top:18px}
.story-lead{max-width:1000px;font-size:clamp(18px,1.65vw,23px);line-height:1.8;color:#b7b9af}
.story-lead .story-key{font-weight:500;color:#e2ffac;text-decoration:underline;text-decoration-color:#8fb94580;text-decoration-thickness:1px;text-underline-offset:5px}
.approach-grid{gap:clamp(22px,3vw,40px)}
.approach-grid>div{transition:border-color .3s}
.approach-grid>div:hover{border-top-color:var(--lime)}
.approach-grid h3{font-size:clamp(19px,1.75vw,26px);line-height:1.3;margin-top:20px;letter-spacing:-.04em}
.approach-grid p{font-size:16px;line-height:1.65;margin:18px 0 0}
.motion .approach-grid .reveal{transition-delay:calc(var(--reveal-order,0)*70ms)}

.work-track-record{padding-top:36px}
.record-hero{padding:20px 0 24px;gap:32px;background:radial-gradient(ellipse at 80% 50%,#d0ff620d,transparent 65%)}
.record-heading h2{font-size:clamp(34px,3.5vw,50px);line-height:1.08;margin-top:18px}
.record-experience{display:flex;align-items:center;justify-content:flex-end;gap:22px;text-align:left;min-width:0}
.record-experience strong{font-size:clamp(64px,7.4vw,100px);letter-spacing:-.065em;font-weight:500}
.record-experience>span{max-width:125px;font-size:14px;line-height:1.45}
.record-stats{padding:12px 0 0}
.record-stat{display:block;padding:20px 26px 22px;transition:background .25s}
.record-stat:hover{background:#d0ff6207}
.record-kicker{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:10px;color:#a8b199;letter-spacing:.1em;margin-bottom:16px}
.record-kicker>span{font-size:18px;color:#c3d7a7;transition:translate .3s}
.record-stat:hover .record-kicker>span{translate:2px -2px}
.record-stat strong{font-size:clamp(42px,5.1vw,68px);font-weight:500;letter-spacing:-.06em;line-height:1.05}
.record-unit{font-size:14px;letter-spacing:0;margin-top:13px;font-weight:500}
.record-stat p{font-size:12px;line-height:1.6;margin-top:9px}
.record-intertu .record-paid-revenue{margin-top:10px}
.record-intertu .record-paid-revenue b{font-size:clamp(14px,1.4vw,19px)}
.record-intertu .record-paid-revenue span{font-size:11px}
.record-intertu .record-company-revenue{margin-top:12px;padding-top:9px;font-size:11px;border-top-color:#4a533d}
.record-more{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid #3f4538;border-bottom:1px solid #3f4538}
.record-more>a{display:flex;align-items:center;gap:18px;padding:16px 26px;border-right:1px solid #3f4538;min-width:0;transition:background .25s}
.record-more>a:first-child{padding-left:0}.record-more>a:last-child{border-right:0}
.record-more>a:hover{background:#d0ff6207}
.record-more strong{font:500 clamp(23px,2.5vw,32px)/1.1 Manrope,Arial,sans-serif;letter-spacing:-.04em;color:#e0eecf;white-space:nowrap;font-variant-numeric:tabular-nums}
.record-more span{font-size:12px;color:#d0d4c9;line-height:1.5}
.record-more small{display:block;color:#929c86;font-size:10px;margin-top:3px}
.record-footer{padding:15px 0;font-size:9px;align-items:center}
.record-footer a{color:#becdab;padding:6px 0}
.record-footer a:hover{color:var(--lime)}
.work-index{display:flex;align-items:center;flex-wrap:wrap;gap:8px 18px;padding:20px 0;color:#c9d0bf;border-bottom:1px solid #46503b;background:rgba(21,21,21,.95)}
.work-index>a{display:inline-flex;align-items:center;gap:10px;border:1px solid #515b47;border-radius:30px;font-size:12px;padding:8px 15px;min-height:40px;transition:background .25s,color .25s,border-color .25s}
.work-index>a:after{display:none}
.work-index>a:hover{background:var(--lime);color:var(--ink);border-color:var(--lime)}
.work-index>a span{font-size:10px;opacity:.65}
.work-index>span{margin-left:auto;font-size:11px;color:#939e85;letter-spacing:0}
.work-track-record .project-group{padding:26px 28px}
.work-track-record .project-entry{padding:25px;background:rgba(244,244,239,.86)}
.work-track-record .project-entry:hover{background:rgba(244,244,239,.95)}
.work-track-record .project-purpose{font-size:17px;line-height:1.4}
.work-track-record .my-work{font-size:14px;line-height:1.6}
.work-track-record .project-list-copy h3{font-size:clamp(25px,2.2vw,32px)}
#project-intertu .project-list-image img{object-fit:cover;object-position:center;background:#dde3d5}
#project-access .project-list-image,#project-focus .project-list-image{display:grid;place-items:center}
#project-access .project-list-image{background:#1c1c1a}
#project-focus .project-list-image{background:#fff}
#project-access .project-list-image img{object-fit:contain;width:min(180px,65%);height:auto;padding:0;background:#1c1c1a}
#project-focus .project-list-image img{object-fit:contain;width:min(150px,55%);height:auto;padding:0;background:#fff}

.about-decisions{background:#e8e8df;color:var(--ink);padding-block:76px;border-top:1px solid #bac4aa}
.about-layout{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(48px,8vw,130px);align-items:start}
.about-person h2{font-size:clamp(36px,3.9vw,56px);margin:22px 0 30px;line-height:1.08}
.about-person h2 em{color:#476030}
.about-decisions .about-portrait{max-width:400px;margin:0}
.about-decisions .about-portrait .photo-window{aspect-ratio:1.55;border-radius:4px}
.about-decisions .about-portrait img{object-position:50% 37%;width:100%;height:100%;object-fit:cover}
.about-decisions .about-portrait figcaption{font-size:10px;letter-spacing:.08em;color:#66725b;margin-top:12px}
.about-decisions .about-meta{grid-template-columns:1fr 1fr;gap:18px 20px;padding-top:20px;border-top:1px solid #bac4aa;max-width:400px;margin-top:25px}
.about-decisions .about-meta small{font-size:9px;color:#6b735f}
.about-decisions .about-meta span{font-size:12px;line-height:1.5}
.decision-intro{border-bottom:1px solid #bac4aa;padding-bottom:26px}
.decision-intro .large-copy{font:500 clamp(26px,2.9vw,40px)/1.2 Manrope,Arial,sans-serif;letter-spacing:-.045em;color:#26331e;margin:0 0 18px}
.decision-intro p{font-size:16px;line-height:1.7;color:#58604f;margin:0;max-width:54ch}
.decision-steps{list-style:none;margin:0;padding:0;counter-reset:none}
.decision-steps li{display:grid;grid-template-columns:36px minmax(0,1fr);gap:20px;padding:24px 0;border-bottom:1px solid #bac4aa;transition:border-color .3s}
.decision-number{font:500 12px Manrope,Arial,sans-serif;color:#667955;padding-top:4px}
.decision-steps h3{font-size:23px;letter-spacing:-.04em;line-height:1.3;margin-bottom:8px}
.decision-steps p{font-size:14px;line-height:1.65;color:#5a6550;margin:0;max-width:52ch}
.decision-steps li:hover{border-bottom-color:#637e44}
.career-disclosure{margin-top:28px;border:1px solid #abb79c;border-radius:5px;background:#ffffff24;scroll-margin-top:16px;overflow:hidden}
.career-disclosure summary{padding:18px 20px;align-items:center;gap:20px;font-size:14px}
.career-disclosure summary b{display:block;font-weight:500;font-size:16px;letter-spacing:-.02em}
.career-disclosure summary small{display:block;font-size:11px;color:#68745d;margin-top:4px}
.career-disclosure summary>span{font-size:inherit}
.career-disclosure .career-toggle{font-size:22px;line-height:1;flex:none;color:#506b37}
.career-disclosure summary:hover{background:#d0ff6226}
.career-list{list-style:none;margin:0;padding:0 20px 8px}
.career-list li{display:grid;grid-template-columns:minmax(92px,.8fr) minmax(0,2fr) auto;gap:14px;align-items:start;padding:17px 0;border-top:1px solid #b9c3ac}
.career-date{font-size:10px;color:#67775c;padding-top:3px;line-height:1.6}
.career-list h4{font-size:15px;letter-spacing:-.025em;font-weight:500;line-height:1.35;margin:0 0 5px}
.career-list p{font-size:11px;color:#65725a;line-height:1.5;margin:0}
.career-type{font-size:9px;border:1px solid #b1bea3;padding:3px 6px;border-radius:3px;color:#62764e;white-space:nowrap;margin-top:2px}

.stack-section{padding-block:58px 62px;border-top:1px solid var(--line)}
.stack-heading{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:24px}
.stack-heading h2{font-size:clamp(30px,3.1vw,43px);margin-top:17px;line-height:1.15}
.stack-heading>p{font-size:12px;color:#a0ab93;max-width:190px;margin:0 0 4px;line-height:1.6}
.skill-tags{display:flex;flex-wrap:wrap;gap:8px 14px;margin-bottom:26px}
.skill-tags>span{font-size:12px;line-height:1.4;border:1px solid #4a5540;border-radius:30px;padding:8px 13px;color:#c4d0b5;transition:color .25s,border-color .25s}
.skill-tags>span:hover{color:var(--lime);border-color:#8dab58}
.tool-grid{list-style:none;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:0;margin:0;padding:0;border-top:1px solid #373f30;border-left:1px solid #373f30}
.tool-chip{display:flex;align-items:center;gap:11px;padding:17px 14px;border-right:1px solid #373f30;border-bottom:1px solid #373f30;min-width:0;transition:background .25s,border-color .25s}
.tool-chip img{width:23px;height:23px;object-fit:contain;flex:none;filter:brightness(0) invert(1);opacity:.7;transition:opacity .25s,transform .25s}
.tool-chip>span{font-size:12px;color:#e1e6da;line-height:1.4;min-width:0}
.tool-chip small{display:block;font-size:10px;color:#929c86;margin-top:3px}
.tool-chip:hover{background:#d0ff6208}
.tool-chip:hover img{opacity:1;transform:translateY(-2px)}

.contact-compact{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:40px;align-items:center;padding-block:42px;background:#d0ff62;color:#182012}
.contact-person{display:flex;align-items:center;gap:15px;margin-bottom:16px}
.contact-person img{width:44px;height:44px;object-fit:cover;border-radius:50%;object-position:45% 50%;flex:none}
.contact-person .eyebrow{font-size:10px;letter-spacing:.14em}
.contact-copy h2{font-size:clamp(30px,3.5vw,47px);line-height:1.16;margin:0;letter-spacing:-.055em}
.contact-copy h2 em{font-style:italic}
.contact-copy>p{font-size:13px;color:#4a602d;line-height:1.65;margin:13px 0 0}
.contact-actions{display:flex;flex-direction:column;align-items:flex-end;gap:11px}
.contact-button{display:flex;align-items:center;gap:42px;padding:16px 22px;background:#1c2615;color:#f0ffdb;border:1px solid #1c2615;border-radius:40px;font-size:14px;line-height:1.2;transition:background .25s,color .25s,box-shadow .25s}
.contact-button span{font-size:21px;line-height:1;transition:translate .3s}
.contact-button:hover{background:#2c3d20;box-shadow:0 8px 22px #233b1b20}
.contact-button:hover span{translate:3px -3px}
.contact-email{font-size:13px;padding:4px 0;overflow-wrap:anywhere}
.contact-phone{font-size:12px;color:#4a602d;padding:3px 0}
.contact-email:hover,.contact-phone:hover{text-decoration:underline;text-underline-offset:4px}
footer{align-items:center;padding-block:18px;font-size:11px}
footer a{min-height:36px;display:inline-flex;align-items:center;gap:10px}
footer a:hover{color:var(--lime)}

@media(max-width:1100px){.tool-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.record-more>a{gap:12px;padding-inline:18px}.about-layout{gap:48px}.career-list li{grid-template-columns:92px minmax(0,1fr)}.career-type{display:none}}
@media(max-width:800px){
 header{height:72px}
 .record-heading h2{font-size:36px}.record-experience{display:block;text-align:center}.record-experience strong{font-size:78px}.record-experience>span{display:block;max-width:110px;font-size:12px;margin-top:7px}
 .record-stat{padding:18px 15px}.record-stat strong{font-size:clamp(31px,6vw,48px)}.record-kicker{font-size:9px;letter-spacing:.06em}.record-unit{font-size:12px}.record-stat p{font-size:11px}
 .record-more>a{padding:14px 14px;gap:12px}.record-more strong{font-size:25px}.record-more span{font-size:10px}.record-more small{font-size:9px}
 .record-footer span{display:none}.record-footer{justify-content:flex-end;font-size:9px}
 .work-index>span{display:none}.work-index{padding:14px 0;gap:8px}.work-index>a{font-size:11px;padding:8px 12px}
 .about-layout{grid-template-columns:minmax(0,1fr);gap:38px}.about-decisions{padding-block:60px}.about-decisions .about-portrait{max-width:440px}.about-decisions .about-meta{max-width:440px}
 .about-person h2{font-size:clamp(36px,6.4vw,52px)}.decision-intro .large-copy{font-size:32px}.decision-intro p{max-width:60ch}
 .stack-heading{align-items:start}.stack-heading>p{display:none}.stack-section{padding-block:46px}.contact-compact{gap:30px}.contact-copy h2{font-size:34px}.contact-button{gap:22px}
}
@media(max-width:580px){
 .story-lead{font-size:18px;line-height:1.75}.approach-grid{gap:26px}.approach-grid h3{font-size:21px}.approach-grid p{font-size:14px}
 .record-hero{padding-top:14px;align-items:center;gap:20px}.record-heading h2{font-size:30px}.record-heading .eyebrow{font-size:9px;max-width:200px;line-height:1.6}.record-experience strong{font-size:62px}.record-experience>span{font-size:10px;max-width:90px}
 .record-stats{grid-template-columns:1fr;padding-top:6px}.record-stat{padding:21px 0;border-right:0;border-bottom:1px solid #3f4538;display:grid;grid-template-columns:1fr 1.08fr;gap:0 16px;align-items:start}.record-stat:last-child{border-bottom:0}
 .record-kicker{grid-column:1/-1;margin-bottom:12px;letter-spacing:.1em}.record-stat strong{font-size:48px;grid-row:2 / span 3;align-self:center}.record-unit{grid-column:2;margin:0;font-size:13px}.record-stat p{grid-column:2;font-size:11px;margin-top:6px}
 .record-intertu .record-paid-revenue{grid-column:2;margin-top:7px}.record-intertu .record-paid-revenue b{font-size:13px}.record-intertu .record-paid-revenue span{font-size:10px}.record-intertu .record-company-revenue{grid-column:1/-1;display:flex;justify-content:space-between;flex-wrap:wrap;gap:3px 16px;margin-top:16px;padding-top:10px;font-size:10px}
 .record-more{grid-template-columns:1fr}.record-more>a,.record-more>a:first-child{padding:13px 0;border-right:0;border-bottom:1px solid #303a27;justify-content:space-between}.record-more>a:last-child{border-bottom:0}.record-more strong{font-size:25px}.record-more span{text-align:right;font-size:11px}.record-more small{display:inline;font-size:9px;margin-left:8px}
 .work-track-record .project-group{padding:24px 22px}.work-track-record .project-list-copy h3{font-size:28px}
 .career-list li{grid-template-columns:88px minmax(0,1fr);gap:14px}.career-disclosure summary{padding:17px}.career-list{padding:0 17px 6px}.career-list h4{font-size:14px}
 .stack-heading h2{font-size:31px}.skill-tags{gap:7px;margin-bottom:20px}.skill-tags>span{font-size:10px;padding:7px 10px}.tool-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.tool-chip{display:block;padding:15px 10px}.tool-chip img{display:block;width:23px;height:23px;margin-bottom:9px}.tool-chip>span{font-size:11px;display:block}.tool-chip small{font-size:9px;line-height:1.5}
 .contact-compact{grid-template-columns:1fr;gap:25px;padding-block:34px}.contact-copy h2{font-size:36px}.contact-copy>p{font-size:12px}.contact-actions{align-items:flex-start;gap:9px}.contact-button{padding:14px 20px;font-size:13px;gap:40px}.contact-email{font-size:12px}.contact-person{margin-bottom:15px}.contact-person img{width:38px;height:38px}
}
@media(prefers-reduced-motion:reduce){header{scroll-behavior:auto}.story-key,.approach-grid>div,.record-stat,.record-kicker>span,.record-more>a,.work-index>a,.decision-steps li,.skill-tags>span,.tool-chip,.tool-chip img,.contact-button,.contact-button span{transition:none!important;transform:none!important}}


/* Restore the layered track record and six-chapter journey. */
.work-track-record .project-entry{background:rgba(244,244,239,.79)}
.work-track-record .project-entry:hover{background:rgba(244,244,239,.89)}
.work-track-record .project-entry:has(details[open]){background:rgba(244,244,239,.96)}
.about-journey .journey-intro{position:sticky;top:100px}
@media(min-width:801px) and (max-height:750px){
 .work-track-record .record-hero{padding-block:12px}
 .work-track-record .record-heading h2{font-size:34px;margin-top:12px}
 .work-track-record .record-experience strong{font-size:72px}
 .work-track-record .record-experience>span{font-size:12px}
 .work-track-record .record-stats{padding-top:6px}
 .work-track-record .record-stat{padding-block:12px}
 .work-track-record .record-kicker{margin-bottom:10px}
 .work-track-record .record-stat strong{font-size:42px}
 .work-track-record .record-unit{margin-top:9px;font-size:12px}
 .work-track-record .record-intertu .record-paid-revenue b{font-size:15px}
 .work-track-record .record-more>a{padding-block:10px}
 .work-track-record .record-more strong{font-size:25px}
 .work-track-record .record-footer{padding-block:10px}
}
@media(max-width:800px){
 .about-journey .journey-intro{position:relative;top:auto}
}
@media(prefers-reduced-motion:reduce){
 .about-journey .journey-intro{position:relative;top:auto}
}
.motion-paused .about-journey .journey-intro{position:relative;top:auto}

/* Editorial portrait: a still photograph within a distinct personal identity. */
.hero-portrait.portrait-editorial{position:relative;padding:0 22px 0 8px;background:none;border:0;box-shadow:none;max-width:390px;isolation:isolate}
.hero-portrait.portrait-editorial:after{display:none}
.portrait-index{display:flex;justify-content:space-between;gap:16px;margin:0 0 22px;font:9px/1.5 monospace;letter-spacing:1.2px;color:#b9c3ae}
.portrait-index span:first-child{max-width:175px}
.portrait-index span:last-child{white-space:nowrap;color:var(--lime)}
.portrait-composition{position:relative;padding:10px 0 0 10px}
.portrait-outline{position:absolute;inset:0 10px 12px 0;border:1px solid #d0ff6270;border-radius:180px 180px 12px 12px;pointer-events:none;transition:border-color .3s,box-shadow .3s}
.portrait-link{position:relative;display:block;color:var(--paper);text-decoration:none;border-radius:180px 180px 10px 10px;outline-offset:7px}
.hero-portrait.portrait-editorial .photo-window{aspect-ratio:3/4;border-radius:180px 180px 10px 10px;background:#21352d}
.hero-portrait.portrait-editorial .photo-window img{height:100%;top:0;object-position:50% 50%;filter:saturate(.72);transition:filter .45s ease}
.portrait-shade{position:absolute;inset:0;background:linear-gradient(180deg,transparent 48%,#10171135 62%,#101711ed 100%);pointer-events:none}
.portrait-name{position:absolute;left:22px;bottom:54px;font-family:Manrope,sans-serif;font-size:clamp(38px,4.7vw,65px);font-weight:600;line-height:.92;letter-spacing:-3px}
.portrait-name>span{display:block;font-family:Georgia,serif;font-weight:400;font-style:italic;letter-spacing:-2px;margin-top:5px}
.portrait-explore{position:absolute;bottom:16px;left:22px;right:20px;display:flex;align-items:center;justify-content:space-between;font:9px/1.2 monospace;letter-spacing:1.4px;color:#e6ebdf}
.portrait-explore b{display:grid;place-items:center;width:30px;height:30px;border:1px solid #d0ff6260;border-radius:50%;font:20px/1 sans-serif;color:var(--lime);transition:background .25s,color .25s}
.portrait-side{position:absolute;right:-21px;top:45%;writing-mode:vertical-rl;font:8px/1 monospace;letter-spacing:2px;color:#b9c3ae}
.portrait-note{position:absolute;left:-20px;top:38%;display:flex;align-items:center;gap:10px;padding:12px 14px;background:var(--lime);color:var(--ink);border-radius:2px;box-shadow:0 8px 24px #0002;pointer-events:none;font:10px/1.6 monospace;letter-spacing:1px}
.portrait-note-symbol{font:35px/1 Georgia,serif}
.portrait-note strong{font-weight:700}
.hero-portrait.portrait-editorial figcaption{padding:20px 0 0;gap:10px;color:#aeb8a6;font:8px/1.5 monospace;letter-spacing:1px}
.hero-portrait.portrait-editorial figcaption span:last-child{display:block;font-size:inherit}
.portrait-composition:focus-within .portrait-outline{border-color:var(--lime);box-shadow:0 0 26px #d0ff6212}
.portrait-link:focus-visible{outline:2px solid var(--lime)}
.portrait-link:focus-visible .portrait-explore b{background:var(--lime);color:var(--ink)}
@media(hover:hover){.portrait-composition:hover .portrait-outline{border-color:var(--lime);box-shadow:0 0 26px #d0ff6212}.portrait-link:hover .photo-window img{filter:saturate(1)}.portrait-link:hover .portrait-explore b{background:var(--lime);color:var(--ink)}}
@media(min-width:581px) and (max-width:1000px){.portrait-note{left:-8px;padding:9px;gap:7px;font-size:8px}.portrait-note-symbol{font-size:26px}.portrait-index{font-size:8px;letter-spacing:.5px}.portrait-name{font-size:42px;left:16px}.hero-portrait.portrait-editorial figcaption{font-size:7px;letter-spacing:.4px}}
@media(max-width:580px){.hero-portrait.portrait-editorial{width:82%;max-width:310px;margin:6px auto 12px;padding:0 15px 0 10px}.portrait-index{font-size:8px;margin-bottom:14px}.portrait-name{font-size:51px}.portrait-note{left:-17px;font-size:9px;padding:10px}.portrait-note-symbol{font-size:30px}.portrait-side{right:-15px;font-size:7px;letter-spacing:1.5px}.hero-portrait.portrait-editorial .photo-window{aspect-ratio:3/4}.hero-portrait.portrait-editorial figcaption{font-size:7px;letter-spacing:.6px}}
@media(prefers-reduced-motion:reduce){.portrait-editorial *{transition:none!important}}


/* ==========================================================================
   UPGRADE PASS (appended last so it wins the cascade over earlier layers)
   ========================================================================== */

/* 1. Track record stays pinned behind; the cream project cards slide up over it (desktop).
   --record-top (set in app.js) pins it lower than the header when it is taller than the window,
   so the heading and all three KPIs are seen in full before the cards arrive.
   Below 801px, with reduced motion or .motion-paused it is plain flow. */
.work-track-record .project-directory{position:relative;z-index:1;margin-top:clamp(36px,5vw,64px);padding:0 0 48px;background:transparent;color:#151515;border:0;border-radius:0;box-shadow:none}
@media(max-width:580px){.work-track-record .project-directory{margin-top:28px}}
/* Surfaces that slide over the KPIs are near-opaque so the numbers underneath do not bleed through. */
.work-track-record .work-index{background:#151515}
.work-track-record .project-group{background:#141812}
.work-track-record .project-entry,.work-track-record .project-entry:hover{background:rgba(244,244,239,.96)}
@media(min-width:801px) and (prefers-reduced-motion:no-preference){
 html:not(.motion-paused) .work-track-record .track-record-sticky{position:sticky;top:var(--record-top,88px);z-index:0;transform-origin:50% 0}
 html:not(.motion-paused) .work-track-record .project-directory{margin-top:35svh}
}

/* 4. Lenis: neutralise native smooth scrolling while Lenis drives the page. */
html.lenis,html.lenis body{height:auto}
html.lenis,html.lenis body{scroll-behavior:auto!important}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-stopped{overflow:hidden}

/* 7. About keeps its own cream block; a soft gradient strip in the section's empty
   top/bottom padding (no text there) eases the cut to the dark sections around it. */
.about-journey{position:relative}
.about-journey::before,.about-journey::after{content:"";position:absolute;left:0;right:0;height:clamp(44px,6vw,72px);pointer-events:none}
.about-journey::before{top:0;background:linear-gradient(180deg,var(--ink),#e8e8df)}
.about-journey::after{bottom:0;background:linear-gradient(0deg,var(--ink),#e8e8df)}

/* 2 + 3. Manifesto with a self-drawing growth line */
.manifesto{position:relative;isolation:isolate;overflow:hidden;padding-block:clamp(80px,12vw,190px) calc(clamp(32px,4vw,64px) + 12.5vw);border-bottom:1px solid var(--line)}
.manifesto-text{position:relative;z-index:1;margin:0;font-family:Manrope,Arial,sans-serif;font-weight:600;font-size:clamp(30px,8.4vw,170px);line-height:.98;letter-spacing:-.055em;color:var(--paper)}
.manifesto-text .headline-mask{padding:.04em .14em .16em 0;margin-bottom:-.1em}
.manifesto-text em{font-family:Georgia,'Times New Roman',serif;font-style:italic;font-weight:400;letter-spacing:-.04em;color:var(--lime)}
.growth-line{position:absolute;left:0;right:0;bottom:0;width:100%;height:auto;z-index:0;pointer-events:none;overflow:visible}
.growth-grid{fill:none;stroke:var(--lime);stroke-opacity:.12;stroke-width:1}
.growth-path{fill:none;stroke:var(--lime);stroke-opacity:.7;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.growth-dot{fill:var(--lime)}

/* 8. Career-flavoured background texture: faint chart grid and data points */
.story,.stack-section{position:relative;isolation:isolate}
.story::before,.stack-section::before,.manifesto::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.065;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='160' viewBox='0 0 240 160' fill='none' stroke='%23d0ff62' stroke-width='1'%3E%3Cpath d='M0 40H240M0 80H240M0 120H240M60 0V160M120 0V160M180 0V160' stroke-opacity='.5'/%3E%3Cpolyline points='0,128 40,112 80,118 120,84 160,92 200,52 240,40' stroke-width='1.4'/%3E%3Cg fill='%23d0ff62' stroke='none'%3E%3Ccircle cx='40' cy='112' r='2.5'/%3E%3Ccircle cx='120' cy='84' r='2.5'/%3E%3Ccircle cx='200' cy='52' r='2.5'/%3E%3C/g%3E%3C/svg%3E") 0 0/240px 160px repeat;-webkit-mask-image:linear-gradient(180deg,transparent,#000 22%,#000 78%,transparent);mask-image:linear-gradient(180deg,transparent,#000 22%,#000 78%,transparent)}

/* 9. Marquee (CSS drift is the no-JS fallback; JS adds .is-js and drives it from scroll velocity) */
.marquee{overflow:hidden;border-bottom:1px solid var(--line);padding-block:clamp(14px,2vw,28px)}
.marquee-track{display:flex;width:max-content;will-change:transform;animation:marquee-drift 42s linear infinite}
.marquee.is-js .marquee-track{animation:none}
.marquee-group{display:flex;flex:none;align-items:center;gap:clamp(20px,3vw,48px);padding-right:clamp(20px,3vw,48px)}
.marquee-group span{font:700 clamp(40px,8vw,128px)/1.05 Manrope,Arial,sans-serif;letter-spacing:-.04em;white-space:nowrap;color:transparent;-webkit-text-stroke:1px #d0ff62b3}
.marquee-group span:nth-of-type(even){color:var(--lime);-webkit-text-stroke:0}
.marquee-group i{font-style:normal;color:#66704e;font-size:clamp(28px,5vw,80px)}
@keyframes marquee-drift{to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){
 .marquee-track{animation:none;width:auto;justify-content:center}
 .marquee-group{flex-wrap:wrap;justify-content:center;padding:0 5%}
 .marquee-group:last-child{display:none}
}

/* 6. Project cards: lime edge on hover and keyboard focus (cover image stays still) */
.work-track-record .project-entry{transition:background .3s,border-color .3s,box-shadow .3s}
.work-track-record .project-entry:has(:focus-visible){border-color:var(--lime);box-shadow:0 0 0 1px var(--lime),0 18px 46px #d0ff6224}
@media(hover:hover){.work-track-record .project-entry:hover{border-color:var(--lime);box-shadow:0 0 0 1px var(--lime),0 18px 46px #d0ff6224}}

/* 10. Text roll for nav links and buttons (the copy is aria-hidden in JS) */
.roll-label{white-space:nowrap}
header nav a:not(.contact-nav) .roll-label{margin-right:.3em}
.contact-button .roll-label,.contact-button .roll-label span,.contact-button:hover .roll-label,.contact-button:hover .roll-label span{font-size:inherit;line-height:inherit;translate:none;margin:0}
.hero-btn .roll-label{line-height:1.4}

/* 2. Agency campaigns reel. Default = native swipe strip (touch, reduced motion, no JS). JS adds .is-pinned on desktop: pinned, scroll drives it sideways, background washes dark to cream. */
.agency-reel{--reel-ink:#000;position:relative;margin:16px 0 0;background:#e8e8df;color:var(--reel-ink);border:1px solid rgba(119,134,100,.4);isolation:isolate;overflow:hidden}
.agency-reel:before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;opacity:.22;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='160' viewBox='0 0 240 160' fill='none' stroke='%23788062' stroke-width='1'%3E%3Cpath d='M0 40H240M0 80H240M0 120H240M60 0V160M120 0V160M180 0V160' stroke-opacity='.5'/%3E%3Cpolyline points='0,128 40,112 80,118 120,84 160,92 200,52 240,40' stroke-width='1.4'/%3E%3C/svg%3E") 0 0/240px 160px repeat}
.reel-wash{position:absolute;inset:0;background:#e8e8df;opacity:0;pointer-events:none;display:none}
.reel-track{position:relative;z-index:2;display:flex;align-items:flex-start;gap:clamp(16px,3vw,32px);list-style:none;margin:0;padding:28px clamp(16px,3vw,32px);overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:clamp(16px,3vw,32px);overscroll-behavior-x:contain;scrollbar-width:thin}
.reel-item{flex:0 0 min(84vw,360px);scroll-snap-align:start}
.reel-quote{flex:0 0 min(72vw,320px);display:flex;align-items:center;scroll-snap-align:start}
.reel-quote p{margin:0;font:italic 400 clamp(26px,7vw,34px)/1.15 Georgia,'Times New Roman',serif;letter-spacing:-.02em;color:var(--reel-ink)}
.agency-reel button:focus-visible{outline:2px solid #000;outline-offset:4px;box-shadow:0 0 0 6px #fff}
.reel-note{margin:14px 0 0;color:#a9b29c}

/* Project cluster: one shared number + client name tags the cover, its numbers and every sheet image. */
.rp-tag{display:flex;align-items:center;gap:10px;margin:0 0 10px;font-size:11px;font-weight:600;line-height:1.3;letter-spacing:.12em;text-transform:uppercase;color:var(--reel-ink)}
.rp-num{flex:none;padding:4px 8px;border-radius:999px;background:#151515;color:var(--lime);letter-spacing:.08em}
.rp-body{display:grid;gap:10px}
.rp-cover{position:relative;margin:0;background:#d6d6cc}
.rp-cover img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover}
#agency-saigon .rp-cover img{aspect-ratio:4/5;object-position:50% 20%}
.rp-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 16px;margin:0;padding:14px 16px;background:#121410;color:#f4f4ef}
.rp-stats div{min-width:0}
.rp-stats dt{font-size:10px;line-height:1.35;letter-spacing:.08em;text-transform:uppercase;color:#c9d0bf}
.rp-stats dd{margin:2px 0 0;font:600 clamp(17px,1.5vw,22px)/1.1 Manrope,Arial,sans-serif;letter-spacing:-.02em;color:#fff}
.rp-stats .rp-budget dd{color:var(--lime)}
.rp-shots{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.rp-shot{position:relative;display:block;width:100%;padding:0;border:0;background:none;color:var(--reel-ink);font:inherit;text-align:left;cursor:zoom-in}
.rp-shot-cap{display:block;margin:0 0 6px;font-size:10px;font-weight:600;line-height:1.35;letter-spacing:.08em;text-transform:uppercase}
.rp-shot-cap b{color:inherit;font-weight:800}
.rp-shot-img{display:block;overflow:hidden;background:#151515;border:1px solid rgba(119,134,100,.55)}
.rp-shot-img img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;object-position:0 0;transition:transform .6s cubic-bezier(.22,.68,.2,1),filter .5s}
.rp-shot:hover .rp-shot-img img,.rp-shot:focus-visible .rp-shot-img img{transform:scale(1.04)}

.agency-reel.is-pinned:not(.is-light){--reel-ink:#fff}
.agency-reel.is-pinned{height:calc(100svh - 78px);width:var(--reel-w,100%);margin-left:calc(50% - var(--reel-w,100%)/2);background:#151515;border:0;overflow:hidden;overflow:clip}
.is-pinned .reel-wash{display:block}
.is-pinned .reel-track{position:absolute;top:0;left:0;height:100%;width:max-content;padding:0 8vw;gap:0;overflow:visible;scroll-snap-type:none;align-items:flex-start;will-change:transform}
.is-pinned .reel-item,.is-pinned .reel-quote{position:relative;flex:none;width:min(var(--w),calc(var(--wh,100)*1svh));margin:calc(var(--y)*1svh) 10vw 0 0;will-change:transform}
.is-pinned .reel-quote{width:var(--w);max-width:24vw}
.is-pinned .reel-quote p{font-size:clamp(30px,3.6vw,56px)}
/* Wide screens (pinned reel or the short-window swipe strip): cover with its numbers on the left,
   the planning sheets stacked and offset on the right, joined by lime ticks. */
@media(min-width:801px){
 .reel-item{flex-basis:min(84vw,660px)}
 #agency-saigon .rp-cover img{aspect-ratio:4/3;object-position:50% 30%}
 .rp-body{grid-template-columns:minmax(0,1.65fr) minmax(0,1fr);gap:clamp(18px,2.4vw,40px);align-items:start}
 .rp-stats{position:absolute;left:10px;right:10px;bottom:10px;gap:8px 14px;padding:10px 12px;background:rgba(14,15,12,.9)}
 .rp-stats dd{font-size:clamp(15px,1.25vw,21px)}
 .rp-shots{grid-template-columns:1fr;gap:clamp(14px,3svh,28px);padding-top:clamp(12px,4svh,56px)}
 .rp-shot:nth-child(2){margin-left:clamp(12px,2vw,32px)}
 .rp-shot::before{content:"";position:absolute;top:calc(50% + 8px);right:100%;width:clamp(18px,2.4vw,40px);height:1px;background:#688548}
 .rp-shot:nth-child(2)::before{width:calc(clamp(18px,2.4vw,40px) + clamp(12px,2vw,32px))}
 .is-pinned .rp-shot::before{background:var(--lime);opacity:.8}
}
.is-pinned .reel-item img{filter:grayscale(1) contrast(1.05);transition:filter .5s,transform .6s cubic-bezier(.22,.68,.2,1)}
.is-pinned .reel-item.is-active img,.is-pinned .reel-item:hover img,.is-pinned .reel-item:focus-within img{filter:none}
@media(prefers-reduced-motion:reduce){.rp-shot-img img{transition:none}}

/* Full-size view of a project's sheet or creative. */
.lightbox{width:min(94vw,1400px);max-width:none;max-height:94vh;margin:auto;padding:0;border:1px solid #46503b;background:#0f0f0f;color:#f4f4ef;overflow:auto}
.lightbox::backdrop{background:rgba(5,5,5,.86)}
html.lightbox-open{overflow:hidden}
.lightbox-figure{margin:0;padding:clamp(16px,3vw,32px) clamp(16px,4vw,64px);display:grid;gap:16px}
.lightbox-img{display:block;width:100%;height:auto;max-height:min(66vh,calc(94vh - 190px));object-fit:contain;background:#000}
.lightbox-project{margin:0;font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--lime)}
#lightbox-title{margin:4px 0 6px;font-size:clamp(20px,2vw,28px);font-weight:600;letter-spacing:-.02em;color:#fff}
.lightbox-note{margin:0;max-width:72ch;font-size:14px;line-height:1.6;color:#c9d0bf}
.lightbox-close,.lightbox-nav{position:absolute;display:grid;place-items:center;width:44px;height:44px;border:1px solid #46503b;border-radius:50%;background:#151515;color:#fff;font-size:22px;line-height:1;cursor:pointer}
.lightbox-close{top:10px;right:10px}
.lightbox-nav{top:40%}
.lightbox-prev{left:10px}
.lightbox-next{right:10px}
.lightbox-nav[hidden]{display:none}
.lightbox button:focus-visible{outline:2px solid var(--lime);outline-offset:2px}

/* Keep decorative overflow off the page without creating a scroll container
   around the sticky project and career sections. */
html,body{overflow-x:clip}
/* Hide only the page scrollbar; native scrolling and the progress bar remain. */
html{scrollbar-width:none}
html::-webkit-scrollbar{display:none;width:0;height:0}

/* Opaque exit surface: cover the sticky metrics after the agency reel. */
.work-track-record .reel-note{position:relative;isolation:isolate;margin:0;padding-top:18px;background:#151515}
.work-track-record .reel-note::before{content:"";position:absolute;z-index:-1;top:0;bottom:-49px;left:-6vw;right:-6vw;background:#151515;pointer-events:none}
.about-journey{position:relative;z-index:1;isolation:isolate;background:#e8e8df}

/* About becomes the second section: copy left, portrait right */
@media(min-width:801px){
 .about-journey .journey-intro{order:2}
 .about-journey .journey-story{order:1}
}
.about-journey{padding-bottom:clamp(90px,12vw,150px)}
.about-journey::after{display:none}

/* Case viewer */
html.scroll-locked{overflow:hidden}
.case-viewer{position:fixed;inset:0;width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:0;border:0;background:transparent;color:var(--ink);overflow:hidden;--reel-ink:#151515}
.case-viewer::backdrop{background:transparent}
.case-viewer:focus{outline:none}
.cv-bg{position:absolute;inset:0;background:#f4f4ef}
.cv-scroll{position:absolute;inset:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#b9bcae transparent}
.cv-bar{position:sticky;top:0;z-index:5;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 5%;background:#f4f4efdb;backdrop-filter:blur(12px);border-bottom:1px solid transparent;transition:border-color .3s}
.cv-bar.is-scrolled{border-color:#d9dacf}
.cv-count{margin:0;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:#6a6d61;display:flex;align-items:center;gap:6px;min-width:0}
.cv-count b{color:var(--ink)}
.cv-bar-title{margin-left:14px;padding-left:14px;border-left:1px solid #cfd1c4;font-family:'Manrope',Arial,sans-serif;font-weight:700;letter-spacing:-.01em;text-transform:none;font-size:15px;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;opacity:0;transform:translateY(6px);transition:opacity .3s,transform .3s}
.cv-bar.is-scrolled .cv-bar-title{opacity:1;transform:none}
.cv-controls{display:flex;gap:8px;flex:none}
.cv-btn{height:40px;min-width:40px;padding:0 14px;border-radius:40px;border:1px solid #c9cbbf;background:transparent;color:var(--ink);font:500 14px 'DM Sans',Arial,sans-serif;cursor:pointer;transition:background .25s,border-color .25s,color .25s}
.cv-btn:hover{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.cv-close{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.cv-close:hover{background:var(--lime);border-color:var(--lime);color:var(--ink)}
.cv-btn:focus-visible{outline:3px solid #839aef;outline-offset:3px}
.cv-case{max-width:1280px;margin:0 auto;padding:6px 5% 72px}
.cv-hero{position:relative;height:min(62vh,640px);min-height:320px;border-radius:22px;overflow:hidden;background:#0e110d;color:var(--paper)}
.cv-cover{position:absolute;inset:0;margin:0}
.cv-cover>img,.cv-ghost-inner>img{width:100%;height:100%;object-fit:cover;display:block}
.cv-cover-logo,.cv-ghost-inner.is-logo{background:#fff}
.cv-cover-logo>img,.cv-ghost-inner.is-logo>img{object-fit:contain;padding:8% 22% 34%}
.cv-ghost{position:fixed;z-index:60;overflow:hidden;background:#0e110d;pointer-events:none;will-change:left,top,width,height}
.cv-ghost-inner{position:absolute;inset:0}
.cv-head{position:absolute;left:0;right:0;bottom:0;display:flex;flex-direction:column;gap:10px;padding:clamp(80px,14vh,160px) clamp(22px,3.2vw,48px) clamp(22px,3vw,42px);background:linear-gradient(180deg,transparent,#0b0d0ad9 55%,#0b0d0af2)}
.cv-cover-logo+.cv-head{background:#0d100c;padding-top:clamp(22px,3vw,40px)}
.cv-tag{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--lime)}
.cv-title{margin:0;font-family:'Manrope',Arial,sans-serif;font-weight:800;font-size:clamp(36px,5.4vw,84px);letter-spacing:-.055em;line-height:.98}
.cv-purpose{margin:0;max-width:60ch;font-size:clamp(15px,1.3vw,19px);color:#d8dacf}
.cv-facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:0;margin:22px 0 0;border-top:1px solid #d3d5c9;border-bottom:1px solid #d3d5c9}
.cv-facts>div{padding:16px 18px 16px 0;border-right:1px solid #e0e1d7}
.cv-facts>div:last-child{border-right:0}
.cv-facts dt{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:#7a7d70;margin-bottom:6px}
.cv-facts dd{margin:0;font-size:15px;font-weight:600;line-height:1.4;color:var(--ink)}
.cv-summary{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:clamp(24px,4vw,64px);align-items:start;margin:clamp(30px,4vw,52px) 0 clamp(26px,3vw,40px)}
.cv-did{margin:0;font-family:'Manrope',Arial,sans-serif;font-size:clamp(19px,1.75vw,26px);font-weight:600;line-height:1.42;letter-spacing:-.02em;color:var(--ink)}
.cv-did b{display:block;font-family:'DM Sans',Arial,sans-serif;font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:#52613d;margin-bottom:12px}
.cv-highlights{display:grid;gap:8px}
.cv-highlights>div{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding:14px 18px;border-radius:12px;background:#151515;color:var(--paper)}
.cv-highlights strong{font-family:'Manrope',Arial,sans-serif;font-size:clamp(24px,2.4vw,34px);font-weight:800;letter-spacing:-.04em;color:var(--lime);line-height:1}
.cv-highlights span{font-size:13px;color:#c9ccbf;text-align:right}
.cv-body{border-top:1px solid #d3d5c9;padding-top:clamp(26px,3vw,40px)}
.cv-body>h4{font-family:'Manrope',Arial,sans-serif;font-size:clamp(20px,1.8vw,26px);letter-spacing:-.03em;margin:clamp(34px,4vw,52px) 0 16px;color:var(--ink)}
.cv-body>h4:first-child{margin-top:0}
.cv-rp-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,520px),1fr));gap:22px}
.cv-rp-list .rp{min-width:0}
.cv-end{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:12px;margin-top:clamp(44px,6vw,80px)}
.cv-end a{position:relative;display:flex;flex-direction:column;gap:6px;padding:clamp(22px,3vw,36px);border-radius:18px;background:#151515;color:var(--paper);overflow:hidden;transition:background .3s,color .3s}
.cv-end small{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#a4a49e}
.cv-end b{font-family:'Manrope',Arial,sans-serif;font-size:clamp(26px,3.2vw,48px);letter-spacing:-.05em;line-height:1}
.cv-end a>span{position:absolute;right:clamp(22px,3vw,36px);bottom:clamp(22px,3vw,36px);font-size:28px;color:var(--lime);transition:transform .35s cubic-bezier(.2,.75,.2,1)}
.cv-end a:hover>span{transform:translateX(6px)}
.cv-end .cv-mail{background:var(--lime);color:var(--ink)}
.cv-end .cv-mail small{color:#3f4a24}
.cv-end .cv-mail>span{color:var(--ink)}
.cv-end .cv-mail:hover>span{transform:translate(4px,-4px)}
.cv-end a:hover{background:#262924}
.cv-end .cv-mail:hover{background:#c3f04f}
@media(max-width:800px){
 .cv-bar{padding:10px 16px}
 .cv-bar-title{display:none}
 .cv-btn{height:38px;padding:0 12px}
 .cv-case{padding:4px 16px 120px}
 .cv-hero{height:auto;aspect-ratio:4/5;min-height:0;border-radius:18px}
 .cv-summary,.cv-end{grid-template-columns:minmax(0,1fr)}
 .cv-facts{grid-template-columns:repeat(2,minmax(0,1fr))}
 .cv-facts>div{border-right:0;border-bottom:1px solid #e0e1d7;padding-right:10px}
 .cv-facts>div:last-child{grid-column:1/-1;border-bottom:0}
}
@media(prefers-reduced-motion:reduce){.cv-bar-title,.cv-end a>span{transition:none}}

/* Floating contact */
.contact-fab{position:fixed;right:max(clamp(12px,1.4vw,20px),env(safe-area-inset-right));bottom:max(14px,calc(env(safe-area-inset-bottom) + 14px));z-index:70;display:flex;flex-direction:column;align-items:flex-end;gap:10px}
.fab-btn{position:relative;display:inline-grid;place-items:center;flex:none;width:44px;height:44px;padding:0;border-radius:4px;border:1px solid #0000001a;background:var(--lime);color:var(--ink);font:600 13px 'DM Sans',Arial,sans-serif;cursor:pointer;box-shadow:0 4px 16px #00000029;transition:transform .25s cubic-bezier(.2,.75,.2,1),background .25s,box-shadow .25s}
.fab-icon{display:block;width:22px;height:22px;transition:transform .25s cubic-bezier(.2,.75,.2,1)}
.fab-label{position:absolute;right:calc(100% + 10px);top:50%;display:flex;align-items:center;height:34px;padding:0 12px;white-space:nowrap;background:var(--ink);color:var(--lime);border:1px solid #d0ff6233;border-radius:var(--r-xs,2px);opacity:0;visibility:hidden;pointer-events:none;transform:translate(5px,-50%);transition:opacity .2s,transform .2s,visibility .2s}
.fab-btn:focus-visible .fab-label{opacity:1;visibility:visible;transform:translate(0,-50%)}
@media(hover:hover) and (pointer:fine){.fab-btn:hover{transform:translateY(-2px);background:#c3f04f;box-shadow:0 6px 20px #00000033}.fab-btn:hover .fab-icon{transform:translate(1px,-1px)}.fab-btn:hover .fab-label{opacity:1;visibility:visible;transform:translate(0,-50%)}}
.fab-btn:focus-visible{outline:3px solid #839aef;outline-offset:4px}
.fab-x{display:none;font-size:17px;line-height:1}
.contact-fab.is-open .fab-x{display:inline}
.contact-fab.is-open .fab-icon{display:none}
.contact-fab.is-open .fab-btn .fab-label{opacity:0;visibility:hidden}
.fab-panel{width:min(340px,calc(100vw - 32px));padding:18px;border-radius:18px;background:#151515;color:var(--paper);border:1px solid #33362f;box-shadow:0 24px 60px #00000066;transform-origin:bottom right}
.fab-person{display:flex;align-items:center;gap:12px}
.fab-person img{width:48px;height:48px;border-radius:50%;object-fit:cover}
.fab-person p{margin:0;display:flex;flex-direction:column;font-size:15px;line-height:1.35}
.fab-person span{font-size:12px;color:#a4a49e}
.fab-pitch{margin:14px 0;font-size:14px;line-height:1.55;color:#d8dacf}
.fab-row{display:flex;align-items:center;gap:8px;padding:10px 0;border-top:1px solid #2e312a}
.fab-link{flex:1;min-width:0;display:flex;flex-direction:column}
.fab-link small{font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:#8e8f88}
.fab-link span{font-size:14.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:color .2s}
.fab-link:hover span{color:var(--lime)}
.fab-copy{flex:none;height:32px;padding:0 12px;border-radius:32px;border:1px solid #44473f;background:transparent;color:#d8dacf;font:500 12px 'DM Sans',Arial,sans-serif;cursor:pointer}
.fab-copy:hover{border-color:var(--lime);color:var(--lime)}
@media(prefers-reduced-motion:reduce){.fab-btn,.fab-icon,.fab-label{transition:none!important}.fab-btn:hover,.fab-btn:hover .fab-icon{transform:none}}
@media(max-width:800px){.cv-facts>div:last-child{grid-column:auto}.cv-facts>div:last-child:nth-child(odd){grid-column:1/-1}}

/* v34c showcase: intro, skills and tools on the left; scroll-stepped case studies on the right */
.showcase{position:relative;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);grid-template-rows:minmax(0,1fr) auto;column-gap:clamp(28px,4vw,72px);height:calc(100svh - var(--header-h,78px));min-height:560px;padding:clamp(18px,3.2vh,36px) 5%;overflow:hidden;box-sizing:border-box}
.showcase>:not(.parallax-background){position:relative;z-index:1}
.sc-intro{grid-column:1;grid-row:1;min-height:0}
.sc-aside{grid-column:1;grid-row:2;display:flex;flex-direction:column;gap:clamp(14px,2.6vh,26px)}
.sc-stage{grid-column:2;grid-row:1/3}
.sc-meta{display:flex;justify-content:space-between;gap:16px;font-size:11px;letter-spacing:.14em;color:var(--muted);margin-bottom:clamp(18px,4vh,46px)}
.showcase h1{font-size:inherit;letter-spacing:0;line-height:1}
.sc-kicker{display:block;font-size:clamp(15px,1.25vw,19px);font-weight:500;color:#e7ecdc;margin-bottom:.7em}
.sc-role{display:block;max-width:9.5em;font-family:'Manrope',Arial,sans-serif;font-weight:800;font-size:clamp(40px,4.7vw,78px);letter-spacing:-.055em;line-height:1;text-transform:uppercase}
.sc-role em{font-style:normal;color:var(--lime)}
.sc-role .spark{font-size:.55em;margin-left:.16em;vertical-align:.15em}
.sc-lede{max-width:44ch;margin:clamp(14px,2.4vh,24px) 0 0;color:#c4c6bb;font-size:15px;line-height:1.6}
.sc-label{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin:0 0 10px;font-size:11px;letter-spacing:.14em;color:var(--muted)}
.sc-label small{font-size:11px;letter-spacing:0;color:#7f8178}
.sc-label small::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--lime);margin-right:6px;vertical-align:1px}
.sc-tools-current{letter-spacing:0;color:var(--paper);font-size:12px;opacity:0;transition:opacity .2s}
.sc-tools-current.is-on{opacity:1}
.sc-skills ul{display:flex;flex-wrap:wrap;gap:6px;list-style:none;margin:0;padding:0}
.sc-skills li{font-size:12.5px;line-height:1;padding:8px 12px;border:1px solid #3a3d35;border-radius:30px;color:#9fa198;background:#151813b3;transition:color .4s,border-color .4s,background .4s}
.sc-skills li.is-used{color:var(--ink);border-color:var(--lime);background:var(--lime)}
.sc-marquee{position:relative;height:74px;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 14%,#000 86%,transparent);mask-image:linear-gradient(90deg,transparent,#000 14%,#000 86%,transparent)}
.sc-marquee-track{display:flex;align-items:center;gap:30px;width:max-content;height:100%;margin:0;padding:0 15px;list-style:none;will-change:transform}
.tool{position:relative;flex:none;display:grid;place-items:center;width:38px;height:38px;border-radius:11px;transform:scale(var(--s,1));transition:background .25s}
.tool-logo{width:20px;height:20px;background:var(--paper);-webkit-mask:var(--logo) center/contain no-repeat;mask:var(--logo) center/contain no-repeat;transition:background .25s}
.tool:hover{background:var(--paper)}
.tool:hover .tool-logo{background:var(--brand)}
.tool-name{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.sc-marquee.is-static{height:auto;-webkit-mask-image:none;mask-image:none}
.sc-marquee.is-static .sc-marquee-track{flex-wrap:wrap;width:auto;gap:8px;padding:0}
.sc-marquee.is-static .tool[aria-hidden]{display:none}

/* Stage */
.sc-stage{position:relative;min-height:0;border-radius:22px;overflow:hidden;background:#0e110d;border:1px solid var(--line);isolation:isolate}
.sc-stage-head{position:absolute;top:0;left:0;right:0;z-index:4;display:flex;justify-content:space-between;align-items:center;padding:16px;pointer-events:none}
.sc-stage-label,.sc-count{font-size:11px;letter-spacing:.14em;color:#e4e6dc;padding:7px 13px;border-radius:30px;background:#0b0d0aa6;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.sc-count-now{color:var(--lime)}
.sc-slide{position:absolute;inset:0;z-index:0;display:block;color:var(--paper);clip-path:inset(100% 0 0 0);transition:clip-path .95s cubic-bezier(.76,0,.24,1)}
.sc-slide.from-top{clip-path:inset(0 0 100% 0);transition:none}
.sc-slide.is-active{z-index:2;clip-path:inset(0);transition:clip-path .95s cubic-bezier(.76,0,.24,1)}
.sc-slide.is-leaving{z-index:1;clip-path:inset(0);transition:none}
.sc-slide:focus-visible{outline:none}
.sc-slide:focus-visible .sc-cta{outline:3px solid #839aef;outline-offset:3px}
.sc-slide>img,.sc-mosaic img{width:100%;height:100%;object-fit:cover;display:block}
.sc-slide>img,.sc-slide>.sc-mosaic{transform:scale(1.1);transition:transform 1.6s cubic-bezier(.2,.7,.2,1),filter .5s}
.sc-slide.is-active>img,.sc-slide.is-active>.sc-mosaic{transform:scale(1)}
.sc-slide.is-active:hover>img,.sc-slide.is-active:hover>.sc-mosaic{transform:scale(1.045);filter:brightness(1.08)}
.sc-slide-logo{background:#fff}
.sc-slide-logo>img{object-fit:contain;padding:10% 22% 40%}
.sc-mosaic{position:absolute;inset:0;display:grid;grid-template-columns:1.35fr 1fr 1fr;grid-template-rows:1fr 1fr;gap:6px}
.sc-mosaic img:first-child{grid-row:1/3}
.sc-cap{position:absolute;left:0;right:0;bottom:0;display:flex;flex-direction:column;gap:9px;padding:clamp(70px,13vh,140px) clamp(20px,2.4vw,34px) clamp(20px,2.4vw,30px);background:linear-gradient(180deg,transparent,#0b0d0ad1 45%,#0b0d0af5);opacity:0;transform:translateY(16px);transition:opacity .55s .3s,transform .8s .3s cubic-bezier(.2,.7,.2,1)}
.sc-slide.is-active .sc-cap{opacity:1;transform:none}
.sc-slide-logo .sc-cap{background:#0d100c;padding-top:clamp(20px,2.4vw,30px)}
.sc-cap-tag{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--lime)}
.sc-cap-name{font-family:'Manrope',Arial,sans-serif;font-weight:800;font-size:clamp(30px,3.3vw,56px);letter-spacing:-.05em;line-height:1}
.sc-cap-meta{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:13px;color:#d8dacf}
.sc-cap-meta span+span::before{content:"";display:inline-block;width:4px;height:4px;border-radius:50%;background:#7f8178;margin-right:14px;vertical-align:3px}
.sc-cap-row{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:6px;padding-top:14px;border-top:1px solid #ffffff1f}
.sc-cap-metric{font-size:13.5px;color:#d8dacf;min-width:0}
.sc-cap-metric b{font-family:'Manrope',Arial,sans-serif;font-weight:800;font-size:1.45em;color:var(--lime);letter-spacing:-.03em;margin-right:4px}
.sc-cta{flex:none;display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border-radius:40px;border:1px solid #f4f4ef80;font-size:13px;font-weight:600;transition:background .3s,color .3s,border-color .3s}
.sc-cta span{transition:transform .35s cubic-bezier(.2,.75,.2,1)}
.sc-slide.is-active:hover .sc-cta,.sc-slide:focus-visible .sc-cta{background:var(--lime);border-color:var(--lime);color:var(--ink)}
.sc-slide.is-active:hover .sc-cta span{transform:translate(3px,-3px)}
.sc-ticks{position:absolute;right:16px;top:50%;z-index:4;display:flex;flex-direction:column;align-items:flex-end;gap:4px;margin:0;padding:0;list-style:none;transform:translateY(-62%)}
.sc-tick{display:flex;align-items:center;gap:10px;padding:5px 0;border:0;background:none;color:#f4f4efa6;font:500 11px 'DM Sans',Arial,sans-serif;letter-spacing:.08em;cursor:pointer}
.sc-tick::after{content:"";width:16px;height:2px;border-radius:2px;background:currentColor;transition:width .4s cubic-bezier(.2,.75,.2,1),background .3s}
.sc-tick-name{max-width:0;overflow:hidden;white-space:nowrap;opacity:0;padding:3px 0;transition:max-width .4s,opacity .3s;letter-spacing:0;font-size:12px;text-shadow:0 1px 8px #000}
.sc-tick-num{text-shadow:0 1px 8px #000}
.sc-tick.is-active{color:var(--paper)}
.sc-tick.is-active::after{width:34px;background:var(--lime)}
.sc-ticks:hover .sc-tick-name,.sc-tick:focus-visible .sc-tick-name{max-width:200px;opacity:1}
.sc-tick:hover{color:var(--paper)}
.sc-tick:focus-visible{outline:2px solid #839aef;outline-offset:2px;border-radius:4px}
.sc-scroll-hint{position:absolute;top:22px;left:50%;z-index:4;transform:translateX(-50%);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#e4e6dccc;pointer-events:none;transition:opacity .4s}
.sc-scroll-hint::after{content:"↓";display:inline-block;margin-left:8px;animation:sc-nudge 1.8s ease-in-out infinite}
.sc-stage.is-last .sc-scroll-hint{opacity:0}
@keyframes sc-nudge{50%{transform:translateY(4px)}}
.sc-cursor{position:absolute;left:0;top:0;z-index:6;display:grid;place-items:center;width:104px;height:104px;margin:-52px 0 0 -52px;border-radius:50%;background:var(--lime);color:var(--ink);font:700 13px 'DM Sans',Arial,sans-serif;pointer-events:none;opacity:0;scale:.3;transition:opacity .25s,scale .4s cubic-bezier(.2,.75,.2,1)}
.sc-stage.show-cursor .sc-cursor{opacity:1;scale:1}
@media(pointer:fine){.sc-stage.show-cursor .sc-slide.is-active{cursor:none}}
.intro-enabled .sc-intro>*,.intro-enabled .sc-aside>*{animation:sc-rise .9s cubic-bezier(.2,.75,.2,1) both;animation-delay:.7s}
.intro-enabled .sc-intro>:nth-child(2){animation-delay:.8s}
.intro-enabled .sc-intro>:nth-child(3){animation-delay:.9s}
.intro-enabled .sc-aside>:nth-child(1){animation-delay:1s}
.intro-enabled .sc-aside>:nth-child(2){animation-delay:1.1s}
.intro-enabled .sc-stage{animation:sc-wipe 1.2s cubic-bezier(.76,0,.24,1) both;animation-delay:.6s}
@keyframes sc-rise{from{opacity:0;transform:translateY(18px)}}
@keyframes sc-wipe{from{clip-path:inset(100% 0 0 0 round 22px)}to{clip-path:inset(0 round 22px)}}
@media(min-width:901px) and (max-height:820px){
 .sc-meta{margin-bottom:2vh}
 .sc-role{font-size:min(4.7vw,8.4vh)}
 .sc-lede{font-size:14px;line-height:1.5;margin-top:1.6vh}
 .sc-skills li{padding:7px 10px;font-size:12px}
 .sc-marquee{height:64px}
 .sc-aside{gap:1.6vh}
}
@media(max-width:900px){
 .showcase{display:block;height:auto;min-height:0;padding:22px 16px 28px;overflow:visible}
 .sc-aside{margin-top:24px}
 .sc-stage{height:calc(100svh - var(--header-h,70px) - 16px);min-height:440px;margin-top:26px;border-radius:18px}
 .sc-ticks{right:10px}
 .sc-tick-name{display:none}
 .sc-cap-row{flex-direction:column;align-items:flex-start}
 .sc-cta{align-self:stretch;justify-content:center}
}
@media(max-width:580px){
 .sc-meta span:last-child{display:none}
 .sc-role{font-size:11.6vw}
 .sc-label small{display:none}
 .sc-cap-name{font-size:30px}
 .sc-stage-label{display:none}
 .sc-scroll-hint{left:16px;transform:none;top:24px}
}
@media(prefers-reduced-motion:reduce){
 .sc-slide,.sc-slide.is-active,.sc-slide>img,.sc-slide>.sc-mosaic,.sc-cap,.sc-cursor,.sc-tick::after,.sc-skills li{transition:none!important}
 .sc-intro>*,.sc-aside>*,.sc-stage,.sc-scroll-hint::after{animation:none!important}
}
/* v34c fixes: CTA beside the case name (clear of the floating button), legible ticks and hint */
.sc-cap-top{display:flex;align-items:flex-end;justify-content:space-between;gap:16px}
.sc-cap-top .sc-cta{margin-bottom:4px}
.sc-ticks{padding:8px 10px;border-radius:14px;background:#0b0d0a8c;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.sc-tick-name,.sc-tick-num{text-shadow:none}
.sc-scroll-hint{padding:7px 13px;border-radius:30px;background:#0b0d0aa6;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#e4e6dc}
@media(max-width:900px){.sc-cap-top{flex-direction:column;align-items:flex-start;gap:10px}.sc-cap-top .sc-cta{align-self:stretch;justify-content:center;margin:0}.sc-slide .sc-cap{padding-bottom:84px}}
.sc-count{margin-left:auto}
@media(max-width:900px){
 .sc-ticks{top:62px;transform:none;flex-direction:row;gap:2px;padding:6px 8px;right:16px}
 .sc-tick{padding:2px 4px}
 .sc-tick::after{width:10px}
 .sc-tick.is-active::after{width:18px}
 .sc-cap-meta{flex-direction:column;gap:2px}
 .sc-cap-meta span+span::before{display:none}
}
@media(max-width:580px){.sc-scroll-hint{top:16px;left:16px}.sc-tick-num{font-size:10px}}
/* v34d: breathing room in case facts */
.cv-facts>div{padding:18px 20px}
.cv-facts>div:first-child{padding-left:0}
@media(max-width:800px){.cv-facts>div,.cv-facts>div:first-child{padding:14px 12px 14px 0}.cv-facts>div:nth-child(even){padding-left:14px;border-left:1px solid #e0e1d7}}

/* v34d: evidence galleries - wide shots span the row, pairs sit side by side */
.cv-gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 24px}
.cv-gallery .proof-wide{grid-column:1/-1}
.cv-gallery .proof-image>a{position:relative;display:block;border-radius:14px;overflow:hidden;border:1px solid #d3d5c9;background:#0d1117}
.cv-gallery .proof-image img{max-height:none;transition:transform .6s cubic-bezier(.22,.68,.2,1)}
.cv-gallery .proof-image>a:hover img{transform:scale(1.015)}
.cv-gallery .proof-image h5{font-family:'Manrope',Arial,sans-serif;font-size:16px;letter-spacing:-.01em;margin:0 0 4px;color:var(--ink)}
@media(max-width:800px){.cv-gallery{grid-template-columns:minmax(0,1fr)}}

/* v34d: agency proof on a centre spine, alternating sides */
.cv-rp-list{position:relative;display:flex;flex-direction:column;gap:clamp(56px,7vw,100px);max-width:1120px;margin:28px auto 0;padding:8px 0 20px}
.cv-rp-list::before{content:"";position:absolute;left:50%;top:0;bottom:0;width:1px;background:linear-gradient(#c3c7b3 70%,transparent);transform:translateX(-.5px)}
.cv-rp-list .rp{position:relative;display:grid;grid-template-columns:minmax(0,1fr) clamp(48px,6vw,88px) minmax(0,1fr);grid-template-areas:"tag . ." "cover . shots";row-gap:14px;align-items:start}
.cv-rp-list .rp:nth-child(even){grid-template-areas:". . tag" "shots . cover"}
.cv-rp-list .rp-body{display:contents}
.cv-rp-list .rp-tag{grid-area:tag;margin:0}
.cv-rp-list .rp:nth-child(even) .rp-tag{justify-content:flex-end}
.cv-rp-list .rp-cover{grid-area:cover;border-radius:14px;overflow:hidden}
.cv-rp-list .rp-shots{grid-area:shots;grid-template-columns:minmax(0,1fr);gap:18px;padding-top:0}
.cv-rp-list .rp-shot{position:relative}
.cv-rp-list .rp-shot:nth-child(2){margin-left:0}
.cv-rp-list .rp-shot::before{display:none}
.cv-rp-list .rp-shot-img{border-radius:10px}
/* Spine marker and a short arm toward each side. */
.cv-rp-list .rp::before{content:"";position:absolute;left:50%;top:4px;width:14px;height:14px;margin-left:-7px;border-radius:50%;background:var(--lime);box-shadow:0 0 0 4px #f4f4ef,0 0 0 5px #b9bea6;z-index:1}
.cv-rp-list .rp::after{content:"";position:absolute;top:10px;height:1px;width:calc(clamp(48px,6vw,88px)/2 - 10px);background:#b9bea6}
.cv-rp-list .rp:nth-child(odd)::after{right:calc(50% + 10px)}
.cv-rp-list .rp:nth-child(even)::after{left:calc(50% + 10px)}
@media(max-width:800px){
 .cv-rp-list{gap:48px}
 .cv-rp-list::before,.cv-rp-list .rp::before,.cv-rp-list .rp::after{display:none}
 .cv-rp-list .rp,.cv-rp-list .rp:nth-child(even){grid-template-columns:minmax(0,1fr);grid-template-areas:"tag" "cover" "shots"}
 .cv-rp-list .rp:nth-child(even) .rp-tag{justify-content:flex-start}
 .cv-rp-list .rp-shots{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
}
@media(min-width:801px){.cv-rp-list .rp-cover{position:sticky;top:96px}}

/* Showcase spacing and decorative motion stay in the reading column. */
.sc-aside{gap:36px;padding-bottom:20px}
.sc-skills li{border-radius:9px}
.sc-tools .sc-label{margin-bottom:0}
.sc-tools .sc-marquee{height:56px}
.sc-tools .sc-marquee.is-static{height:auto}
.showcase .parallax-background{right:46%;-webkit-mask-image:linear-gradient(90deg,#000 78%,transparent);mask-image:linear-gradient(90deg,#000 78%,transparent)}
.showcase .data-grid{mask-image:linear-gradient(90deg,#000,transparent 95%);opacity:.5}
.showcase .orbit{right:auto;left:-220px;top:12%;width:700px;height:700px;border-color:#d0ff6238}
.showcase .ambient-band{left:-56%;top:40%;width:180%;height:40%;border-top-color:#ccff665c;border-bottom-color:#91e4ba40;box-shadow:0 -8px 24px #b6f35f12,inset 0 9px 25px #b6f35f08}
.showcase .band-two{left:-46%;top:54%;width:165%;height:32%;border-color:#8acecd50}
.showcase .band-three{left:-62%;top:65%;width:180%;height:26%;border-color:#c9fa6345}
.showcase .ambient-halo{left:-15%;right:auto;top:26%;width:110%;height:75%;background:radial-gradient(ellipse,#a1e76525,transparent 68%)}
.about-journey{scroll-margin-top:var(--header-h,78px)}
.about-journey .about-portrait img{object-position:50% 40%}
@media(min-width:901px) and (max-height:820px){.sc-aside{gap:28px;padding-bottom:12px}.sc-tools .sc-marquee{height:48px}}
@media(max-width:900px){.sc-aside{gap:30px;padding-bottom:0}.showcase .parallax-background{right:0}.showcase .ambient-band{top:24%;height:28%}.showcase .band-two{top:32%}.showcase .band-three{top:41%}}

/* Preserve the portrait's natural proportions in the About column. */
.about-journey .about-portrait{width:100%;max-width:clamp(180px,calc((100svh - 480px)*.75),420px)}
.about-journey .about-portrait .photo-window{aspect-ratio:auto}
.about-journey .about-portrait .photo-window img{position:static;display:block;width:100%;height:auto;top:auto;object-fit:contain;object-position:center}
@media(max-width:800px){.about-journey .about-portrait{max-width:420px}}

/* Native SVG cursors remain visible inside dialogs and use a precise tip. */
@media(hover:hover) and (pointer:fine){
 html,body{cursor:url("icons/cursor-lime-arrow.svg") 3 3,auto}
 a[href],button,summary,[role="button"],label[for]{cursor:url("icons/cursor-lime-action.svg") 16 16,pointer}
 a[href]:active,button:active,summary:active,[role="button"]:active{cursor:url("icons/cursor-lime-pressed.svg") 16 16,pointer}
 .rp-shot,.rp-shot *,a.media-image-link,a.media-image-link *,a[data-full],.proof-image>a,.proof-image>a *{cursor:url("icons/cursor-lime-zoom.svg") 16 16,zoom-in}
 input:not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="checkbox"]):not([type="radio"]):not([type="range"]),textarea,[contenteditable="true"]{cursor:text}
 button:disabled,[aria-disabled="true"]{cursor:not-allowed}
 video,video *{cursor:auto}
}
@media(forced-colors:active){html,body{cursor:auto}a[href],button,summary,[role="button"],label[for]{cursor:pointer}.rp-shot,.rp-shot *,.proof-image>a,.proof-image>a *{cursor:zoom-in}}

/* A short closing line, clear of the floating contact button. */
.site-footer{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:24px 5%;padding-right:clamp(230px,20vw,350px);background:var(--ink);color:var(--paper);border-top:1px solid var(--line)}
.site-footer p{margin:0}
.site-footer-credit{font-size:14px;line-height:1.5;white-space:nowrap;color:#aeb4a5}
.site-footer-credit strong{color:var(--paper);font-weight:500}
.site-footer-motto{font:italic 400 17px/1.5 Georgia,serif;color:var(--lime)}
@media(max-width:700px){.site-footer{align-items:flex-start;flex-direction:column;gap:8px;padding:22px 5% 94px}.site-footer-motto{font-size:16px}}

/* Industries fill the introduction's reading gap without repeating skill chips. */
.sc-industries{margin-top:24px;max-width:52ch}
.sc-industries>span{display:block;margin-bottom:6px;font-size:11px;letter-spacing:.14em;color:var(--lime)}
.sc-industries p{margin:0;font-size:13px;line-height:1.7;color:#b9c0af}
.sc-mosaic.agency-mosaic{grid-template-rows:repeat(3,minmax(0,1fr))}
.rp-stats .rp-primary dd{color:var(--lime)}
.rp-delivery>span{font-size:11px;line-height:1.5;text-transform:uppercase;letter-spacing:.06em;color:#52613d}
.rp-delivery p{margin:7px 0 0;font-size:14px;line-height:1.6;color:#505747}
.cv-rp-list .rp-sheet .rp-shot-img img{aspect-ratio:auto;object-fit:contain}
@media(min-width:901px) and (max-height:820px){.sc-industries{margin-top:14px}.sc-industries p{font-size:12px;line-height:1.55}}
@media(max-width:800px){.cv-rp-list .rp-added .rp-shots{grid-template-columns:minmax(0,1fr)}}
/* v42: money-first captions */
.sc-cap{gap:12px;padding-top:clamp(90px,16vh,170px)}
.sc-kpi{display:flex;flex-direction:column;gap:6px}
.sc-kpi-in{display:inline-flex;align-items:center;gap:8px;font-size:13px;letter-spacing:.02em;color:#c9ccbf}
.sc-kpi-in i{font-style:normal;color:var(--lime)}
.sc-kpi-out{font-family:'Manrope',Arial,sans-serif;font-weight:800;font-size:clamp(46px,5vw,84px);line-height:.95;letter-spacing:-.055em;color:var(--lime)}
.sc-kpi-label{max-width:56ch;font-size:clamp(13px,1vw,15px);line-height:1.45;color:#eceee4}
.sc-kpi-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.sc-chip{font-size:12.5px;line-height:1.2;padding:7px 11px;border-radius:30px;background:#ffffff14;border:1px solid #ffffff24;color:#cfd2c6;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.sc-chip b{color:#fff;font-weight:700}
.sc-cap-foot{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-top:8px;padding-top:14px;border-top:1px solid #ffffff1f}
.sc-cap-id{display:flex;flex-direction:column;gap:5px;min-width:0}
.sc-cap-name{font-size:clamp(20px,1.7vw,28px);letter-spacing:-.035em}
.sc-slide-logo>img{padding:8% 24% 50%}
/* v42: from case 2 on, the stage takes the full width */
@media(min-width:901px){
 .showcase{transition:grid-template-columns .9s cubic-bezier(.76,0,.24,1),column-gap .9s cubic-bezier(.76,0,.24,1)}
 .sc-intro,.sc-aside{transition:opacity .45s ease .25s,transform .7s cubic-bezier(.2,.7,.2,1) .2s,visibility 0s}
 .showcase.is-expanded{grid-template-columns:minmax(0,0fr) minmax(0,1fr);column-gap:0}
 .showcase.is-expanded .sc-intro,.showcase.is-expanded .sc-aside{opacity:0;transform:translateX(-48px);visibility:hidden;pointer-events:none;transition:opacity .25s ease,transform .5s cubic-bezier(.76,0,.24,1),visibility 0s .5s}
 .sc-intro,.sc-aside{width:min(40vw,640px)}
 .showcase.is-expanded .sc-cap{padding-left:clamp(28px,3.4vw,56px);padding-right:clamp(28px,3.4vw,56px)}
 .showcase.is-expanded .sc-kpi-out{font-size:clamp(64px,7.2vw,124px)}
 .showcase.is-expanded .sc-kpi-label{font-size:clamp(14px,1.15vw,18px)}
 .showcase.is-expanded .sc-slide-logo>img{padding:6% 34% 46%}
}
@media(min-width:901px) and (max-height:820px){
 .sc-kpi-out{font-size:min(5vw,9vh)}
 .showcase.is-expanded .sc-kpi-out{font-size:min(7.2vw,12vh)}
 .sc-cap{padding-top:12vh;gap:9px}
}
@media(prefers-reduced-motion:reduce){.showcase,.sc-intro,.sc-aside{transition:none!important}}
@media(max-width:900px){
 .sc-kpi-out{font-size:44px}
 .sc-cap-foot{flex-direction:column;align-items:stretch;gap:12px}
 .sc-cap-foot .sc-cta{justify-content:center}
 .sc-chip{font-size:12px;padding:6px 10px}
}
.sc-cap-foot{justify-content:flex-start;align-items:center;gap:clamp(20px,3vw,48px)}
@media(min-width:901px){.showcase.is-expanded .sc-slide-logo>img{padding:5% 30% 44%}}
/* v42: logo sits in the white area above the caption at any height */
.sc-slide-logo>img,.showcase.is-expanded .sc-slide-logo>img{position:absolute;top:0;left:0;width:100%;height:50%;padding:7% 18% 2%;object-fit:contain}
@media(max-width:900px){.sc-cap-foot{align-items:stretch}.sc-slide-logo>img{height:38%}}
.sc-slide-logo>img,.showcase.is-expanded .sc-slide-logo>img{height:40%;padding:6% 22% 1%}
.cv-highlights strong{white-space:nowrap}
/* v43: Agency case - overview table + identical campaign cards */
.ag-intro{max-width:62ch;margin:0 0 18px;font-size:15px;line-height:1.6;color:#56564f}
.ag-index{border:1px solid #d3d5c9;border-radius:14px;overflow:hidden;background:#fbfbf7}
.ag-index ol{list-style:none;margin:0;padding:0}
.ag-row{display:grid;grid-template-columns:30px minmax(0,1.45fr) minmax(0,.85fr) minmax(0,1.35fr) minmax(0,.85fr) minmax(0,1.5fr) 18px;gap:14px;align-items:center;padding:13px 18px;border-top:1px solid #e3e4da;color:var(--ink);font-size:13.5px;line-height:1.35;transition:background .2s}
.ag-row-head{border-top:0;padding:10px 18px;background:#eeefe6;font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:#6d7064}
a.ag-row:hover,a.ag-row:focus-visible{background:#eef3dc;outline:none}
.ag-row-num{font-size:11px;letter-spacing:.06em;color:#8a8d80}
.ag-row-name{font-family:'Manrope',Arial,sans-serif;font-weight:700}
.ag-row-ind,.ag-row-ch{color:#5c5f54}
.ag-row-budget{font-weight:600}
.ag-row-budget small{display:block;font-size:11px;font-weight:400;color:#8a8d80}
.ag-row-result{font-weight:700;color:#3e5a14}
.ag-row-go{color:#9a9d90;transition:transform .25s,color .25s}
a.ag-row:hover .ag-row-go{transform:translateY(3px);color:var(--ink)}
.ag-list{display:flex;flex-direction:column;margin-top:clamp(36px,5vw,64px)}
.ag-card{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.6fr);gap:clamp(22px,3vw,44px);padding:clamp(28px,3.4vw,44px) 0;border-top:1px solid #d3d5c9;transition:background .6s}
.ag-card.is-flash{animation:ag-flash 1.6s ease-out}
@keyframes ag-flash{0%{background:#e8f2c9}100%{background:transparent}}
.ag-cover{position:sticky;top:96px;align-self:start;margin:0;aspect-ratio:4/3;border-radius:14px;overflow:hidden;background:#d6d6cc}
.ag-cover img{display:block;width:100%;height:100%;object-fit:cover}
.ag-cover-num{position:absolute;left:12px;top:12px;padding:4px 9px;border-radius:999px;background:#151515;color:var(--lime);font-size:11px;letter-spacing:.08em}
.ag-head .ag-name{margin:0;font-family:'Manrope',Arial,sans-serif;font-size:clamp(22px,2vw,30px);letter-spacing:-.03em;line-height:1.15;color:var(--ink)}
.ag-tags{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0 0}
.ag-tags span{padding:5px 10px;border-radius:30px;border:1px solid #cfd2c4;background:#fff;color:#4c4f45;font-size:12px;line-height:1.2}
.ag-tags span:first-child{background:#151515;border-color:#151515;color:var(--lime)}
.ag-did{max-width:62ch;margin:14px 0 18px;font-size:15px;line-height:1.6;color:#3f423a}
.ag-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:0;border:1px solid #d9dacf;border-radius:12px;overflow:hidden;background:#fff}
.ag-stats>div{min-width:0;padding:12px 14px;border-left:1px solid #e3e4da}
.ag-stats>div:first-child{border-left:0}
.ag-stats dt{min-height:2.7em;font-size:10.5px;line-height:1.35;letter-spacing:.08em;text-transform:uppercase;color:#7a7d70}
.ag-stats dd{margin:6px 0 0;font:700 clamp(17px,1.45vw,22px)/1.1 'Manrope',Arial,sans-serif;letter-spacing:-.02em;color:var(--ink)}
.ag-stats .ag-budget{background:#151515}
.ag-stats .ag-budget dt{color:#c9d0bf}
.ag-stats .ag-budget dd{color:var(--lime)}
.ag-proof{display:flex;flex-wrap:wrap;gap:12px;margin-top:20px;padding:0}
.ag-proof-label{flex-basis:100%;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:#7a7d70}
.ag-proof .rp-shot{position:relative;flex:1 1 220px;max-width:360px;margin:0;padding:0;border:0;background:none;text-align:left;cursor:zoom-in}
.ag-proof .rp-shot::before{display:none}
.ag-proof .rp-shot-cap{margin:0 0 6px;font-size:11.5px;font-weight:600;letter-spacing:0;text-transform:none;color:#3f423a}
.ag-proof .rp-shot-img{border-radius:10px;border:1px solid #cfd2c4}
.ag-proof .rp-shot:hover .rp-shot-img{border-color:#151515}
@media(max-width:800px){
 .ag-row-head,.ag-row-ind,.ag-row-ch,.ag-row-budget{display:none}
 .ag-row{grid-template-columns:24px minmax(0,1fr) 14px;grid-template-areas:"num name go" "num result go";row-gap:3px;padding:12px 14px}
 .ag-row-num{grid-area:num}.ag-row-name{grid-area:name}.ag-row-result{grid-area:result;font-size:12.5px}.ag-row-go{grid-area:go}
 .ag-card{grid-template-columns:minmax(0,1fr);gap:16px}
 .ag-cover{position:relative;top:auto;aspect-ratio:16/9}
 .ag-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
 .ag-stats>div:nth-child(3){border-left:0}
 .ag-stats>div:nth-child(n+3){border-top:1px solid #e3e4da}
 .ag-proof .rp-shot{max-width:none}
}
@media(prefers-reduced-motion:reduce){.ag-card.is-flash{animation:none}}
.ag-card .ag-tags{margin:12px 0 0}
.ag-card .ag-did{margin:16px 0 20px}

/* v44: measured corners - squarer radius scale plus a chamfered signature corner on key surfaces */
:root{--r-xs:2px;--r-sm:4px;--r-md:6px;--cut:22px;--chamfer:polygon(0 0,calc(100% - var(--cut)) 0,100% var(--cut),100% 100%,0 100%)}
.contact-nav{border-radius:var(--r-xs)}
.funnel span{border-radius:var(--r-xs)}
.contact-portrait{border-radius:var(--r-xs)}
.media-image-link{border-radius:var(--r-sm)}
.media-image-link>span{border-radius:var(--r-xs)}
.project-media-item video{border-radius:var(--r-sm)}
.project-list-image{border-radius:var(--r-sm)}
.proof-image>a{border-radius:var(--r-sm)}
.proof-image>a>span{border-radius:var(--r-xs)}
.work-track-record .achievement-strip>div{border-radius:var(--r-xs)}
.budget-highlight{border-radius:var(--r-sm)}
.work-track-record .case-outcome{border-radius:0 4px 4px 0}
.work-track-record .project-list-image{border-radius:var(--r-xs)}
.work-track-record .budget-highlight{border-radius:var(--r-sm)}
.hero-btn{border-radius:var(--r-xs)}
.result-tile{border-radius:var(--r-sm)}
.system-map{border-radius:var(--r-sm)}
.system-inputs span{border-radius:var(--r-sm)}
.commerce-comparison{border-radius:var(--r-sm)}
.revenue-bar{border-radius:var(--r-xs)}
.case-kpis>div{border-radius:var(--r-sm)}
.funnel-flow li{border-radius:var(--r-sm)}
.system-flow>div{border-radius:var(--r-sm)}
.work-index>a{border-radius:var(--r-xs)}
.about-decisions .about-portrait .photo-window{border-radius:var(--r-sm)}
.career-disclosure{border-radius:var(--r-sm)}
.career-type{border-radius:var(--r-xs)}
.skill-tags>span{border-radius:var(--r-xs)}
.contact-button{border-radius:var(--r-xs)}
.portrait-note{border-radius:var(--r-xs)}
.rp-num{border-radius:var(--r-xs)}
.cv-btn{border-radius:var(--r-xs)}
.cv-hero{border-radius:var(--r-md)}
.cv-highlights>div{border-radius:var(--r-sm)}
.cv-end a{border-radius:var(--r-md)}
.fab-btn{border-radius:var(--r-sm)}
.fab-panel{border-radius:var(--r-md)}
.fab-copy{border-radius:var(--r-xs)}
.sc-skills li{border-radius:var(--r-sm)}
.tool{border-radius:var(--r-sm)}
/* Stage */ .sc-stage{border-radius:var(--r-md)}
.sc-stage-label,.sc-count{border-radius:var(--r-xs)}
.sc-cta{border-radius:var(--r-xs)}
.sc-tick::after{border-radius:var(--r-xs)}
.sc-tick:focus-visible{border-radius:var(--r-sm)}
.sc-stage{border-radius:var(--r-md)}
.sc-ticks{border-radius:var(--r-md)}
.sc-scroll-hint{border-radius:var(--r-xs)}
.cv-gallery .proof-image>a{border-radius:var(--r-md)}
.cv-rp-list .rp-cover{border-radius:var(--r-md)}
.cv-rp-list .rp-shot-img{border-radius:var(--r-sm)}
.sc-chip{border-radius:var(--r-xs)}
.ag-index{border-radius:var(--r-md)}
.ag-cover{border-radius:var(--r-md)}
.ag-cover-num{border-radius:var(--r-xs)}
.ag-tags span{border-radius:var(--r-xs)}
.ag-stats{border-radius:var(--r-sm)}
.ag-proof .rp-shot-img{border-radius:var(--r-sm)}
/* Chips, tags and pills read as crisp labels. */
.sc-skills li,.ag-tags span,.sc-chip,.ag-cover-num,.rp-num{border-radius:var(--r-xs)}
/* Signature: one chamfered corner with a lime edge on the main surfaces. */
.sc-stage,.cv-hero,.ag-cover,.cv-end a,.fab-panel,.cv-ghost{clip-path:var(--chamfer)}
.cv-end a,.fab-panel{--cut:14px}
.sc-stage::after,.cv-hero::after,.ag-cover::after,.cv-end a::after,.fab-panel::after{content:"";position:absolute;top:0;right:0;z-index:8;width:var(--cut);height:var(--cut);pointer-events:none;background:linear-gradient(to bottom left,transparent calc(50% - 1.6px),var(--lime) calc(50% - 1.6px),var(--lime) calc(50% + 1.6px),transparent calc(50% + 1.6px))}
.fab-panel{position:relative}
@keyframes sc-wipe{from{clip-path:polygon(0 100%,calc(100% - var(--cut)) 100%,100% 100%,100% 100%,0 100%)}to{clip-path:var(--chamfer)}}
@media(max-width:800px){:root{--cut:16px}}
/* Source and method notes run the full content width, aligned with the KPI grids above them. */
.cv-body .system-note{max-width:none}
/* v45: Meta Ads operations - problem → fix cards */
.ops-intro{margin:0 0 18px;color:#56564f}
.ops-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:0;padding:0;list-style:none}
.ops-card{position:relative;padding:20px 22px 22px;border:1px solid #d3d5c9;border-radius:var(--r-sm);background:#fbfbf7}
.ops-num{position:absolute;top:18px;right:20px;font-size:11px;letter-spacing:.1em;color:#9a9d90}
.ops-card h5{margin:0 0 14px;padding-right:40px;font-family:'Manrope',Arial,sans-serif;font-size:18px;letter-spacing:-.02em;color:var(--ink)}
.ops-row{display:grid;grid-template-columns:64px minmax(0,1fr);gap:12px;align-items:baseline}
.ops-row+.ops-row{margin-top:12px;padding-top:12px;border-top:1px dashed #d3d5c9}
.ops-label{font-size:10.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:#8a8d80}
.ops-fix .ops-label{color:#3e5a14}
.cv-body .ops-row p{margin:0;font-size:14.5px;line-height:1.6;color:#3f423a}
.cv-body .ops-fix p{color:var(--ink)}
.ops-result{margin-top:16px;padding:18px 22px;border-radius:var(--r-sm);background:#151515;color:var(--paper)}
.cv-body .ops-result-title{margin:0 0 12px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--lime)}
.ops-stats{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}
.ops-stats strong{display:block;font-family:'Manrope',Arial,sans-serif;font-size:clamp(18px,1.6vw,24px);letter-spacing:-.03em;white-space:nowrap}
.ops-stats span{font-size:12px;color:#b9bdb0}
.ops-stats div:last-child strong{color:var(--lime)}
@media(max-width:800px){.ops-grid{grid-template-columns:minmax(0,1fr)}.ops-stats{grid-template-columns:repeat(3,minmax(0,1fr))}.ops-row{grid-template-columns:minmax(0,1fr);gap:4px}}
.cv-body .ops-intro{max-width:none;margin:0 0 20px}
/* v46: the intro reveal uses a curtain over the stage instead of clipping the stage itself,
   so the cover and its "View case study" button are clickable from the first frame. */
.intro-enabled .sc-stage{animation:none}
.sc-stage::before{content:"";position:absolute;inset:0;z-index:9;background:#0e110d;pointer-events:none;transform-origin:50% 0;transform:scaleY(0)}
.intro-enabled .sc-stage::before{animation:sc-curtain 1.2s cubic-bezier(.76,0,.24,1) .6s both}
@keyframes sc-curtain{from{transform:scaleY(1)}to{transform:scaleY(0)}}
@media(prefers-reduced-motion:reduce){.intro-enabled .sc-stage::before{animation:none}}

/* ===== v46: HR-readiness and CV sync ===== */
/* Header: Download CV beside Let's talk */
.cv-nav{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border:1px solid #696962;border-radius:var(--r-xs,2px);font-size:14px;color:var(--paper);transition:border-color .25s,color .25s,background .25s}
.cv-nav:hover{border-color:var(--lime);color:var(--lime)}
@media(max-width:700px){.cv-nav{padding:8px 10px;font-size:13px}}
@media(max-width:420px){header nav a[href="#about"]{display:none}}

/* Hero: three headline numbers right under the intro */
.sc-proof{display:flex;flex-wrap:wrap;gap:8px 22px;margin:clamp(12px,1.8vh,18px) 0 0;padding:0;list-style:none}
.sc-proof li{display:flex;align-items:baseline;gap:7px}
.sc-proof b{font:800 clamp(20px,1.7vw,26px)/1 'Manrope',Arial,sans-serif;letter-spacing:-.03em;color:var(--lime)}
.sc-proof span{font-size:13px;color:#cdd3c4}
@media(min-width:901px) and (max-height:820px){.sc-proof{margin-top:1.2vh}.sc-proof b{font-size:20px}}

/* Tools: names always visible under each logo */
.sc-tools .sc-marquee,.sc-tools .sc-marquee:not(.is-static){height:78px}
.sc-marquee-track{align-items:flex-start;padding-top:6px}
.sc-marquee .tool{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:6px;width:auto;min-width:44px;height:auto;padding:8px 6px 0;background:none;transform-origin:50% 24%}
.sc-marquee .tool:hover{background:none}
.sc-marquee .tool .tool-logo{width:22px;height:22px}
.sc-marquee .tool:hover .tool-logo{background:var(--brand)}
.tool-name.tool-name-visible{position:static;width:auto;height:auto;overflow:visible;clip:auto;font-size:10.5px;line-height:1.2;letter-spacing:.01em;color:#c3c9b9;white-space:nowrap}
.sc-marquee .tool:hover .tool-name-visible{color:var(--paper)}
.sc-tools-current{display:none}
@media(min-width:901px) and (max-height:820px){.sc-tools .sc-marquee,.sc-tools .sc-marquee:not(.is-static){height:70px}}

/* Case-study ticks: company names always visible on desktop */
@media(min-width:901px){
 .sc-tick-name{max-width:220px;opacity:1}
 .sc-ticks{padding:10px 12px}
 .sc-tick{justify-content:flex-end}
}

/* Floating contact: a labelled button, not an icon only */
.fab-btn{width:auto;display:inline-flex;gap:8px;padding:0 16px 0 13px}
.fab-btn .fab-label{position:static;height:auto;padding:0;border:0;background:none;color:inherit;opacity:1;visibility:visible;transform:none;font:700 14px 'DM Sans',Arial,sans-serif}
.fab-btn:hover .fab-label,.fab-btn:focus-visible .fab-label{transform:none}
.fab-icon{width:19px;height:19px}
.contact-fab.is-open .fab-btn .fab-label{display:none}
.fab-cv .fab-link span::after{content:" ↓"}

/* Footer: contact, CV and last update */
.site-footer{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px 40px;align-items:end;padding:clamp(32px,4vw,48px) 5% clamp(28px,3vw,36px);padding-right:5%}
.sf-name{font:700 clamp(20px,1.8vw,26px)/1.2 'Manrope',Arial,sans-serif;letter-spacing:-.02em;color:var(--paper)}
.sf-role{margin-top:4px!important;font-size:14px;color:#b9bfae}
.sf-links{display:flex;flex-wrap:wrap;gap:12px;margin:0;padding:0;list-style:none}
.sf-links a{display:flex;flex-direction:column;gap:3px;min-width:180px;padding:12px 16px;border:1px solid #3a3d35;border-radius:var(--r-xs,2px);font-size:15px;font-weight:500;color:var(--paper);transition:border-color .25s,color .25s}
.sf-links a:hover{border-color:var(--lime);color:var(--lime)}
.sf-links small{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:#a3a99a}
.sf-links .sf-cv{background:var(--lime);border-color:var(--lime);color:var(--ink)}
.sf-links .sf-cv small{color:#3d4a1c}
.sf-links .sf-cv:hover{background:#c3f04f;color:var(--ink)}
.sf-meta{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:8px 24px;padding-top:18px!important;border-top:1px solid #2e312a;font-size:13px;color:#a3a99a}
.sf-meta span:nth-child(2){font:italic 15px Georgia,serif;color:var(--lime)}
.sf-meta a{margin-left:auto;color:#d3d8ca}
.sf-meta a:hover{color:var(--lime)}
@media(max-width:800px){.site-footer{grid-template-columns:minmax(0,1fr);padding-bottom:96px}.sf-links a{min-width:0;flex:1 1 100%}.sf-meta a{margin-left:0}}

/* About: freelance note and the in-house answer up front */
.journey-note{margin:-4px 0 14px!important;padding:10px 12px;border-left:3px solid #8aa25a;background:#f3f4ec;font-size:14px!important;line-height:1.55!important;color:#3f463a!important}
.journey-why{margin:2px 0 16px;padding:14px 16px;border-radius:var(--r-sm,4px);background:#151515;color:var(--paper)}
.journey-why b{display:block;margin-bottom:6px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--lime)}
.journey-why p{margin:0!important;font-size:15px!important;line-height:1.6!important;color:#e7eadf!important}

/* Case 01: three-line summary under the title */
.cv-tldr{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;margin:20px 0 0;border:1px solid #d3d5c9;border-radius:var(--r-sm,4px);background:#fbfbf7;overflow:hidden}
.cv-tldr>div{padding:16px 18px;border-left:1px solid #e3e4da}
.cv-tldr>div:first-child{border-left:0}
.cv-tldr dt{margin-bottom:6px;font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#3e5a14}
.cv-tldr dd{margin:0;font-size:15px;line-height:1.55;color:#2c2e28}
.cv-tldr dd b{color:var(--ink)}
@media(max-width:800px){.cv-tldr{grid-template-columns:minmax(0,1fr)}.cv-tldr>div{border-left:0;border-top:1px solid #e3e4da}.cv-tldr>div:first-child{border-top:0}}

/* Case pages: shorter cover so role, budget and headline numbers sit in the first screen */
@media(min-width:801px){
 .cv-hero{height:min(36vh,380px);min-height:240px}
 .cv-head{padding-top:clamp(40px,7vh,80px);padding-bottom:clamp(18px,2.4vw,30px)}
 .cv-title{font-size:clamp(34px,4.2vw,64px)}
 .cv-summary{margin-top:clamp(22px,3vw,36px)}
}
@media(max-width:800px){.cv-hero{aspect-ratio:16/11}}

/* Readability: 16px body copy on phones and in case pages; small labels at ≥4.5:1 */
.cv-body p,.cv-body li,.ag-did,.ops-row p,.journey-job-content p{font-size:16px;line-height:1.6}
.cv-body .system-note,.cv-body .ag-intro{font-size:14px;line-height:1.6;color:#55594e}
.case-kpis small,.cv-facts dt,.ag-stats dt,.ops-label,.ag-proof-label{color:#5d6153}
@media(max-width:800px){
 .sc-lede,.sc-industries p,.journey-bio p,.cv-did{font-size:16px;line-height:1.6}
 .sc-chip{font-size:13px}
 .sc-label,.sc-meta{color:#b6bcab}
}
/* v46 fixes: "Digital marketing" on one line; only the logo grows in the tools strip */
.sc-role{max-width:none;font-size:clamp(34px,3.55vw,60px)}
@media(min-width:901px) and (max-height:820px){.sc-role{font-size:min(3.55vw,7.4vh)}}
.sc-marquee .tool{transform:none}
.sc-marquee .tool .tool-logo{transform:scale(var(--s,1));transform-origin:50% 60%;transition:background .25s}
.sc-industries{margin-bottom:4px}
@media(max-width:580px){.sc-role{font-size:10vw}}
.case-kpis.case-kpis-5{grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}
.case-kpis.case-kpis-5 strong{font-size:clamp(22px,2vw,30px)}
@media(min-width:801px){.sf-meta{padding-right:170px}}
/* Phones: header keeps logo + Download CV; contact lives in the floating button */
@media(max-width:600px){
 header nav a[href="#top"],header nav a[href="#about"],header .contact-nav{display:none}
 header nav{gap:0}
 .cv-nav{padding:9px 14px;font-size:14px}
}
/* v47: Intertu spend figures removed - revenue block has 3 tiles, Meta strip has 5 */
.case-kpis.case-money{grid-template-columns:repeat(3,minmax(0,1fr))}
.ops-stats{grid-template-columns:repeat(5,minmax(0,1fr))}
@media(max-width:800px){.case-kpis.case-money{grid-template-columns:minmax(0,1fr)}.ops-stats{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* v49: hero lead funnel (canvas particles fill the space between Industries and Skills) */
.sc-intro{display:flex;flex-direction:column}
.sc-funnel{position:relative;flex:1 1 auto;min-height:104px;max-height:190px;margin:clamp(12px,2vh,22px) 0 0;cursor:crosshair;overflow:hidden}
.sc-funnel canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.sc-funnel-cap{position:relative;display:flex;justify-content:space-between;gap:12px;font-size:10.5px;letter-spacing:.12em;color:#9ea495;text-transform:uppercase;white-space:nowrap}
.sc-funnel-cap span:first-child{color:var(--lime)}
.sc-funnel-cap span:last-child{letter-spacing:.02em;text-transform:none;overflow:hidden;text-overflow:ellipsis}
.sc-funnel-stages{position:relative;z-index:1;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:6px 0 0;padding:0;list-style:none;pointer-events:none}
.sc-funnel-stages li{display:flex;align-items:baseline;gap:5px;padding-left:6px;opacity:.35;transition:opacity .5s,color .25s}
.sc-funnel-stages li:first-child{padding-left:0}
.sc-funnel-stages li.is-on{opacity:1}
.sc-funnel-stages b{font:800 clamp(16px,1.35vw,21px)/1 'Manrope',Arial,sans-serif;letter-spacing:-.03em;color:var(--paper);font-variant-numeric:tabular-nums;transition:color .25s}
.sc-funnel-stages span{font-size:11.5px;color:#b9bfae}
.sc-funnel-stages li:last-child b,.sc-funnel-stages li.is-hot b{color:var(--lime)}
.intro-enabled .sc-funnel{animation:sc-rise .9s cubic-bezier(.2,.75,.2,1) both;animation-delay:1s}
@media(min-width:901px) and (max-height:820px){.sc-funnel{min-height:92px;margin-top:10px}.sc-funnel-cap{font-size:10px}.sc-funnel-stages{margin-top:4px}}
@media(max-width:900px){.sc-funnel{flex:none;height:150px;max-height:none;margin-top:22px;cursor:auto}}
@media(max-width:580px){.sc-funnel-cap span:last-child{display:none}.sc-funnel-stages b{font-size:17px}.sc-funnel-stages span{font-size:10.5px}}
/* v49: the funnel takes whatever room is left in the intro column, never more */
@media(min-width:901px){
 .sc-intro{min-height:0;overflow:hidden}
 .sc-funnel{flex:1 1 0;min-height:64px;max-height:200px}
}
@media(min-width:901px) and (max-height:740px){.sc-industries{display:none}}
/* v49: give the funnel more height by tightening the Skills / Tools column */
@media(min-width:901px){.sc-aside{gap:18px;padding-bottom:4px}.sc-funnel-stages{margin-top:4px}}

/* ===== v50: hero tells one story - role, what and why, the funnel as proof, what's next ===== */
.sc-next{display:flex;align-items:baseline;gap:10px;max-width:46ch;margin:clamp(10px,1.6vh,16px) 0 0;font-size:14px;line-height:1.5;color:#dfe3d6}
.sc-next span{flex:none;padding:3px 7px;border:1px solid #d0ff6266;border-radius:var(--r-xs,2px);font-size:10.5px;letter-spacing:.14em;color:var(--lime)}

/* Funnel block: a caption, four labelled stages, the particle stream, one line on why it matters. */
.sc-funnel{display:flex;flex-direction:column;flex:1 1 0;min-height:0;max-height:none;margin:clamp(18px,3vh,32px) 0 0;cursor:auto;overflow:visible}
.sc-funnel-cap{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding-bottom:8px;border-bottom:1px solid #ffffff1c;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#9ea495;white-space:nowrap}
.sc-funnel-cap span:first-child{color:var(--paper);letter-spacing:.12em}
.sc-funnel-cap span:last-child{letter-spacing:.04em;text-transform:none;font-size:11.5px}
.sc-funnel-stages{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:10px 0 0;padding:0;list-style:none;pointer-events:none}
.sc-funnel-stages li{display:flex;flex-direction:column;gap:3px;padding:0;opacity:.3;transition:opacity .6s}
.sc-funnel-stages li.is-on{opacity:1}
.sc-funnel-stages p{display:flex;align-items:baseline;gap:5px;margin:0}
.sc-funnel-stages b{font:800 clamp(20px,1.8vw,28px)/1 'Manrope',Arial,sans-serif;letter-spacing:-.035em;color:var(--paper);font-variant-numeric:tabular-nums}
.sc-funnel-stages p span{font-size:12px;font-weight:600;color:#dfe3d6}
.sc-funnel-stages small{font-size:11px;line-height:1.35;color:#9ea495}
.sc-funnel-stages li:last-child b{color:var(--lime)}
.sc-funnel-flow{position:relative;flex:1 1 0;min-height:64px;margin-top:4px}
.sc-funnel-flow canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.sc-funnel-why{margin:6px 0 0;max-width:62ch;font-size:13px;line-height:1.55;color:#c9cebf}
.sc-funnel-why b{color:var(--paper);font-weight:700}
.sc-funnel-why b:first-child{color:var(--lime)}

/* The aside now holds only the tools strip, pinned to the bottom of the column. */
@media(min-width:901px){
 .sc-intro{overflow:visible}
 .sc-aside{justify-content:flex-end;gap:0;padding:clamp(14px,2vh,22px) 0 0}
}
@media(min-width:901px) and (max-height:820px){
 .sc-next{font-size:13px;margin-top:8px}
 .sc-funnel{margin-top:14px}
 .sc-funnel-stages{margin-top:7px}
 .sc-funnel-stages small{font-size:10.5px}
 .sc-funnel-why{font-size:12.5px;line-height:1.45}
}
@media(min-width:901px) and (max-height:700px){.sc-funnel-stages small{display:none}}
@media(max-width:900px){
 .sc-funnel{flex:none;height:auto;margin-top:26px}
 .sc-funnel-flow{flex:none;height:120px}
}
@media(max-width:580px){
 .sc-funnel-cap span:last-child{display:none}
 .sc-funnel-stages{gap:8px}
 .sc-funnel-stages b{font-size:19px}
 .sc-funnel-stages small{font-size:10.5px}
}

/* ===== v51: left = who and what for; right = where and the proof ===== */
.sc-funnel-why{font-size:14px;line-height:1.5;color:#e7eadf;max-width:50ch}
/* Case list on the cover: numbers only; the name shows for the case on screen and on hover. */
.sc-tick-name{max-width:0;opacity:0}
.sc-tick.is-active .sc-tick-name,.sc-ticks:hover .sc-tick-name,.sc-tick:focus-visible .sc-tick-name{max-width:220px;opacity:1}
@media(min-width:901px){.sc-ticks{padding:8px 10px}}
/* Dashboard covers: show the top-left of the screenshot, where the headline cards are. */
.sc-slide-shot>img,.cv-cover-shot>img{object-position:0 0;background:#0d1117}
.sc-chip-quiet{opacity:.78}
/* Tools: a quiet reference row, after the story. */
.sc-tools .sc-label{opacity:.7}
.sc-tools .sc-marquee,.sc-tools .sc-marquee:not(.is-static){height:58px}
.sc-marquee .tool .tool-logo{width:17px;height:17px}
.sc-marquee .tool{opacity:.62;transition:opacity .25s}
.sc-marquee .tool:hover{opacity:1}
.tool-name.tool-name-visible{font-size:10px}
/* v51: the dashboard reads as a screen, not as a background behind text */
.sc-slide-shot{background:radial-gradient(ellipse at 70% 10%,#d0ff6214,transparent 60%),#0b0d0a}
.sc-slide-shot>img{position:absolute;inset:64px 24px auto 24px;width:calc(100% - 48px);height:44%;object-fit:cover;object-position:0 0;border:1px solid #ffffff24;border-radius:var(--r-sm,4px);box-shadow:0 18px 40px #00000080}
.sc-slide.sc-slide-shot.is-active:hover>img{transform:translateY(-3px);filter:none}
.sc-slide-shot .sc-cap{background:linear-gradient(180deg,transparent,#0b0d0a 18%)}
@media(min-width:801px){
 .cv-hero:has(.cv-cover-shot){background:#0b0d0a}
 .cv-cover-shot{left:42%;inset-block:22px;right:22px;border:1px solid #ffffff24;border-radius:var(--r-sm,4px);overflow:hidden}
 .cv-hero:has(.cv-cover-shot) .cv-head{right:58%;background:none;padding-top:24px}
}

/* ===== v52: spotlight cursor ===== */
html.has-spot,html.has-spot *{cursor:none!important}
.spot{position:fixed;left:0;top:0;z-index:2147483000;width:0;height:0;pointer-events:none;opacity:0;transition:opacity .35s}
.spot.is-on{opacity:1}
.spot>span{position:absolute;left:0;top:0;border-radius:50%;transform:translate(-50%,-50%)}
/* Light text turns lime inside the beam; dark surfaces stay dark. */
.spot-tint{width:230px;height:230px;background:radial-gradient(circle,#d0ff62 0,#d0ff62 26%,rgba(208,255,98,.55) 46%,rgba(208,255,98,0) 70%);mix-blend-mode:multiply;transition:opacity .3s,width .3s,height .3s}
.spot-glow{width:560px;height:560px;background:radial-gradient(circle,rgba(208,255,98,.15) 0,rgba(208,255,98,.05) 38%,rgba(208,255,98,0) 66%);mix-blend-mode:screen;transition:opacity .3s}
.spot-dot{width:7px;height:7px;background:#d0ff62;box-shadow:0 0 0 3px rgba(21,21,21,.55),0 0 14px #d0ff62;transition:width .25s cubic-bezier(.2,.75,.2,1),height .25s cubic-bezier(.2,.75,.2,1),background .25s,border-color .25s}
.spot.is-link .spot-dot{width:36px;height:36px;background:rgba(208,255,98,.08);border:1.5px solid #d0ff62;box-shadow:0 0 22px rgba(208,255,98,.45)}
.spot.is-link .spot-tint{width:270px;height:270px}
.spot.is-down .spot-dot{width:22px;height:22px}
/* On the light sections the beam becomes a soft highlighter and the dot turns ink for contrast. */
.spot.on-light .spot-tint{opacity:.42}
.spot.on-light .spot-glow{opacity:0}
.spot.on-light .spot-dot{background:#151515;box-shadow:0 0 0 3px rgba(208,255,98,.7)}
.spot.on-light.is-link .spot-dot{background:rgba(21,21,21,.06);border-color:#151515;box-shadow:none}
/* Lime things catch the light: lime text flares, lime surfaces get a halo. */
.is-lit{text-shadow:0 0 12px rgba(208,255,98,.9),0 0 30px rgba(208,255,98,.5);transition:text-shadow .25s}
.is-lit-bg{box-shadow:0 0 0 1px rgba(208,255,98,.6),0 0 26px rgba(208,255,98,.55),0 0 60px rgba(208,255,98,.25)!important;filter:brightness(1.08) saturate(1.1);transition:box-shadow .25s,filter .25s}
/* The stage's own "View case" disc already marks the cover; hide the dot there to avoid two markers. */
.spot.on-stage .spot-dot{opacity:0}
@media(prefers-reduced-motion:reduce){.spot,.spot>span,.is-lit,.is-lit-bg{transition:none}}
/* v52 fix: each layer blends with the page itself (a positioned wrapper would isolate the blend). */
.spot{display:contents}
.spot>span{position:fixed;left:0;top:0;z-index:2147483000;pointer-events:none;transform:translate3d(var(--sx,-999px),var(--sy,-999px),0) translate(-50%,-50%);opacity:0;transition:opacity .35s,width .25s cubic-bezier(.2,.75,.2,1),height .25s cubic-bezier(.2,.75,.2,1),background .25s,border-color .25s}
.spot.is-on>span{opacity:1}
.spot.is-on.on-light .spot-tint{opacity:.42}
.spot.is-on.on-light .spot-glow,.spot.is-on.on-stage .spot-dot{opacity:0}

/* ===== v53: smaller beam; look follows the surface under the pointer ===== */
.spot .spot-tint{width:150px;height:150px}
.spot .spot-glow{width:300px;height:300px}
.spot.is-link .spot-tint{width:170px;height:170px}
.spot.is-link .spot-dot{width:30px;height:30px}
/* Dark surface: lime beam, lime dot (default). */
/* Light surface: soft highlighter, ink dot. */
.spot.is-on.m-light .spot-tint{opacity:.4}
.spot.is-on.m-light .spot-glow{opacity:0}
.spot.m-light .spot-dot{background:#151515;box-shadow:0 0 0 3px rgba(208,255,98,.75)}
.spot.m-light.is-link .spot-dot{background:rgba(21,21,21,.06);border-color:#151515;box-shadow:0 0 0 3px rgba(208,255,98,.35)}
/* Photos and screenshots: white dot with a dark edge reads on any image; a visible lime glow shows where you are. */
.spot.is-on.m-media .spot-tint{opacity:.35}
.spot.is-on.m-media .spot-glow{opacity:1;background:radial-gradient(circle,rgba(208,255,98,.32) 0,rgba(208,255,98,.1) 40%,rgba(208,255,98,0) 66%)}
.spot.m-media .spot-dot{background:#fff;box-shadow:0 0 0 2px #151515,0 0 0 5px rgba(208,255,98,.8)}
.spot.m-media.is-link .spot-dot{background:rgba(255,255,255,.12);border:2px solid #fff;box-shadow:0 0 0 1.5px #151515,0 0 18px rgba(208,255,98,.6)}
/* Lime surfaces: no extra light (it glares); an ink ring and a soft shade that follows the pointer. */
.spot.is-on.m-lime .spot-tint,.spot.is-on.m-lime .spot-glow{opacity:0}
.spot.m-lime .spot-dot{background:#151515;box-shadow:none}
.spot.m-lime.is-link .spot-dot{background:transparent;border:1.5px solid #151515;box-shadow:none}
.is-shaded{background-image:radial-gradient(circle 140px at var(--shx,50%) var(--shy,50%),rgba(21,21,21,.10),rgba(21,21,21,0) 100%)!important}
.is-lit-bg{box-shadow:none!important;filter:none}

/* Keep real funnel totals legible before scripts load or when canvas is unavailable. */
.sc-funnel-stages li{opacity:1}
@media(prefers-reduced-motion:reduce){.spot,.spot>span,.is-lit,.is-shaded{transition:none!important}}

/* Portfolio: personal introduction followed by a single work-and-journey narrative. */
.new-hero{position:relative;isolation:isolate;overflow:hidden;background:#111611;min-height:calc(100svh - var(--header-h,78px));padding:clamp(36px,6vw,86px) 5% 76px}
.new-hero .parallax-background{position:absolute;inset:0 36% 0 0;z-index:-1;pointer-events:none;mask-image:linear-gradient(90deg,#000 75%,transparent)}
.new-hero .ambient-band{left:-45%;width:160%}.new-hero .band-two{left:-32%}.new-hero .band-three{left:-50%}
.nh-inner{width:min(100%,1600px);margin:auto;display:grid;grid-template-columns:minmax(0,1.12fr) minmax(300px,.68fr);align-items:center;gap:clamp(40px,8vw,150px)}
.nh-copy{padding:0 0 30px}.nh-meta,.nh-eyebrow,.nh-expertise,.nh-scroll,.nh-portrait figcaption,.nh-portrait-inset figcaption{font-size:10px;letter-spacing:.14em;text-transform:uppercase}
.nh-meta{display:flex;justify-content:space-between;gap:22px;max-width:720px;color:#afb4a6;margin-bottom:clamp(42px,7vh,84px)}
.nh-eyebrow{color:var(--lime);font-weight:700;margin:0 0 24px}.nh-dot{display:inline-block;width:7px;height:7px;background:var(--lime);border-radius:50%;margin-right:8px;box-shadow:0 0 16px #d0ff62}
.new-hero h1{margin:0;font:800 clamp(49px,6.4vw,104px)/.98 'Manrope',Arial,sans-serif;letter-spacing:-.065em;text-transform:uppercase;color:#f4f4ef}.new-hero h1 em{font-style:normal;color:var(--lime)}
.nh-intro{max-width:54ch;color:#d1d5ca;font-size:clamp(16px,1.3vw,19px);line-height:1.65;margin:28px 0 30px}
.nh-actions{display:flex;gap:12px;flex-wrap:wrap}.nh-actions a{display:inline-flex;align-items:center;justify-content:space-between;gap:30px;min-height:50px;padding:12px 18px;font-weight:700;font-size:13px;border:1px solid #8a9182;transition:background .25s,color .25s,border-color .25s}.nh-actions a span{font-size:17px;transition:transform .25s}.nh-primary{background:var(--lime);color:#151515;border-color:var(--lime)!important}.nh-primary:hover{background:#e3ffad}.nh-secondary:hover{background:#f4f4ef;color:#151515}.nh-actions a:hover span{transform:translate(3px,3px)}
.nh-expertise{display:flex;gap:16px 32px;flex-wrap:wrap;color:#a5ac9d;margin-top:clamp(35px,6vh,70px);padding-top:19px;border-top:1px solid #ffffff2b;max-width:700px}
.nh-portrait-wrap{position:relative;margin:0 0 14px clamp(12px,2vw,35px)}.nh-portrait{position:relative;margin:0;max-width:510px;margin-left:auto;aspect-ratio:4/5;overflow:hidden;background:#282e27;clip-path:polygon(0 0,calc(100% - 25px) 0,100% 25px,100% 100%,0 100%)}.nh-portrait:after{content:"";position:absolute;inset:35% 0 0;background:linear-gradient(transparent,#101510a8);pointer-events:none}.nh-portrait img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 34%}.nh-portrait figcaption{position:absolute;z-index:1;left:22px;right:22px;bottom:17px;display:flex;justify-content:space-between;color:#f4f4ef;gap:12px}
.nh-portrait-inset{position:absolute;z-index:2;width:clamp(92px,11vw,160px);aspect-ratio:4/5;left:clamp(-50px,-3vw,-15px);bottom:-28px;margin:0;padding:5px;background:var(--lime);box-shadow:0 18px 40px #0008}.nh-portrait-inset img{width:100%;height:100%;display:block;object-fit:cover;object-position:center 35%}.nh-portrait-inset figcaption{position:absolute;bottom:5px;left:5px;right:5px;padding:5px;background:#141914c9;color:#fff;font-size:8px}.nh-portrait-accent{position:absolute;right:-20px;top:-30px;font-size:48px;color:var(--lime);line-height:1}
.nh-scroll{position:absolute;bottom:25px;left:5%;display:flex;align-items:center;gap:16px;color:#b2b9aa}.nh-scroll span:last-child{font-size:18px;color:var(--lime)}
.work-journey{background:#f2f3ed;color:#151515;padding:clamp(78px,9vw,140px) 5% clamp(80px,10vw,150px);position:relative;overflow:clip}.wj-wrap{width:min(100%,1600px);margin:auto;display:grid;grid-template-columns:minmax(230px,.58fr) minmax(0,1.42fr);gap:clamp(40px,7vw,110px);align-items:start}.wj-intro{position:sticky;top:calc(var(--header-h,78px) + 40px);padding-bottom:36px}.wj-kicker,.wj-legend,.wj-key,.project-top,.project-role,.project-metrics span,.project-footnote,.project-link,.project-origin>span{font-size:10px;letter-spacing:.13em;text-transform:uppercase}.wj-kicker{display:block;color:#737c6b;margin-bottom:25px}.wj-intro h2{font:800 clamp(39px,4.8vw,70px)/1 'Manrope',Arial,sans-serif;letter-spacing:-.06em;margin:0}.wj-intro h2 em{font-style:normal;color:#6a831d}.wj-intro>p{max-width:27ch;font-size:15px;line-height:1.65;color:#62685d;margin:24px 0 38px}.wj-legend{display:flex;align-items:center;gap:10px;color:#60685a}.wj-legend span{width:28px;height:1px;background:#829b37}.wj-key{display:grid;gap:8px;margin-top:clamp(55px,12vh,120px);padding-top:20px;border-top:1px solid #cfd3c6;letter-spacing:.08em;color:#777f71}.wj-key b{color:#252c23;margin-bottom:4px}
.wj-list{border-top:1px solid #bdc4b6}.project-row{display:block;padding:21px 0 45px;border-bottom:1px solid #bdc4b6;color:#171c17}.project-top{display:flex;justify-content:space-between;gap:15px;color:#6f786a;margin-bottom:17px}.project-visual{overflow:hidden;aspect-ratio:16/8.2;background:#192019;position:relative;clip-path:polygon(0 0,calc(100% - 18px) 0,100% 18px,100% 100%,0 100%)}.project-visual img{display:block;width:100%;height:100%;object-fit:cover;object-position:center;transition:transform .7s cubic-bezier(.2,.7,.2,1)}.project-row:hover .project-visual img,.project-row:focus-visible .project-visual img{transform:scale(1.035)}.project-logo{background:#fff}.project-logo img{object-fit:contain;padding:9% 20%}.project-copy{padding:22px 0 0}.project-name{display:flex;align-items:start;justify-content:space-between;gap:20px}.project-role{color:#6b7568;margin:0 0 8px}.project-name h3,.project-origin h3{font:800 clamp(26px,3.5vw,47px)/1.05 'Manrope',Arial,sans-serif;letter-spacing:-.05em;margin:0}.project-arrow{display:grid;place-items:center;flex:none;width:46px;height:46px;border:1px solid #acb5a8;border-radius:50%;font-size:20px;transition:background .25s,transform .25s,border-color .25s}.project-row:hover .project-arrow,.project-row:focus-visible .project-arrow{background:var(--lime);border-color:var(--lime);transform:translate(3px,-3px)}
.project-description{max-width:65ch;margin:17px 0 22px;font-size:15px;line-height:1.6;color:#566055}.project-metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:#cfd5c8;border:1px solid #cfd5c8}.project-metrics>div{padding:18px 20px;background:#e7ebdf;min-width:0}.project-metrics span{display:block;color:#65755a;margin-bottom:8px}.project-metrics strong{display:block;font:800 clamp(23px,2.4vw,36px)/1.06 'Manrope',Arial,sans-serif;letter-spacing:-.05em;color:#253e18}.project-metrics strong i,.origin-result i{font-style:normal;font-size:.45em;letter-spacing:0}.project-metrics small{display:block;margin-top:9px;color:#657061;font-size:11px;line-height:1.45}.project-footnote{letter-spacing:0;text-transform:none;color:#687164;line-height:1.5;margin:11px 0 0}.project-link{display:inline-flex;align-items:center;gap:12px;margin-top:22px;font-weight:700;color:#30492a}.project-link span{font-size:17px;transition:transform .25s}.project-row:hover .project-link span{transform:translate(4px,-4px)}
.project-origin{display:grid;grid-template-columns:1fr 1.5fr 1fr;gap:22px;padding:34px 0;align-items:start}.project-origin>span{color:#6b7568}.project-origin h3{font-size:27px}.project-origin p{color:#687164;font-size:13px;line-height:1.55;margin:9px 0 0}.origin-result strong{display:block;font:800 28px/1.1 'Manrope',Arial,sans-serif;letter-spacing:-.04em;color:#304f21}.origin-result span{display:block;font-size:12px;color:#687164;margin-top:8px}
@media(max-width:950px){.nh-inner{grid-template-columns:minmax(0,1fr) minmax(240px,.75fr);gap:35px}.new-hero h1{font-size:clamp(43px,6.1vw,68px)}.wj-wrap{grid-template-columns:1fr;gap:40px}.wj-intro{position:relative;top:auto;display:grid;grid-template-columns:1fr 1fr;gap:12px 30px}.wj-kicker{grid-column:1/-1;margin-bottom:4px}.wj-intro>p{margin:5px 0}.wj-key{display:none}.wj-legend{grid-column:1/-1}.wj-intro h2{font-size:clamp(40px,7vw,65px)}}
@media(max-width:650px){.new-hero{padding:32px 6% 65px}.new-hero .parallax-background{inset:0;mask-image:none}.nh-inner{display:flex;flex-direction:column;align-items:stretch;gap:34px}.nh-meta{font-size:9px;margin-bottom:45px}.nh-copy{padding:0}.nh-eyebrow{margin-bottom:17px}.new-hero h1{font-size:clamp(39px,10vw,60px)}.nh-intro{font-size:15px;margin:21px 0 24px}.nh-expertise{margin-top:30px;padding-top:16px;font-size:9px}.nh-portrait-wrap{width:82%;max-width:370px;margin:0 0 26px auto}.nh-portrait-inset{width:100px;left:-30px;bottom:-20px}.nh-scroll{bottom:18px;left:6%;font-size:9px}.nh-scroll span:last-child{font-size:15px}.work-journey{padding:70px 6% 80px}.wj-intro{display:block}.wj-kicker{margin-bottom:16px}.wj-intro>p{margin:18px 0 22px}.wj-list{margin-top:0}.project-top{font-size:9px}.project-visual{aspect-ratio:16/10}.project-name h3{font-size:30px}.project-arrow{width:40px;height:40px}.project-metrics>div{padding:14px 12px}.project-metrics strong{font-size:clamp(20px,5vw,27px)}.project-metrics span{font-size:9px}.project-metrics small{font-size:10px}.project-origin{grid-template-columns:1fr;gap:16px}}
@media(prefers-reduced-motion:reduce){.new-hero .parallax-background *{animation:none!important}.project-visual img,.project-arrow,.project-link span{transition:none!important}}
/* A concise route to the work most relevant to performance roles. */
.wj-priority{display:flex;flex-wrap:wrap;gap:7px;margin-top:28px}.wj-priority>span{flex-basis:100%;font-size:10px;letter-spacing:.13em;color:#707a6b;margin-bottom:4px}.wj-priority a{display:inline-flex;align-items:center;gap:6px;border:1px solid #bec7b6;padding:8px 10px;color:#30452b;font-size:11px;font-weight:700;transition:background .25s,border-color .25s}.wj-priority a small{font-size:10px;font-weight:400;color:#697566}.wj-priority a:hover,.wj-priority a:focus-visible{background:#d0ff62;border-color:#8aa638}.wj-key{margin-top:clamp(30px,6vh,65px)}
@media(max-width:950px){.wj-priority{grid-column:1/-1;margin-top:10px}}
@media(max-width:650px){.wj-priority{margin-top:22px}}

/* Identity, tactile portrait frame, and clearer project chapters. */
.new-hero h1{font-size:clamp(43px,5.45vw,88px);letter-spacing:-.06em}
.nh-portrait-wrap{--portrait-x:0px;--portrait-y:0px;--glow-x:50%;--glow-y:50%;padding:6px;border:1px solid #d0ff6280;background:#182018;isolation:isolate;transition:border-color .3s,box-shadow .3s}
.nh-portrait-wrap::before{content:"";position:absolute;inset:-12px;border:1px solid #d0ff6240;clip-path:polygon(0 0,calc(100% - 25px) 0,100% 25px,100% 100%,0 100%);pointer-events:none;transition:border-color .3s,transform .35s}
.nh-portrait-wrap::after{content:"";position:absolute;left:-8px;bottom:-8px;width:58px;height:58px;border-left:2px solid #d0ff62;border-bottom:2px solid #d0ff62;pointer-events:none}
.nh-portrait-wrap:hover{border-color:#d0ff62;box-shadow:0 0 34px #d0ff621c}.nh-portrait-wrap:hover::before{border-color:#d0ff6299;transform:translate(-3px,3px)}
.nh-portrait img{transform:scale(1.035);transition:transform .3s ease-out}.nh-portrait-wrap:hover .nh-portrait img{transform:scale(1.055) translate3d(var(--portrait-x),var(--portrait-y),0)}
.nh-portrait-glint{position:absolute;inset:0;z-index:1;pointer-events:none;opacity:0;background:radial-gradient(circle at var(--glow-x) var(--glow-y),#d0ff6230 0,transparent 45%);mix-blend-mode:screen;transition:opacity .3s}.nh-portrait-wrap:hover .nh-portrait-glint{opacity:1}.nh-portrait figcaption{z-index:2}
.project-row{padding:30px 0 58px;border-bottom:2px solid #a8b3a1}.project-top{align-items:center;margin-bottom:19px;padding:11px 14px;border-left:3px solid #6a8c32;background:#e4eadc;color:#30442b;font-size:12px;font-weight:700;letter-spacing:.1em}.project-top span:last-child{color:#495d42;font-size:11px}.project-row>.project-name{margin:0 0 20px}.project-row>.project-name .project-role{color:#52634d;font-size:11px;font-weight:700}.project-row>.project-name h3{color:#151b15}.project-copy{padding-top:20px}
.project-gallery{background:#172019}.project-gallery>img{position:absolute;inset:0;opacity:0;transition:opacity .85s ease,transform .7s cubic-bezier(.2,.7,.2,1);pointer-events:none}.project-gallery>img.is-current{opacity:1}.project-gallery>img.gallery-portrait{object-fit:contain;background:linear-gradient(135deg,#18241d,#0b100d)}.project-gallery>img.gallery-contain{object-fit:contain;padding:8% 20%;background:#fff}.gallery-meta{position:absolute;z-index:2;left:14px;right:14px;bottom:14px;display:flex;align-items:center;justify-content:space-between;gap:10px;pointer-events:none;color:#fff;font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase}.gallery-meta span{background:#111b15dc;padding:7px 9px}.cv-ghost-inner.is-multi>img:not(.is-current){display:none}.cv-ghost-inner.is-multi .gallery-meta{display:none}
.personal-signoff{background:#151b16;color:#f4f4ef;padding:clamp(45px,6vw,85px) 5%;display:flex;align-items:center;gap:clamp(24px,4vw,64px);justify-content:center;border-top:1px solid #444d3f}.personal-signoff figure{width:clamp(110px,14vw,180px);aspect-ratio:4/5;overflow:hidden;margin:0;flex:none;border:1px solid #d0ff6270;padding:4px}.personal-signoff figure img{width:100%;height:100%;object-fit:cover;object-position:center 30%;display:block}.personal-signoff>div{width:min(100%,680px)}.personal-signoff>div>span{font-size:10px;letter-spacing:.13em;color:#b7c0ae}.personal-signoff h2{font:800 clamp(30px,3.7vw,52px)/1.05 'Manrope',Arial,sans-serif;letter-spacing:-.05em;margin:12px 0}.personal-signoff h2 em{font-style:normal;color:#d0ff62}.personal-signoff p{margin:0 0 20px;color:#bec7b7;font-size:14px}.personal-signoff a{display:inline-flex;gap:25px;align-items:center;font-size:12px;font-weight:700;border-bottom:1px solid #d0ff62;padding:0 0 5px}.personal-signoff a span{color:#d0ff62}
@media(hover:hover) and (pointer:fine){html,body{cursor:url('icons/cursor-personal.svg') 3 2,auto}a[href],button,summary,[role="button"],label[for]{cursor:pointer}.rp-shot,.rp-shot *,a.media-image-link,a.media-image-link *,a[data-full],.proof-image>a,.proof-image>a *{cursor:zoom-in}input:not([type="button"]):not([type="submit"]):not([type="reset"]):not([type="checkbox"]):not([type="radio"]):not([type="range"]),textarea,[contenteditable="true"]{cursor:text}}
@media(max-width:650px){.new-hero h1{font-size:clamp(36px,8.8vw,55px)}.nh-portrait-wrap{margin-bottom:8px}.project-row{padding:24px 0 45px}.project-top{font-size:11px}.project-top span:last-child{font-size:10px}.project-row>.project-name h3{font-size:28px}.personal-signoff{padding:45px 6%;gap:20px;align-items:center}.personal-signoff figure{width:100px}.personal-signoff h2{font-size:clamp(25px,7vw,38px)}.personal-signoff p{font-size:12px}.gallery-meta{font-size:9px}}
@media(prefers-reduced-motion:reduce){.nh-portrait img,.nh-portrait-wrap,.nh-portrait-wrap::before,.nh-portrait-glint,.project-gallery>img{transition:none!important}.nh-portrait-wrap:hover .nh-portrait img{transform:scale(1.035)}}

/* Company image mosaics: keep each original frame visible. */
.project-mosaic,.cv-ghost-inner.is-mosaic{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:3px;background:#202920;padding:3px;overflow:hidden}
.project-mosaic .mosaic-tile,.cv-ghost-inner.is-mosaic .mosaic-tile{position:relative;min-width:0;min-height:0;overflow:hidden;background:#111b15}
.project-mosaic .mosaic-tile img,.cv-ghost-inner.is-mosaic .mosaic-tile img{width:100%;height:100%;object-fit:contain;display:block;transition:transform .6s ease}
.project-mosaic .mosaic-tile span,.cv-ghost-inner.is-mosaic .mosaic-tile span{position:absolute;bottom:6px;left:6px;max-width:calc(100% - 12px);padding:4px 6px;background:#0b100ddd;color:#fff;font:700 9px/1.15 'DM Sans',Arial,sans-serif;letter-spacing:.04em}
.project-mosaic .mosaic-tile:first-child,.cv-ghost-inner.is-mosaic .mosaic-tile:first-child{grid-row:span 2}
.project-row:hover .project-mosaic img,.project-row:focus-visible .project-mosaic img{transform:scale(1.025)}
.mosaic-focus,.mosaic-access{grid-template-columns:1.65fr 1fr;grid-template-rows:1fr}.mosaic-focus .mosaic-tile:first-child,.mosaic-access .mosaic-tile:first-child{grid-row:auto}
.mosaic-focus .mosaic-tile:last-child,.mosaic-access .mosaic-tile:first-child{background:#f5f5f0}
.mosaic-agency{grid-template-columns:repeat(4,minmax(0,1fr))}.mosaic-agency .mosaic-tile:first-child{grid-row:auto}
.mosaic-intertu .mosaic-tile:nth-child(4){grid-column:2 / 4}
.mosaic-perfume{grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:1fr}.mosaic-perfume .mosaic-tile:first-child{grid-row:auto}
@media(max-width:650px){.project-mosaic .mosaic-tile span{font-size:8px;bottom:3px;left:3px;padding:3px 4px}.mosaic-agency{aspect-ratio:4/3}}
@media(prefers-reduced-motion:reduce){.project-mosaic .mosaic-tile img{transition:none}}

/* Sharper, edge-to-edge project photo collections. */
.project-mosaic,.cv-ghost-inner.is-mosaic{grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));gap:3px;padding:3px}
.project-mosaic .mosaic-tile:first-child,.cv-ghost-inner.is-mosaic .mosaic-tile:first-child{grid-row:auto}
.project-mosaic .mosaic-tile img,.cv-ghost-inner.is-mosaic .mosaic-tile img{object-fit:cover}
.project-mosaic .mosaic-tile span,.cv-ghost-inner.is-mosaic .mosaic-tile span{bottom:0;left:0;max-width:100%;padding:5px 7px;background:linear-gradient(90deg,#07100fe8,#07100fb0);font-size:10px;letter-spacing:.02em}
.mosaic-intertu .mosaic-tile:nth-child(4){grid-column:auto}
.mosaic-agency,.cv-ghost-inner.is-mosaic.mosaic-agency{grid-template-columns:repeat(4,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr))}
.mosaic-perfume,.cv-ghost-inner.is-mosaic.mosaic-perfume{grid-template-columns:repeat(5,minmax(0,1fr));grid-template-rows:1fr}
.mosaic-focus,.cv-ghost-inner.is-mosaic.mosaic-focus,.mosaic-access,.cv-ghost-inner.is-mosaic.mosaic-access{grid-template-columns:1fr;grid-template-rows:1fr}
.mosaic-focus .mosaic-tile img{object-position:center 48%}
.mosaic-access .mosaic-tile img,.cv-ghost-inner.is-mosaic.mosaic-access .mosaic-tile img{object-fit:contain;padding:7%;background:#f8f8f3}
@media(max-width:650px){.project-mosaic{aspect-ratio:4/3}.project-mosaic .mosaic-tile span{font-size:8px;padding:3px 4px}.mosaic-perfume{grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr))}.mosaic-perfume .mosaic-tile:first-child{grid-row:span 2}.mosaic-focus,.mosaic-access{grid-template-columns:1fr;grid-template-rows:1fr}}