@import url('https://fonts.googleapis.com/css2?family=Caveat:wght@400;500;600&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Geist:wght@400;450;500;550;600;650;700&family=EB+Garamond:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600;1,700&display=swap');
:root{--paper:#faf9f6;--ink:#282a27;--muted:#70736c;--line:#dedfd6;--accent:#566b36}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;background:var(--paper);color:var(--ink);font-family:'Geist',sans-serif;font-size:16px}a{color:inherit;text-decoration:none}button{font:inherit}a:focus-visible,button:focus-visible{outline:2px solid var(--accent);outline-offset:7px}::selection{background:#d9e5bb}p{line-height:1.7;color:var(--muted)}.nav{height:100px;display:flex;align-items:center;justify-content:space-between;padding:0 6%;position:absolute;width:100%;z-index:5}.wordmark{font-size:29px;letter-spacing:-1.7px;font-weight:650}.wordmark span{font-size:12px;vertical-align:top;display:inline-block;margin:5px}.nav nav{display:flex;align-items:center;gap:36px;font-size:13px}.nav-contact{border:1px solid #aeb5a1;border-radius:30px;padding:12px 21px}.nav-contact span{margin-left:20px}.hero{min-height:820px;position:relative;overflow:hidden;padding:174px 10% 35px}.atmosphere{position:absolute;inset:0;background:radial-gradient(ellipse at var(--x,76%) var(--y,22%),#c1d0a4b0,transparent 51%),radial-gradient(ellipse at 4% 15%,#e8e8d2,transparent 55%),linear-gradient(#eef0e4,#f0f0e5 48%,var(--paper) 95%);pointer-events:none;z-index:-1}.hero-inner{max-width:1200px;margin:auto;position:relative}.eyebrow{font-size:10px;letter-spacing:1.6px;font-weight:600;line-height:1.7}.status-dot{display:inline-block;width:6px;height:6px;background:#728c49;border-radius:50%;margin-right:10px;vertical-align:middle}h1{font-weight:450;font-size:clamp(62px,6.9vw,106px);letter-spacing:-6px;line-height:1.03;margin:32px 0}em{font-family:'EB Garamond',Georgia,serif;font-weight:400}h1 em{color:#64734d}.hero-bottom{display:flex;justify-content:space-between;align-items:center;max-width:700px;margin-top:35px}.hero-bottom p{font-size:16px}.round-link{display:grid;place-items:center;width:55px;height:55px;border:1px solid #b9bda9;border-radius:50%;font-size:23px;transition:transform .2s}.round-link:hover{transform:translateY(5px)}.margin-note{position:absolute;right:0;top:245px;transform:rotate(-8deg);font-family:'EB Garamond',serif;font-style:italic;font-size:24px;line-height:1.3;color:#788168}.hero-foot{display:flex;justify-content:space-between;margin:90px auto 0;max-width:1200px;font-size:9px;letter-spacing:1.5px;color:#7b8072}.section-wrap{max-width:1320px;margin:auto;padding-left:6%;padding-right:6%}.work{padding-top:95px;padding-bottom:100px}.section-heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:48px}h2{font-size:clamp(40px,4.5vw,66px);letter-spacing:-2.8px;line-height:1.08;font-weight:450;margin:20px 0}.section-heading p{font-size:14px;margin-bottom:8px}.project-art{padding:35px;border-radius:6px;overflow:hidden;transition:transform .4s}.featured:hover .project-art{transform:translateY(-5px)}.pencil-art{background:#dbe5b8;color:#2e3a23;min-height:460px}.art-top,.art-bottom{display:flex;align-items:center;justify-content:space-between}.art-top>span:first-child{font-size:25px;font-weight:650;letter-spacing:-1px}.art-top>span:last-child,.art-bottom{font-size:9px;letter-spacing:1.3px}.type-composition{display:flex;flex-direction:column;padding:45px 6% 25px;font-size:clamp(42px,6vw,80px);letter-spacing:-4px;font-weight:550;line-height:1.02}.type-composition span:nth-child(2){margin-left:16%}.type-composition span:nth-child(3){margin-left:32%;font-family:'EB Garamond',serif;font-style:italic;font-weight:400;white-space:nowrap}.art-arrow{font-size:25px}.project-description{display:flex;justify-content:space-between;align-items:center;padding:25px 0 18px}.project-description h3{font-weight:500;font-size:25px;letter-spacing:-.8px;margin:8px 0}.project-description p{font-size:14px;margin:0}.text-link{font-size:12px;border-bottom:1px solid var(--ink);padding-bottom:6px;white-space:nowrap;margin-left:20px}.project-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin-top:48px}.secops-art{background:#dce5e9;color:#324750}.pulse-art{background:#eee0d6;color:#6a493a}.small-composition{font-size:clamp(32px,3.5vw,52px);letter-spacing:-2px;line-height:1.1;margin:60px 0}.coming{font-size:11px;color:#777c70}.more-work{display:flex;gap:25px;flex-wrap:wrap;border-top:1px solid var(--line);margin-top:60px;padding-top:25px;font-size:13px}.more-work .eyebrow{margin-right:auto}.about{border-top:1px solid var(--line);padding-top:85px;padding-bottom:100px}.about-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:80px;margin-top:25px}.about-grid h2{margin-top:0}.about-grid p{font-size:14px}.about-grid .large-copy{font-size:21px;line-height:1.5;color:var(--ink);margin-top:0}.about-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:25px}.about-tags span{border:1px solid var(--line);border-radius:30px;padding:8px 13px;font-size:10px}.contact{padding-top:70px;padding-bottom:70px;background:#edf0e3;border-radius:8px}.contact h2{font-size:clamp(45px,5vw,76px)}.contact-bottom{display:flex;justify-content:space-between;align-items:center}.contact-bottom p{font-size:14px}.contact-note{font-size:12px;color:#69715c;border-bottom:1px solid #b5bda5;padding-bottom:8px}footer{display:flex;align-items:center;justify-content:space-between;padding-top:35px;padding-bottom:35px}footer>span,footer>a:last-child{font-size:10px;color:var(--muted)}.case-nav{position:relative;border-bottom:1px solid var(--line)}.case-hero{padding-top:80px;padding-bottom:55px}.case-hero h1{font-size:clamp(50px,6.5vw,90px);letter-spacing:-4px;max-width:1000px}.case-hero .lede{font-size:20px;max-width:700px}.meta{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;border-top:1px solid var(--line);padding-top:25px;margin-top:45px}.meta dt{font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:1px}.meta dd{font-size:13px;margin:10px 0}.case-layout{display:grid;grid-template-columns:180px 1fr;gap:65px;padding-top:65px;padding-bottom:80px}.contents{position:sticky;top:35px;align-self:start;display:flex;flex-direction:column;gap:17px;font-size:12px;color:var(--muted)}.contents a.active{color:var(--accent);font-weight:700}.story{max-width:780px}.story section{padding-bottom:70px;scroll-margin-top:35px}.story h2{font-size:42px;letter-spacing:-1.5px}.story h3{font-size:20px;font-weight:500}.story p,.story li{font-size:16px;line-height:1.85;color:#61655c}.story li{margin:10px 0}.insight{border-left:2px solid #8b9d65;padding:8px 0 8px 25px;margin:30px 0;font-family:'EB Garamond',serif;font-size:30px;line-height:1.3}.workflow{background:#edf0e3;border-radius:5px;padding:28px;margin:30px 0}.workflow small{font-size:9px;letter-spacing:1.5px}.flow-line{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin-top:20px}.flow-line span{font-size:12px;background:var(--paper);padding:12px 16px;border:1px solid #d2d9c5;border-radius:4px}.flow-line b{font-weight:400;color:#8b9876}.story .note{font-size:12px;color:var(--muted)}.story details{border-top:1px solid var(--line);padding:20px 0}.story summary{cursor:pointer;font-weight:500}.back-work{font-size:14px;border-bottom:1px solid;padding-bottom:5px}@media(min-width:1500px){.hero{min-height:900px}}@media(max-width:900px){.margin-note{display:none}.hero{padding-left:7%;padding-right:7%;min-height:760px}h1{letter-spacing:-4px}.about-grid{gap:35px}.case-layout{grid-template-columns:140px 1fr;gap:25px}}@media(max-width:640px){.nav{height:80px}.nav nav{gap:18px;font-size:11px}.nav nav>a:nth-child(2){display:none}.nav-contact{padding:9px 13px}.hero{padding-top:145px;min-height:710px}h1{font-size:59px;letter-spacing:-3px}.hero .eyebrow{font-size:8px;letter-spacing:1px}.hero-bottom{gap:15px}.hero-bottom p{font-size:14px}.round-link{flex-shrink:0}.hero-foot{margin-top:65px;font-size:7px;gap:20px}.hero-foot span:last-child{display:none}.section-heading{display:block}.section-heading p{margin-top:25px}.work{padding-top:55px}.project-art{padding:23px}.pencil-art{min-height:320px}.type-composition{font-size:40px;letter-spacing:-2px;padding:40px 0}.type-composition span:nth-child(3){margin-left:10%}.project-description{align-items:start;gap:15px}.project-description h3{font-size:23px}.featured .project-description{display:block}.text-link{display:inline-block;margin:20px 0 0}.project-grid,.about-grid{grid-template-columns:1fr}.project-grid{gap:40px}.small-composition{font-size:48px}.more-work{gap:18px}.more-work .eyebrow{width:100%}.about{padding-top:55px;padding-bottom:65px}.contact{border-radius:0}.contact-bottom{display:block}.contact-note{display:inline-block;margin-top:20px}footer{flex-wrap:wrap;gap:20px}footer>span{order:3;width:100%}.case-hero{padding-top:45px}.case-hero h1{font-size:52px;letter-spacing:-2px}.case-hero .lede{font-size:17px}.meta{grid-template-columns:1fr 1fr}.case-layout{display:block;padding-top:35px}.contents{position:relative;top:0;flex-direction:row;overflow:auto;white-space:nowrap;padding-bottom:25px;margin-bottom:25px}.contents .eyebrow{display:none}.story h2{font-size:36px}.story section{padding-bottom:45px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
/* Second direction: a personal, movable workspace. */

:root{--paper:#faf9f5;--accent:#bd4a25}.studio .nav{height:95px;padding:0 5%;}.studio .wordmark{font-weight:700;letter-spacing:-2px;font-size:31px}.brand-period{color:#c2562d!important;font-size:36px!important;margin:0!important;vertical-align:baseline!important}.studio .nav-contact{border-color:#c9c4b9}.studio-hero{isolation:isolate;min-height:920px;height:min(1000px,110vh);padding:0 5%;overflow:hidden}.studio-hero .atmosphere{z-index:-2;background:radial-gradient(ellipse at var(--x,70%) var(--y,24%),#c9d8dcaa,transparent 65%),radial-gradient(ellipse at 15% 65%,#eedbc999,transparent 55%),linear-gradient(#e9ece8,#f4f1e9 65%,var(--paper) 96%)}.desk-grid{position:absolute;inset:0;z-index:-1;background-image:radial-gradient(#8a989b42 .8px,transparent .8px);background-size:22px 22px;mask-image:linear-gradient(#0002,#0009 35%,transparent 92%)}.desk-toolbar{position:absolute;left:5%;right:5%;top:125px;display:flex;justify-content:space-between;align-items:center;font-family:monospace;font-size:10px;letter-spacing:1.5px;color:#626d6e}.desk-toolbar button{background:#ffffff70;border:1px solid #c4cdca;border-radius:5px;padding:10px 13px;font-size:11px;letter-spacing:0;color:#535d5e;cursor:pointer}.desk-toolbar button span{margin-left:15px}.intro-composition{position:relative;z-index:2;text-align:center;max-width:850px;margin:240px auto 0;pointer-events:none}.intro-composition a,.intro-composition button{pointer-events:auto}.hello-note{font-family:'Caveat',cursive;font-size:27px;color:#64655b;transform:rotate(-3deg);margin:0 0 22px}.studio-hero h1{font-size:clamp(52px,5.2vw,81px);line-height:1.12;letter-spacing:-3.8px;margin:0;font-weight:550}.human-line{white-space:nowrap}.human-line button{border:0;background:#c14c28;color:#fff8e9;border-radius:52% 38% 45% 30% / 12% 20% 14% 18%;font-family:'EB Garamond',serif;font-size:1.18em;font-style:italic;letter-spacing:-3px;padding:0 15px 7px;line-height:1;transform:rotate(-4deg);cursor:pointer;transition:transform .2s}.human-line button:hover{transform:rotate(2deg) scale(1.04)}.intro-copy{font-size:14px;line-height:1.8;margin:30px auto 24px;color:#67706c}.desk-work-link{font-size:12px;font-weight:550;border-bottom:1px solid #8f9a93;padding-bottom:8px}.desk-work-link span{margin-left:20px}.desk-item{position:absolute;z-index:3;touch-action:none;cursor:grab;user-select:none;will-change:transform;box-shadow:0 8px 16px #2d3b3510,0 1px 2px #2d3b351c;transform:translate(var(--dx,0px),var(--dy,0px)) rotate(var(--rot,0deg));transition:box-shadow .2s}.desk-item:hover{box-shadow:0 14px 28px #2d3b3520}.desk-item.dragging{cursor:grabbing;z-index:6}.thought-note{--rot:-9deg;left:5%;top:280px;background:#f4e9af;width:188px;min-height:202px;padding:22px 18px}.note-label{font-family:monospace;font-size:8px;letter-spacing:1px;line-height:1.6;display:block}.thought-note p{font-family:'Caveat',cursive;font-size:31px;line-height:1.1;color:#5c5435;margin:23px 0}.thought-note em{font-family:inherit;color:#b45c32;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px}.desk-item small{font-size:9px;color:#79735c}.work-fragment{--rot:9deg;right:3%;top:235px;width:224px;background:#fffefa;padding:10px}.fragment-title{display:flex;justify-content:space-between;font-family:monospace;font-size:8px;padding:5px 0 12px;color:#6d7571}.work-fragment img{width:100%;height:137px;object-fit:cover;pointer-events:none}.fragment-caption{font-family:'Caveat',cursive;font-size:18px;display:block;padding:9px 0 2px}.domains-note{--rot:-5deg;right:7%;top:575px;background:#f9faf7;width:198px;padding:20px;border:1px solid #e3e5db}.domains-note p{font-size:23px;letter-spacing:-.8px;line-height:1.2;margin:17px 0;color:#444e48}.domains-note p span{font-family:'Caveat',cursive;color:#b25b36;font-size:25px}.desk-footer{position:absolute;bottom:45px;left:5%;right:5%;display:flex;justify-content:space-between;align-items:center;color:#92968d}.drag-hint{font-family:'Caveat',cursive;font-size:21px;transform:rotate(-3deg)}.desk-footer>span:last-child{font:9px monospace;letter-spacing:1px}.studio .work{padding-top:45px}.studio .section-heading{margin-bottom:65px}.studio .section-heading h2{font-size:52px;letter-spacing:-2px}.studio .section-heading h2 em{font-family:'Caveat',cursive;color:#b64e2a}.featured-story{margin-bottom:65px}.project-intro{display:grid;grid-template-columns:1.1fr 1fr;gap:70px;margin-bottom:30px}.project-intro h3{font-size:35px;font-weight:500;letter-spacing:-1.3px;line-height:1.2;margin:14px 0}.project-intro-side p{font-size:14px;margin-top:0;max-width:400px}.story-button{font-size:12px;font-weight:600;display:inline-flex;gap:30px;border-bottom:1px solid;padding-bottom:8px}.real-project-preview{position:relative;display:block;background:#ddd;overflow:hidden;border-radius:4px}.real-project-preview img{width:100%;display:block;transition:transform .6s}.real-project-preview:hover img{transform:scale(1.025)}.preview-sticker{position:absolute;right:35px;bottom:25px;background:#f1e4aa;color:#5c4e31;transform:rotate(-6deg);padding:16px 23px;font-family:'Caveat',cursive;font-size:23px;line-height:1.1;box-shadow:0 3px 10px #0002}.project-footnote{display:flex;justify-content:space-between;gap:20px;margin-top:13px;font:8px monospace;letter-spacing:.5px;color:#81867d}.project-footnote a{font:10px 'Geist',sans-serif}.case-product-image{margin:0}.case-product-image img{display:block;width:100%;border-radius:5px}.case-product-image figcaption{font-size:11px;color:var(--muted);margin-top:10px}.studio .contact{background:#f1eee3}.studio .project-grid .project-art{border-radius:2px}.studio .about h2 em{color:#ad512e}.studio-hero.tidy .desk-item{transition:transform .5s;transform:translate(var(--dx,0px),var(--dy,0px)) rotate(0)}
@media(min-width:1450px){.thought-note{left:9%;top:320px}.work-fragment{right:8%;top:250px}.domains-note{right:12%;top:590px}.intro-composition{margin-top:250px}.studio-hero{min-height:950px}}
@media(max-width:1100px){.thought-note{width:150px;left:3%;top:220px;padding:15px}.thought-note p{font-size:26px}.work-fragment{width:170px;right:3%;top:210px}.work-fragment img{height:105px}.fragment-caption{font-size:14px}.domains-note{width:170px;right:5%;top:610px}.intro-composition{margin-top:305px}.studio-hero h1{font-size:61px}.studio-hero{min-height:920px}.desk-footer>span:last-child{display:none}}
@media(max-width:640px){.studio .nav{height:80px}.desk-toolbar{top:105px;font-size:8px;letter-spacing:.5px}.desk-toolbar button{font-size:10px}.studio-hero{min-height:920px;height:auto}.intro-composition{margin-top:300px}.studio-hero h1{font-size:43px;letter-spacing:-2px;line-height:1.2}.human-line button{letter-spacing:-1px;padding:0 9px 5px}.hello-note{font-size:21px;margin-bottom:16px}.intro-copy{font-size:13px;max-width:310px}.thought-note{top:174px;left:8%;width:133px;min-height:105px;padding:12px}.thought-note p{font-size:23px;margin:10px 0}.thought-note .note-label{font-size:6px}.thought-note small{display:none}.work-fragment{top:165px;right:7%;width:139px}.work-fragment img{height:78px}.fragment-title{font-size:6px;padding:2px 0 5px}.fragment-caption{font-size:12px;padding:5px 0 0}.domains-note{top:682px;right:10%;width:165px;padding:14px}.domains-note p{font-size:18px;margin:10px 0}.domains-note .note-label{font-size:6px}.domains-note small{font-size:8px}.desk-footer{bottom:40px;max-width:150px}.drag-hint{font-size:19px;line-height:1.1}.studio .section-heading h2{font-size:40px}.project-intro{grid-template-columns:1fr;gap:15px}.project-intro h3{font-size:30px}.project-intro-side p{font-size:14px}.preview-sticker{right:10px;bottom:10px;font-size:15px;padding:10px}.project-footnote{flex-direction:column;gap:8px}.studio .section-heading{margin-bottom:40px}}

@media(max-width:640px){.intro-composition{margin-top:340px}.studio-hero{min-height:1010px}.domains-note{top:775px}.intro-copy .desktop{display:none}.intro-copy{max-width:300px}.work-fragment{top:165px}.desk-footer{bottom:30px}}
/* Dedicated navigation pages */
.standalone{min-height:100vh;display:flex;flex-direction:column}.standalone .nav{position:relative;flex-shrink:0;border-bottom:1px solid var(--line)}.standalone main{flex:1;width:100%}.standalone footer{width:100%}.standalone .section-wrap{width:100%}.standalone .work,.standalone .about,.standalone .contact{padding-top:85px;padding-bottom:90px;border-top:0}.standalone .contact{background:transparent;border-radius:0}.page-title{font-size:clamp(45px,4.5vw,66px);font-weight:450;letter-spacing:-2.8px;line-height:1.08;margin:20px 0;max-width:none}.standalone .work .page-title{font-size:52px;letter-spacing:-2px}.standalone .work .page-title em{font-family:'Caveat',cursive;color:#b64e2a}.standalone .about .page-title{margin-top:0}.standalone .about .page-title em{color:#ad512e}.standalone .contact .page-title{font-size:clamp(45px,5vw,76px);margin:35px 0}.nav a[aria-current="page"]{color:#ad512e;text-decoration:underline;text-underline-offset:6px}.nav a.nav-contact[aria-current="page"]{text-decoration:none;background:#f2e8df;border-color:#c79577}
@media(max-width:640px){.nav nav>a:nth-child(2){display:inline}.nav nav{gap:12px;font-size:10px}.nav{padding-left:5%;padding-right:5%}.nav-contact{padding:8px 10px}.nav-contact span{margin-left:5px}.standalone .work,.standalone .about,.standalone .contact{padding-top:45px;padding-bottom:60px}.standalone .work .page-title{font-size:40px}.page-title{font-size:40px;letter-spacing:-2px}.studio .nav nav{gap:12px;font-size:10px}.studio .nav-contact{padding:8px 10px}.studio .nav .wordmark{font-size:26px}}
@media(max-width:360px){.nav nav,.studio .nav nav{gap:8px;font-size:9px}.nav-contact span{display:none}.studio .nav .wordmark{font-size:23px}}
/* Home previews link onward to their dedicated pages. */
.home-section-action{display:flex;justify-content:center;padding-top:45px}.home-section-action .story-button{border:1px solid #c8c9be;border-radius:30px;padding:14px 24px;transition:background .2s}.home-section-action .story-button:hover{background:#eeeee5}.home-about-action{margin:26px 0}.home-about-action+.about-tags{margin-top:22px}
/* Sky and drifting clouds, confined to the home hero. */
.studio-hero .atmosphere{background:linear-gradient(180deg,#91cde5 0%,#c4e7ef 45%,#e4f0ed 72%,#faf9f5 100%)!important}
.studio-hero .atmosphere:before,.studio-hero .atmosphere:after{content:"";position:absolute;width:49%;height:260px;left:-14%;top:8%;opacity:.8;filter:blur(9px);background:radial-gradient(ellipse at 25% 62%,#fff 0 19%,transparent 40%),radial-gradient(ellipse at 45% 40%,#fff 0 23%,transparent 43%),radial-gradient(ellipse at 65% 59%,#fff 0 25%,transparent 44%),radial-gradient(ellipse at 46% 72%,#f7fcff 0 30%,transparent 57%);animation:sky-cloud-drift 36s ease-in-out infinite alternate}
.studio-hero .atmosphere:after{left:75%;top:24%;width:43%;animation-duration:44s}
.studio-hero .desk-grid{background-image:none;background:linear-gradient(180deg,transparent 45%,#faf9f560 70%,#faf9f5 100%);mask-image:none}
@keyframes sky-cloud-drift{from{transform:translateX(-18px)}to{transform:translateX(25px)}}
@media(prefers-reduced-motion:reduce){.studio-hero .atmosphere:before,.studio-hero .atmosphere:after{animation:none}}
/* Case studies: serif titles and quotes, sans serif chapter headings. */
.case-hero h1{font-family:'EB Garamond',Georgia,serif;font-weight:400;letter-spacing:-2px}
.story h2,.story h2 em{font-family:'Geist',sans-serif;font-style:normal;font-weight:450}
.story .insight{font-family:'EB Garamond',Georgia,serif}
/* Detailed project rows */
.work-rows{display:flex;flex-direction:column;gap:32px}.work-row{display:grid;grid-template-columns:1.1fr 1fr;gap:40px;padding:30px;background:#f1f2ee;border:1px solid #dedfd6;border-radius:4px}.work-row-copy{display:flex;flex-direction:column;align-items:flex-start;min-width:0;padding:8px 0}.work-row h3{font:500 clamp(28px,2.8vw,40px)/1.15 'Geist',sans-serif;letter-spacing:-1.3px;margin:22px 0 14px}.work-row-copy>p{font-size:16px;line-height:1.6;margin:0 0 22px}.work-row-details{display:flex;flex-direction:column;gap:10px;width:100%;border-top:1px solid #d9dcd3;padding-top:18px;margin-bottom:40px;color:#70736c;font-size:10px;letter-spacing:.7px;line-height:1.6}.work-row-copy>.story-button{margin-top:auto;padding:12px 18px;background:#bd4a25;color:#fff;border:0;transition:background .2s}.work-row-copy>.story-button:hover{background:#9b3d1f}.work-row-copy>.coming{margin-top:auto}.work-row-visual{min-height:420px;position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;padding:30px}.work-row-visual:has(img){padding:0;background:#20221e}.work-row-visual img{width:100%;height:100%;position:absolute;object-fit:cover;object-position:center;transition:transform .6s}.work-row-visual:hover img{transform:scale(1.025)}.work-row-visual .small-composition{font-size:clamp(34px,3.8vw,55px);margin:40px 0}.work-row .preview-sticker{right:20px;bottom:25px;font-size:22px}
@media(max-width:760px){.work-row{grid-template-columns:1fr;padding:22px;gap:24px}.work-row-visual{min-height:300px}.work-row h3{font-size:30px}.work-row-details{margin-bottom:28px}}
/* About: a personal paper note and an editorial profile. */
.about-paper{position:relative;background:#eeece3;padding:55px 13% 60px;text-align:center;isolation:isolate}.about-paper:after{content:"";position:absolute;right:0;top:0;width:46px;height:46px;background:linear-gradient(45deg,#d8d5c8 50%,#faf9f5 50%)}.about-paper h2{font:400 clamp(48px,5.6vw,82px)/1.02 'EB Garamond',serif;letter-spacing:-2px;margin:52px 0}.about-paper h2 em{color:#bd4a25}.paper-bio{max-width:590px;margin:0 auto 32px;text-align:left}.paper-bio p{font-size:16px}.paper-bio strong{font:400 29px 'EB Garamond',serif;color:#282a27}.about-learn{display:inline-block;background:#282a27;color:#faf9f5;border-radius:40px;padding:17px 30px;font:500 15px 'Geist',sans-serif;transition:background .2s,transform .2s}.about-learn:hover{background:#bd4a25;transform:translateY(-2px)}.paper-note{position:absolute;top:40%;padding:25px 20px;background:#f4e9af;box-shadow:0 7px 20px #282a2717;font:25px/1.15 'Caveat',cursive;text-align:left;max-width:180px}.note-left{left:-24px;transform:rotate(-8deg)}.note-right{right:-24px;top:61%;transform:rotate(7deg);background:#dce8e8}.about-profile{padding-top:55px;padding-bottom:90px}.profile-top{display:flex;align-items:center;justify-content:space-between;color:#70736c}.profile-smile{display:grid;place-items:center;border-radius:50%;background:#eeece3;width:48px;height:48px;font-size:25px}.profile-heading{margin:55px 0}.profile-heading>span{font:400 42px 'EB Garamond',serif;color:#92978b}.profile-heading h1{font:400 clamp(42px,4.4vw,65px)/1.05 'EB Garamond',serif;letter-spacing:-1.7px;margin:8px 0;max-width:780px}.profile-layout{display:grid;grid-template-columns:minmax(0,2fr) minmax(230px,1fr);gap:75px}.profile-story{max-width:700px}.profile-story p{font-size:17px;line-height:1.8;margin:0 0 28px}.profile-story .profile-lede{font-size:22px;color:#282a27}.profile-story h2{font:500 28px 'Geist',sans-serif;letter-spacing:-.8px;margin:45px 0 20px}.profile-collage{position:relative;min-height:450px}.profile-collage>p{font:24px 'Caveat',cursive;transform:rotate(-6deg);margin:0 0 35px}.profile-card{position:absolute;top:85px;width:230px;height:300px;padding:25px;display:flex;flex-direction:column;justify-content:space-between;box-shadow:0 8px 20px #282a2720}.profile-card span,.profile-card small{font:10px/1.6 'Geist',sans-serif}.profile-card strong{font:38px/1.05 'EB Garamond',serif;font-weight:400}.card-back{background:#c9dfe4;transform:rotate(9deg);left:30px}.card-front{background:#f4e9af;transform:rotate(-6deg);top:115px;left:0}.card-front strong{font-family:'Caveat',cursive}.profile-collage:hover .card-front{transform:rotate(-9deg) translate(-10px,4px)}.profile-card{transition:transform .3s}
@media(max-width:760px){.about-paper{padding:35px 24px}.about-paper h2{font-size:48px;margin:40px 0}.paper-note{display:none}.profile-layout{grid-template-columns:1fr;gap:35px}.profile-heading{margin:40px 0}.profile-collage{width:280px;min-height:440px;margin:auto}.profile-story p{font-size:16px}.profile-top .eyebrow{font-size:8px}.profile-heading h1{font-size:43px}}

.journey{display:grid;grid-template-columns:1fr 1.3fr;gap:90px;padding-top:70px;padding-bottom:100px;border-top:1px solid #dedfd6}.journey-intro h2{font:400 clamp(40px,4vw,62px)/1.08 'EB Garamond',serif;letter-spacing:-1px}.journey-intro h2 em{color:#bd4a25}.journey-intro p{max-width:330px}.journey-note{margin:45px 0;padding:28px;background:#f4e9af;transform:rotate(-5deg);max-width:260px;font:30px/1.15 'Caveat',cursive}.journey-list{list-style:none;padding:0 0 0 28px;margin:0;border-left:1px solid #d4c7b9}.journey-list li{position:relative;padding-bottom:40px}.journey-list li:before{content:'';position:absolute;width:9px;height:9px;border-radius:50%;background:#bd4a25;left:-33px;top:8px}.journey-date{color:#bd4a25;font-size:13px;font-weight:600}.journey-list h3{font:500 22px/1.3 'Geist',sans-serif;margin:10px 0}.journey-list p{font-size:16px;margin:0;line-height:1.75}.journey-list li:last-child{padding-bottom:0}@media(max-width:760px){.journey{grid-template-columns:1fr;gap:40px;padding-top:45px;padding-bottom:60px}.journey-note{margin:28px 0}.journey-list{margin-left:5px}}
/* Reversible story experiment, November 2. */
.origin-desk-link{font:12px 'Geist',sans-serif;text-decoration:underline}.story-lab{padding-top:70px;padding-bottom:80px}.story-lab h2{font:400 clamp(38px,4vw,60px)/1.1 'EB Garamond',serif;letter-spacing:-1px}.story-lab h2 em{color:#bd4a25}.story-lab-intro{max-width:620px}.origin-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:48px;margin:48px 0 70px;align-items:center}.origin-card{background:#dce8e8;padding:40px}.story-lab h3{font:500 28px/1.2 'Geist',sans-serif;letter-spacing:-.8px}.origin-card p{margin-bottom:28px}.recharge-receipt{padding:30px;background:#f4eedc;transform:rotate(3deg);box-shadow:0 8px 22px #282a2710;border-bottom:5px dotted #faf9f5}.recharge-receipt>span,.scrapbook-grid article>span{font:10px 'Geist',sans-serif;letter-spacing:1px}.recharge-receipt h3{font:400 30px/1.1 'EB Garamond',serif}.recharge-receipt hr{border:0;border-top:1px dashed #b9b09e}.recharge-receipt small{color:#70736c}.scrapbook-heading{display:flex;justify-content:space-between;align-items:center;gap:24px}.hand-note{font:26px 'Caveat',cursive;color:#bd4a25}.scrapbook-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin:24px 0 65px}.scrapbook-grid article{padding:26px 22px;background:#eeece3}.scrapbook-grid article:nth-child(even){background:#ede2d7}.scrapbook-grid h4{font:400 30px/1.1 'EB Garamond',serif;margin:24px 0 16px}.scrapbook-grid p{font-size:14px}.still-exploring{border-top:1px solid #dedfd6;padding-top:36px;max-width:700px}.still-exploring p{margin-bottom:28px}@media(max-width:760px){.origin-grid{grid-template-columns:1fr;gap:30px}.origin-card{padding:28px}.recharge-receipt{transform:rotate(1deg);margin:0 8px}.scrapbook-grid{grid-template-columns:1fr 1fr}.scrapbook-heading{display:block}}@media(max-width:420px){.scrapbook-grid{grid-template-columns:1fr}}
/* A clearer introduction, with the sky as the only hero decoration. */
.studio-hero.clear-hero{height:auto;min-height:780px;padding:190px 6% 130px;display:flex;align-items:center;justify-content:center}.clear-intro{max-width:900px;text-align:center;position:relative;z-index:1}.clear-intro .hello-note{font-size:30px;margin:0 0 24px;transform:none;color:#454d47}.studio-hero.clear-hero h1{font:500 clamp(52px,5.4vw,84px)/1.06 'Geist',sans-serif;letter-spacing:-3px;margin:0}.clear-hero h1 em{font-family:'EB Garamond',serif;color:#bd4a25;font-weight:400}.clear-description{max-width:650px;margin:30px auto 16px;font-size:18px;line-height:1.7;color:#444e48}.clear-personal{max-width:590px;margin:0 auto;color:#626b65;font-size:15px;line-height:1.7}.clear-actions{display:flex;justify-content:center;align-items:center;gap:30px;margin-top:35px}.clear-about{font-size:14px;border-bottom:1px solid #8f9a93;padding:8px 0}.nav a.nav-contact{transition:background .2s,color .2s,border-color .2s}.nav a.nav-contact:hover,.nav a.nav-contact:focus-visible{background:#bd4a25;color:#fff;border-color:#bd4a25}.about-paper h2{font-size:clamp(42px,4.8vw,68px)}@media(max-width:760px){.studio-hero.clear-hero{min-height:700px;padding:145px 24px 90px}.studio-hero.clear-hero h1{font-size:49px;letter-spacing:-2px}.clear-description{font-size:16px}.clear-personal{font-size:14px}.clear-actions{gap:22px;flex-wrap:wrap}.clear-intro .hello-note{font-size:26px}}
.theme-toggle{border:1px solid #8d9b9560;background:transparent;color:inherit;border-radius:30px;padding:10px 14px;cursor:pointer;font:12px 'Geist',sans-serif}.theme-toggle:focus-visible{outline:2px solid #bd4a25;outline-offset:4px}.studio-hero .atmosphere:before,.studio-hero .atmosphere:after{display:none}.sky-cloud{position:absolute;width:400px;height:150px;left:-420px;top:15%;filter:blur(3px);opacity:.88;animation:cloud-cross 110s linear infinite;animation-delay:-30s}.sky-cloud i{position:absolute;background:linear-gradient(#fff 40%,#e2eef5);border-radius:50%}.sky-cloud i:nth-child(1){width:70%;height:54%;left:12%;bottom:0}.sky-cloud i:nth-child(2){width:34%;height:80%;left:20%;bottom:20%}.sky-cloud i:nth-child(3){width:42%;height:100%;left:40%;bottom:12%}.sky-cloud i:nth-child(4){width:30%;height:62%;left:65%;bottom:4%}.sky-cloud i:nth-child(5){width:28%;height:50%;left:0;bottom:2%}.sky-cloud.cloud-1{top:37%;width:320px;height:110px;animation-duration:145s;animation-delay:-100s;opacity:.65}.sky-cloud.cloud-2{top:4%;width:260px;height:95px;animation-duration:180s;animation-delay:-65s;opacity:.55}@keyframes cloud-cross{from{transform:translateX(0)}to{transform:translateX(calc(100vw + 850px))}}.sky-stars{position:absolute;inset:0;opacity:0}.sky-stars i{position:absolute;width:2px;height:2px;border-radius:50%;background:#fff;box-shadow:0 0 4px #e5e5e5}.sky-stars i:nth-child(7n){width:3px;height:3px}html[data-theme=dark]{--paper:#080808;--ink:#f1eee6;--muted:#bcbab5;--line:#333333;--accent:#f1a07d;color-scheme:dark}html[data-theme=dark] body{background:#080808;color:#f1eee6}html[data-theme=dark] .studio-hero .atmosphere{background:linear-gradient(180deg,#081329 0%,#10233e 45%,#0b1524 72%,#080808 100%)!important}html[data-theme=dark] .studio-hero .desk-grid{background:linear-gradient(transparent 45%,#08080860 70%,#080808 100%)}html[data-theme=dark] .sky-stars{opacity:1}html[data-theme=dark] .sky-cloud{opacity:.14}html[data-theme=dark] .sky-cloud i{background:linear-gradient(#b8b8b8,#555555)}html[data-theme=dark] .clear-intro .hello-note,html[data-theme=dark] .clear-description,html[data-theme=dark] .profile-lede,html[data-theme=dark] .paper-bio strong{color:#e7e5df}html[data-theme=dark] .clear-personal,html[data-theme=dark] p{color:#bcbab5}html[data-theme=dark] .clear-hero h1 em,html[data-theme=dark] .about-paper h2 em{color:#f1a07d}html[data-theme=dark] .work-row,html[data-theme=dark] .about-paper,html[data-theme=dark] .contact,html[data-theme=dark] .workflow,html[data-theme=dark] .profile-smile{background:#161616;border-color:#333333}html[data-theme=dark] .about-learn{background:#e9e5dc;color:#18212c}html[data-theme=dark] .about-learn:hover{background:#f1a07d}html[data-theme=dark] .about-paper:after{background:linear-gradient(45deg,#333333 50%,#080808 50%)}html[data-theme=dark] .work-row-details{border-color:#333333;color:#bcbab5}html[data-theme=dark] .paper-note,html[data-theme=dark] .profile-card,html[data-theme=dark] .journey-note{color:#282a27}html[data-theme=dark] .flow-line span{background:#202020;border-color:#454545}html[data-theme=dark] .nav a.nav-contact:hover{color:#fff} @media(max-width:640px){.nav nav{gap:10px}.theme-toggle{padding:8px;font-size:11px}}@media(prefers-reduced-motion:reduce){.sky-cloud{animation:none;left:5%}.sky-cloud.cloud-1{left:72%}.sky-cloud.cloud-2{left:45%}}
html[data-theme=dark] .story li,html[data-theme=dark] .coming,html[data-theme=dark] .contact-note,html[data-theme=dark] .profile-top{color:#bcbab5}html[data-theme=dark] h1 em,html[data-theme=dark] .journey-date,html[data-theme=dark] .journey-intro h2 em{color:#f1a07d}html[data-theme=dark] .preview-sticker{color:#282a27}html[data-theme=dark] ::selection{background:#494949;color:#fff}.sky-stars{mask-image:linear-gradient(#000 50%,transparent 85%)}
/* Portrait, recommendations, and writing imported from Shylesh’s existing site. */
.personal-portrait{margin:0;padding:9px 9px 18px;background:#fff;box-shadow:0 10px 30px #18212c20;transform:rotate(-5deg);color:#282a27}.personal-portrait img{display:block;width:100%;height:auto;aspect-ratio:3/4;object-fit:cover}.personal-portrait figcaption{font:20px 'Caveat',cursive;margin-top:12px;text-align:center}.about-paper>.personal-portrait{position:absolute;width:185px;left:-40px;top:35%}.profile-photo{padding-top:25px}.profile-photo .personal-portrait{max-width:310px;margin:0 auto;transform:rotate(4deg)}.testimonials,.writing{padding-top:70px;padding-bottom:90px}.testimonial-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.testimonial{margin:0;background:#eeece3;padding:30px;display:flex;flex-direction:column;justify-content:space-between;gap:30px;border-radius:5px}.testimonial blockquote{margin:0;font:25px/1.35 'EB Garamond',serif}.testimonial figcaption{display:flex;flex-direction:column;gap:6px;font-size:13px;line-height:1.5}.testimonial figcaption span{color:var(--muted);font-size:12px}.blog-entry{display:grid;grid-template-columns:180px 1fr 30px;gap:28px;align-items:start;border-top:1px solid var(--line);padding:30px 0;transition:color .2s}.blog-entry:last-child{border-bottom:1px solid var(--line)}.blog-entry h3{font:500 28px/1.25 'Geist',sans-serif;letter-spacing:-.7px;margin:0 0 12px}.blog-entry p{margin:0;font-size:15px;max-width:680px}.blog-entry>.eyebrow{color:var(--muted);padding-top:6px}.blog-arrow{font-size:25px;transition:transform .2s}.blog-entry:hover h3{color:#bd4a25}.blog-entry:hover .blog-arrow{transform:translate(3px,-3px)}.writing-page{padding-top:60px}.writing-intro{max-width:600px;margin-bottom:50px}html[data-theme=dark] .testimonial:not(.memo-note){background:#161616}html[data-theme=dark] .blog-entry:hover h3{color:#f1a07d}
@media(max-width:1000px){.testimonial-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.about-paper>.personal-portrait{width:140px;left:-12px}.blog-entry{grid-template-columns:140px 1fr 24px;gap:20px}}
@media(max-width:760px){.about-paper>.personal-portrait{position:static;width:180px;margin:0 auto 35px}.profile-photo{grid-row:1;padding:0 20px 25px}.profile-photo .personal-portrait{max-width:260px}.testimonial-grid{grid-template-columns:1fr}.testimonial{padding:26px}.testimonials,.writing{padding-top:45px;padding-bottom:60px}.blog-entry{grid-template-columns:1fr 24px;gap:12px}.blog-entry>.eyebrow{grid-column:1/-1}.blog-entry h3{font-size:24px}.nav nav{gap:14px}}
@media(max-width:420px){.nav{padding-left:5%;padding-right:5%}.nav nav{gap:10px}.nav-contact span{display:none}.nav-contact{padding:8px}.wordmark{font-size:24px}}
/* Article thumbnails and publication metadata. */
.blog-entry{grid-template-columns:240px minmax(0,1fr) 24px;align-items:center;gap:32px;padding:32px 0}.blog-thumbnail{display:block;width:100%;height:auto;aspect-ratio:5/3;object-fit:cover;border-radius:5px;background:#eeece3}.blog-copy{min-width:0}.blog-meta{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin-top:20px;font-size:12px;line-height:1.5;color:var(--muted)}.blog-tag,.blog-read-time{border:1px solid var(--line);border-radius:20px;padding:4px 10px}.blog-meta time{margin-left:4px}.blog-read-time{border-color:transparent;background:#eeece3}.blog-arrow{align-self:start;margin-top:5px}html[data-theme=dark] .blog-read-time{background:#161616}html[data-theme=dark] .blog-thumbnail{background:#161616}@media(max-width:900px){.blog-entry{grid-template-columns:180px minmax(0,1fr) 20px;gap:22px}.blog-entry h3{font-size:25px}}@media(max-width:600px){.blog-entry{grid-template-columns:minmax(0,1fr) 20px;gap:20px;padding:28px 0}.blog-thumbnail{grid-column:1/-1;aspect-ratio:5/3}.blog-copy{grid-column:1}.blog-meta{gap:8px;margin-top:18px}.blog-entry h3{font-size:24px}.blog-meta time{margin-left:0}}
/* Timeline stickers and navigation feedback. */
.about-profile>.profile-heading{margin-top:10px}.journey-intro{position:sticky;top:40px;align-self:start}.journey-intro>.eyebrow{text-transform:uppercase}.journey-list{padding-left:45px;margin-left:24px}.journey-list li{padding-bottom:48px}.journey-list li:before{display:none}.journey-sticker{position:absolute;left:-72px;top:-8px;width:54px;height:54px;display:grid;place-items:center;background:#fffdf6;border:3px solid #fff;border-radius:16px;box-shadow:0 2px 0 #34363125,0 4px 10px #18212c18;transform:rotate(-8deg)}.journey-sticker svg{width:44px;height:44px}.journey-list li:nth-child(even) .journey-sticker{transform:rotate(8deg)}.journey-list li:nth-child(3n) .journey-sticker{border-radius:50%}.nav nav>a:not(.nav-contact){position:relative;transition:color .2s,transform .2s;text-decoration:none}.nav nav>a:not(.nav-contact):after{content:'';position:absolute;left:0;right:0;bottom:-7px;height:2px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .2s}.nav nav>a:not(.nav-contact):hover,.nav nav>a:not(.nav-contact):focus-visible{color:#bd4a25;transform:translateY(-2px)}.nav nav>a:not(.nav-contact):hover:after,.nav nav>a:not(.nav-contact):focus-visible:after{transform:scaleX(1)}.theme-toggle{transition:background .2s,color .2s,border-color .2s}.theme-toggle:hover{background:#282a27;color:#fff;border-color:#282a27}html[data-theme=dark] .nav nav>a:not(.nav-contact):hover,html[data-theme=dark] .nav nav>a:not(.nav-contact):focus-visible{color:#f1a07d}html[data-theme=dark] .theme-toggle:hover{background:#f1eee6;color:#080808;border-color:#f1eee6}@media(max-width:760px),(max-height:640px){.journey-intro{position:static}}@media(max-width:760px){.journey-list{margin-left:24px;padding-left:40px}.journey-sticker{left:-65px;width:48px;height:48px;border-radius:14px}.journey-sticker svg{width:39px;height:39px}}@media(prefers-reduced-motion:reduce){.nav nav>a,.nav nav>a:after,.theme-toggle{transition:none!important}.nav nav>a:not(.nav-contact):hover{transform:none}}
/* Now: a small, personal snapshot. */
.now-page{padding-top:65px;padding-bottom:110px}.now-page .page-title{margin-bottom:65px}.now-list{border-top:1px solid var(--line)}.now-entry{display:grid;grid-template-columns:60px minmax(0,1fr) auto;align-items:center;gap:25px;padding:42px 0;border-bottom:1px solid var(--line)}.now-marker{font:italic 30px 'EB Garamond',serif;color:#bd4a25}.now-entry .eyebrow{color:var(--muted)}.now-entry h2{font:500 clamp(25px,3vw,38px)/1.2 'Geist',sans-serif;letter-spacing:-1px;margin:14px 0 0}.now-and{font-family:'EB Garamond',serif;font-style:italic;font-weight:400;color:#bd4a25}.now-note{font:24px 'Caveat',cursive;color:var(--muted);transform:rotate(-3deg)}html[data-theme=dark] .now-marker,html[data-theme=dark] .now-and{color:#f1a07d}@media(max-width:760px){.now-page{padding-top:40px;padding-bottom:70px}.now-page .page-title{margin-bottom:40px}.now-entry{grid-template-columns:35px minmax(0,1fr);gap:16px;padding:30px 0}.now-note{grid-column:2;transform:none;font-size:22px}.nav nav{gap:12px}}@media(max-width:480px){.nav{height:auto;min-height:90px;flex-wrap:wrap;gap:14px;padding-top:18px;padding-bottom:18px}.nav nav{width:100%;justify-content:space-between;gap:8px}.nav nav>a:nth-child(2){display:inline-block}.nav nav{font-size:10px}.nav-contact{padding:8px}.theme-toggle{font-size:10px;padding:8px}.studio-hero.clear-hero{padding-top:175px}}

/* Keep page width and navigation stable on short and long pages. */
html{scrollbar-gutter:stable}@supports not (scrollbar-gutter:stable){html{overflow-y:scroll}}.theme-toggle{min-width:72px;flex-shrink:0}@media(max-width:640px){.theme-toggle{min-width:60px}}

.now-icon{display:grid;place-items:center;width:52px;height:52px;background:#fffdf6;border:3px solid #fff;border-radius:15px;box-shadow:0 3px 9px #00000018;transform:rotate(-5deg)}.now-icon svg{width:40px;height:40px}.now-entry:nth-child(2) .now-icon{transform:rotate(5deg)}@media(max-width:760px){.now-entry{grid-template-columns:48px minmax(0,1fr)}.now-icon{width:44px;height:44px;border-radius:12px}.now-icon svg{width:34px;height:34px}}
/* Collapsible navigation below the tablet layout. */
.menu-toggle{display:none}
@media(max-width:760px){
 .nav,.studio .nav{height:80px;min-height:80px;flex-wrap:nowrap;padding:0 6%;gap:16px;overflow:visible}
 .menu-toggle{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;width:44px;height:44px;padding:10px;border:1px solid var(--line);border-radius:50%;background:transparent;color:inherit;cursor:pointer;flex-shrink:0}
 .menu-toggle span{display:block;width:20px;height:2px;background:currentColor;transition:transform .2s,opacity .2s}
 .menu-open .menu-toggle span:nth-child(1){transform:translateY(7px) rotate(45deg)}
 .menu-open .menu-toggle span:nth-child(2){opacity:0}
 .menu-open .menu-toggle span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
 .nav nav,.studio .nav nav{display:none;position:absolute;top:calc(100% - 1px);left:0;right:0;width:100%;padding:20px 6% 28px;background:var(--paper);border-bottom:1px solid var(--line);box-shadow:0 12px 20px #00000012;flex-direction:column;align-items:stretch;gap:8px;font-size:16px}
 .nav.menu-open nav{display:flex}
 .nav nav>a,.nav nav>a:nth-child(2){display:block;padding:12px 0;min-height:44px}
 .nav nav>a:not(.nav-contact):after{bottom:5px;right:auto;width:30px}
 .studio .nav nav .nav-contact{padding:12px 18px;margin-top:6px;text-align:center;font-size:15px}
 .nav nav .theme-toggle{min-height:44px;margin-top:4px;font-size:14px}
 .studio-hero.clear-hero{padding-top:145px}
}
@media(prefers-reduced-motion:reduce){.menu-toggle span{transition:none}}
/* A miniature sky, with a sun-to-moon slider. */
.nav nav .theme-toggle{position:relative;width:82px;min-width:82px;height:44px;min-height:44px;padding:4px;border:0;background:transparent!important;border-radius:30px;color:inherit;flex-shrink:0;align-self:center;box-shadow:none;isolation:isolate}
.toggle-scene{position:absolute;inset:5px 0;display:block;overflow:hidden;border-radius:30px;background:#91cde0;box-shadow:inset 0 2px 4px #253e4938,0 1px 0 #ffffff80;transition:background .5s}
.toggle-orb{position:absolute;left:4px;top:3px;width:28px;height:28px;border-radius:50%;background:#f3cd70;box-shadow:inset 0 1px 2px #fff5c9,0 2px 3px #73522640,0 0 0 9px #ffffff1a,0 0 0 18px #ffffff12,0 0 0 27px #ffffff0c;transition:transform .55s cubic-bezier(.22,1,.36,1),background .45s;z-index:2}
.toggle-clouds{position:absolute;width:57px;height:18px;right:-7px;bottom:-7px;border-radius:50%;background:#faf9f5;box-shadow:-9px -3px 0 #faf9f5,11px -6px 0 #faf9f5;transition:transform .5s,opacity .4s}
.toggle-clouds:before,.toggle-clouds:after{content:'';position:absolute;border-radius:50%;background:#faf9f5}.toggle-clouds:before{width:22px;height:22px;left:14px;top:-15px}.toggle-clouds:after{width:18px;height:18px;right:1px;top:-10px}
.toggle-stars{position:absolute;left:13px;top:5px;font:13px Georgia,serif;color:#f3eee1;opacity:0;transform:translateY(-20px);transition:opacity .4s,transform .55s}.toggle-stars i{position:absolute;left:18px;top:11px;font-size:9px;font-style:normal}.toggle-stars b{position:absolute;left:25px;top:-3px;font-size:16px}
.toggle-orb i{position:absolute;border-radius:50%;background:#aaa99f;box-shadow:inset 1px 1px 2px #77786c50;opacity:0;transition:opacity .4s}.toggle-orb i:nth-child(1){width:9px;height:9px;left:5px;top:10px}.toggle-orb i:nth-child(2){width:5px;height:5px;left:15px;top:5px}.toggle-orb i:nth-child(3){width:5px;height:5px;left:17px;top:18px}
html[data-theme=dark] .toggle-scene{background:#161616;box-shadow:inset 0 2px 5px #000,0 0 0 1px #ffffff22}html[data-theme=dark] .toggle-orb{transform:translateX(46px);background:#e8e5d9}html[data-theme=dark] .toggle-orb i{opacity:1}html[data-theme=dark] .toggle-clouds{transform:translateY(35px);opacity:0}html[data-theme=dark] .toggle-stars{opacity:1;transform:translateY(0)}
.theme-toggle:hover .toggle-scene{outline:1px solid #bd4a2570}.theme-toggle:focus-visible{outline:2px solid #bd4a25;outline-offset:4px}@media(prefers-reduced-motion:reduce){.toggle-scene,.toggle-orb,.toggle-orb i,.toggle-stars,.toggle-clouds{transition:none}}
/* Scroll-aware navigation; preserve the original header space on inner pages. */
.nav.nav-floating,.standalone .nav.nav-floating{position:fixed;top:0;left:0;transform:translateY(-110%);background:color-mix(in srgb,var(--paper) 78%,transparent);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-bottom:1px solid var(--line);box-shadow:0 4px 20px #00000008;transition:transform .25s ease;z-index:20}
.nav.nav-floating.nav-revealed{transform:translateY(0)}
.nav-placeholder{flex-shrink:0}
.back-top{position:fixed;right:26px;bottom:26px;width:46px;height:46px;display:grid;place-items:center;border:1px solid var(--line);border-radius:50%;background:var(--ink);color:var(--paper);box-shadow:0 4px 18px #00000020;z-index:19;cursor:pointer;opacity:0;visibility:hidden;transform:translateY(12px);transition:opacity .2s,transform .2s,visibility .2s}.back-top.is-visible{opacity:1;visibility:visible;transform:translateY(0)}.back-top:hover{transform:translateY(-3px)}.back-top svg{width:21px;height:21px}@media(max-width:760px){.back-top{right:18px;bottom:18px}.nav.nav-floating nav{max-height:calc(100dvh - 80px);overflow-y:auto}}@media(prefers-reduced-motion:reduce){.nav.nav-floating,.back-top{transition:none}html{scroll-behavior:auto}}
/* Soft glass with a feathered lower edge. */
.nav.nav-floating,.standalone .nav.nav-floating{background:transparent;border-bottom-color:transparent;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;isolation:isolate}
.nav.nav-floating:before{content:'';position:absolute;inset:0 0 -80px;z-index:-1;pointer-events:none;background:linear-gradient(to bottom,rgba(250,249,245,calc(.86 * var(--nav-tint,1))) 0%,rgba(250,249,245,calc(.68 * var(--nav-tint,1))) 62%,rgba(250,249,245,calc(.42 * var(--nav-tint,1))) 82%,transparent 100%);filter:blur(16px);backdrop-filter:blur(32px);-webkit-backdrop-filter:blur(32px);mask-image:linear-gradient(#000 0%,#000 65%,transparent 100%);-webkit-mask-image:linear-gradient(#000 0%,#000 65%,transparent 100%)}
html[data-theme=dark] .nav.nav-floating:before{background:linear-gradient(to bottom,rgba(8,8,8,calc(.86 * var(--nav-tint,1))) 0%,rgba(8,8,8,calc(.68 * var(--nav-tint,1))) 62%,rgba(8,8,8,calc(.42 * var(--nav-tint,1))) 82%,transparent 100%)}
@media(prefers-reduced-transparency:reduce){.nav.nav-floating:before{background:var(--paper);filter:none;backdrop-filter:none;-webkit-backdrop-filter:none;mask-image:none;-webkit-mask-image:none;bottom:0}}

/* Move the full glass fade offscreen along with the hidden navigation. */
.nav.nav-floating,.standalone .nav.nav-floating{transform:translateY(calc(-100% - 130px))}.nav.nav-floating.nav-revealed,.standalone .nav.nav-floating.nav-revealed{transform:translateY(0)}

.contact-details{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:30px;border-top:1px solid var(--line);margin-top:55px;padding-top:35px}.contact-details>div{display:flex;flex-direction:column;gap:15px;min-width:0}.contact-details a{font-size:clamp(16px,1.6vw,22px);overflow-wrap:anywhere}.contact-socials{margin-top:55px}.contact-socials>div{display:flex;flex-wrap:wrap;gap:18px 30px;margin-top:20px}.contact-socials a,.contact-more{font-size:14px;border-bottom:1px solid var(--line);padding-bottom:6px}.contact-more{display:inline-block;margin-top:24px}.contact-details a:hover,.contact-socials a:hover,.contact-more:hover{color:#bd4a25}html[data-theme=dark] .contact-details a:hover,html[data-theme=dark] .contact-socials a:hover,html[data-theme=dark] .contact-more:hover{color:#f1a07d}@media(max-width:760px){.contact-details{grid-template-columns:1fr;gap:30px;margin-top:35px}.contact-socials{margin-top:40px}}
/* Selected work: warm editorial cards, matching the portfolio’s paper and ink. */
.work-rows{gap:36px}.work-row{grid-template-columns:1fr 1.05fr;gap:40px;padding:38px;background:#eeece3;border:0;border-radius:18px;align-items:stretch}.work-row-copy{padding:8px 0;justify-content:flex-start}.work-row-copy>.eyebrow{color:var(--muted);font-size:9px;letter-spacing:1.3px}.work-row h3{font-size:clamp(28px,2.6vw,38px);font-weight:500;line-height:1.15;margin:24px 0 20px;letter-spacing:-1.2px}.work-row-copy>p{font-size:15px;line-height:1.8;max-width:440px;margin-bottom:26px}.work-row-details{border-top:1px solid #d7d4c9;gap:8px;padding-top:20px;margin-bottom:32px;font-size:10px;letter-spacing:.4px}.work-row-copy>.story-button{display:inline-flex;align-items:center;gap:25px;background:#282a27;color:#faf9f5;padding:14px 22px;border-radius:30px;font-size:13px;line-height:1.4;font-weight:500;transition:background .2s,transform .2s}.work-row-copy>.story-button:hover{background:#bd4a25;transform:translateY(-2px)}.work-row-copy>.coming{font:22px 'Caveat',cursive;color:#7b776d;padding-top:10px}.work-row-visual{min-height:400px;border-radius:10px;padding:28px}.work-row-visual img{object-fit:cover}.work-row .preview-sticker{font-size:21px;padding:15px 18px;right:16px;bottom:20px;box-shadow:0 4px 12px #00000016}.work-row-visual.secops-art{background:#dce5e2;color:#324741}.work-row-visual.pulse-art{background:#e8dbd0;color:#674b3c}.work-row-visual .small-composition{font-size:clamp(34px,3.4vw,49px);letter-spacing:-1.5px}.work-row-visual .art-top>span:first-child{font-size:22px}.work-row-visual>.eyebrow{font-size:8px;line-height:1.8}html[data-theme=dark] .work-row{background:#161615}html[data-theme=dark] .work-row-copy>.story-button{background:#e9e5dc;color:#282a27}html[data-theme=dark] .work-row-copy>.story-button:hover{background:#f1a07d}html[data-theme=dark] .work-row-copy>.coming{color:#bcbab5}html[data-theme=dark] .work-row-details{border-color:#343430}
@media(max-width:900px){.work-row{gap:28px;padding:28px}.work-row-visual{min-height:380px}}@media(max-width:760px){.work-row{grid-template-columns:1fr;padding:24px;gap:30px;border-radius:14px}.work-row-visual{grid-row:1;min-height:300px}.work-row-copy{padding:0}.work-row h3{font-size:30px;margin-top:18px}.work-row-details{margin-bottom:25px}.work-row-visual .small-composition{font-size:40px}}@media(prefers-reduced-motion:reduce){.work-row-copy>.story-button{transition:none}.work-row-copy>.story-button:hover{transform:none}}
.work-row-link{transition:box-shadow .25s,transform .25s;cursor:pointer}.work-row-link:hover{box-shadow:0 8px 28px #282a2710;transform:translateY(-3px)}.work-row-link:hover .story-button{background:#bd4a25;color:#fff}.work-row-link:hover .work-row-visual img{transform:scale(1.025)}.work-row-link:focus-visible{outline:2px solid var(--accent);outline-offset:6px}html[data-theme=dark] .work-row-link:hover .story-button{background:#f1a07d;color:#282a27}@media(prefers-reduced-motion:reduce){.work-row-link{transition:none}.work-row-link:hover{transform:none}.work-row-link:hover .work-row-visual img{transform:none}}
/* Case-study reading progress, above the navigation and glass. */
.reading-progress{position:fixed;top:0;left:0;right:0;height:3px;background:transparent;z-index:40;pointer-events:none}.reading-progress>span{display:block;width:100%;height:100%;background:var(--accent);transform:scaleX(0);transform-origin:left;will-change:transform}
.impact-metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin:30px 0 40px}.impact-metric{padding:26px;background:#eeece3;border-radius:12px;display:flex;flex-direction:column;gap:12px}.impact-metric strong{font:500 46px/1.1 'Geist',sans-serif;letter-spacing:-2px;color:#bd4a25}.impact-metric span{font-size:14px;line-height:1.5}.impact-outcomes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 32px;margin-bottom:40px}.impact-outcomes>div{border-top:1px solid var(--line);padding-top:10px}.impact-outcomes h3{line-height:1.4}.story .impact-outcomes p{font-size:15px}html[data-theme=dark] .impact-metric{background:#161615}html[data-theme=dark] .impact-metric strong{color:#f1a07d}@media(max-width:600px){.impact-metric{padding:20px}.impact-metric strong{font-size:36px}.impact-outcomes{grid-template-columns:1fr}}

/* Give case-study titles room to wrap naturally. */
.case-hero h1{max-width:none;width:100%}.case-layout .story{max-width:none;min-width:0;width:100%}.story h2{max-width:none;width:100%}.story section>p,.story section>ul{max-width:780px}.web-mention{display:flex;flex-direction:column;gap:18px;padding:28px;background:#eeece3;border-radius:12px}.web-mention strong{font:500 24px/1.35 'Geist',sans-serif;letter-spacing:-.5px}.web-mention>span:last-child{font-size:13px;color:var(--muted)}.web-mention:hover strong{color:#bd4a25}html[data-theme=dark] .web-mention{background:#161615}html[data-theme=dark] .web-mention:hover strong{color:#f1a07d}
/* Kind words, pinned to a personal memo board. */
.memo-board{position:relative;padding:48px 32px 42px;gap:36px 28px;border:1px solid #d8d2c4;border-radius:18px;background-color:#e8e3d7;background-image:radial-gradient(#a59b8738 .8px,transparent .8px);background-size:8px 8px;box-shadow:inset 0 1px 5px #5347350c;align-items:stretch}
.memo-board .memo-note{position:relative;padding:40px 26px 28px;border-radius:2px;background:#f6edbf;color:#282a27;box-shadow:1px 6px 12px #41372418;transform:rotate(-2deg);gap:28px;transition:transform .25s,box-shadow .25s;transform-origin:50% 15px}
.memo-board .memo-note:nth-child(2){background:#e0e9e5;transform:rotate(2.5deg)}.memo-board .memo-note:nth-child(3){background:#f0ddd2;transform:rotate(-1deg)}.memo-board .memo-note:nth-child(4){background:#f3e8da;transform:rotate(1.5deg)}.memo-board .memo-note:nth-child(5){background:#e1e6ec;transform:rotate(-2.5deg)}.memo-board .memo-note:nth-child(6){background:#eee4c5;transform:rotate(2deg)}
.memo-note .memo-pin{position:absolute;left:calc(50% - 7px);top:12px;width:14px;height:14px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#df987a 0 12%,#bd4a25 40%,#83351e 100%);box-shadow:2px 3px 3px #44302445;z-index:1}.memo-pin:after{content:'';position:absolute;top:12px;left:9px;width:2px;height:7px;transform:rotate(-25deg);background:#695d51;z-index:-1}.memo-note:nth-child(even) .memo-pin{left:calc(43% - 7px);background:radial-gradient(circle at 35% 30%,#a9b5a2 0 12%,#63725e 40%,#404c3c 100%)}
.memo-board .memo-note blockquote{font-size:24px;line-height:1.4}.memo-board .memo-note figcaption span{color:#65645b}.memo-board .memo-note:hover{transform:rotate(0deg) translateY(-3px);box-shadow:2px 9px 18px #41372422;z-index:2}html[data-theme=dark] .memo-board{background-color:#1d1c19;background-image:radial-gradient(#9e92702e .8px,transparent .8px);border-color:#36332b}html[data-theme=dark] .memo-board .memo-note{color:#282a27}
@media(max-width:760px){.memo-board{padding:36px 20px;gap:32px}.memo-board .memo-note{padding:38px 24px 26px;transform:rotate(-1deg)}.memo-board .memo-note:nth-child(even){transform:rotate(1deg)}}@media(prefers-reduced-motion:reduce){.memo-board .memo-note{transition:none}.memo-board .memo-note:hover{transform:none}}
/* Personal interests woven into the introduction. */
.hero-interests{display:flex;justify-content:center;flex-wrap:wrap;gap:14px 24px;margin:28px auto 0}.hero-interest{display:inline-flex;align-items:center;gap:8px;font:23px 'Caveat',cursive}.interest-sticker{display:inline-grid;place-items:center;width:46px;height:46px;border:3px solid #fff;border-radius:13px;background:#fffaf0;box-shadow:0 3px 8px #282a2717;transform:rotate(-8deg)}.interest-sticker svg{width:37px;height:37px}.hero-interest:nth-child(2) .interest-sticker{transform:rotate(9deg);border-radius:50%}.hero-interest:nth-child(3) .interest-sticker{transform:rotate(-5deg)}.hero-interest:nth-child(4) .interest-sticker{transform:rotate(7deg)}.clear-intro .clear-description{max-width:720px;margin:25px auto 16px;font-size:17px;line-height:1.8}.hero-socials{display:flex;align-items:center;justify-content:center;gap:12px;margin:18px auto 0}.hero-socials a{width:42px;height:42px;display:grid;place-items:center;border-radius:50%;transition:background .2s,transform .2s;color:inherit}.hero-socials svg{width:21px;height:21px}.hero-socials a:hover{background:#ffffff60;transform:translateY(-3px);color:#bd4a25}html[data-theme=dark] .hero-socials a:hover{background:#ffffff12;color:#f1a07d}.clear-intro .clear-actions{margin-top:24px}@media(max-width:600px){.hero-interests{gap:12px 16px;max-width:330px}.hero-interest{font-size:21px}.interest-sticker{width:38px;height:38px}.interest-sticker svg{width:30px;height:30px}.clear-intro .clear-description{font-size:15px}.studio-hero.clear-hero{padding-bottom:85px}}@media(prefers-reduced-motion:reduce){.hero-socials a{transition:none}.hero-socials a:hover{transform:none}}

/* Structural dividers share one neutral color and one-pixel weight. */
:root{--line:#deddd5;--divider-width:1px}
html[data-theme=dark]{--line:#33332f}
.journey,.still-exploring{border-top:var(--divider-width) solid var(--line)}
.journey-list{border-left:var(--divider-width) solid var(--line)}
.work-row-details,html[data-theme=dark] .work-row-details{border-top:var(--divider-width) solid var(--line)}
/* Testimonial notes use the portfolio's handwritten typeface. */
.testimonial.memo-note blockquote{font-family:'Caveat',cursive;font-size:28px;font-weight:400;line-height:1.35}
/* About: professional experience, speaking and education. */
.resume-section{padding-top:65px;padding-bottom:45px}
.resume-section .section-heading{margin-bottom:28px}
.resume-list{list-style:none;padding:0;margin:0;border-top:1px solid var(--line)}
.resume-row{display:flex;justify-content:space-between;align-items:baseline;gap:24px;padding:26px 0;border-bottom:1px solid var(--line)}
.resume-row h3{font:500 clamp(20px,2vw,25px)/1.3 'Geist',sans-serif;letter-spacing:-.025em;margin:0}
.resume-row p{font-size:15px;margin:8px 0 0}
.resume-date{flex-shrink:0;font-size:13px;color:var(--muted);line-height:1.6}
#education{padding-bottom:100px}
@media(max-width:760px){.resume-section{padding-top:40px;padding-bottom:25px}.resume-row{flex-direction:column;gap:10px;padding:22px 0}.resume-row p{font-size:14px}#education{padding-bottom:60px}}
/* Give the desktop introduction room for three comfortable lines. */
.clear-intro .clear-description{max-width:860px}
.secops-summary{background:#eeece3;border:1px solid var(--line);border-radius:16px;padding:40px;margin:0 0 15px}
.secops-summary h2{font:450 clamp(32px,3.4vw,44px)/1.16 'Geist',sans-serif;letter-spacing:-.035em;margin:0 0 20px}
.secops-summary p{max-width:780px}.secops-summary .note{font-size:13px}
html[data-theme=dark] .secops-summary{background:#161615}
@media(max-width:760px){.secops-summary{padding:24px}}

/* Company destinations in work experience. */
.resume-row .company-link{display:inline-flex;align-items:center;gap:6px;text-decoration:underline;text-decoration-color:var(--line);text-underline-offset:4px;transition:color .2s,text-decoration-color .2s}.resume-row .company-link:hover,.resume-row .company-link:focus-visible{color:var(--accent);text-decoration-color:currentColor}.company-link .ph-icon{width:14px;height:14px}

/* Awards, certifications and fellowships. */
.highlights-grid{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.highlight-card{padding:30px;border:1px solid var(--line);border-radius:20px;background:#fffefa;box-shadow:0 5px 18px #282a2705}
.highlight-icon{display:grid;place-items:center;width:48px;height:48px;border-radius:15px;color:var(--accent);background:color-mix(in srgb,var(--accent) 9%,transparent);margin-bottom:22px}
.highlight-icon svg{width:25px;height:25px}
.highlight-card h3{font:500 20px/1.35 'Geist',sans-serif;letter-spacing:-.4px;margin:0 0 10px}
.highlight-card .highlight-issuer{color:var(--accent);font-size:14px;line-height:1.5;margin:0}
.highlight-card .highlight-date{font-size:12px;line-height:1.6;margin:6px 0 0;color:var(--muted)}
html[data-theme=dark] .highlight-card{background:#161615;box-shadow:none}
@media(max-width:1000px){.highlights-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.highlights-grid{grid-template-columns:1fr;gap:16px}.highlight-card{padding:26px}}

/* Highlights share the warm surfaces and illustrated stickers used across the portfolio. */
.highlights-grid{gap:20px}
.highlight-card{background:#eeece3;border:0;border-radius:14px;box-shadow:none;padding:28px;position:relative;overflow:visible}
.highlight-icon{width:50px;height:50px;background:#fffdf6;color:#343631;border:3px solid #fff;border-radius:15px;box-shadow:0 2px 0 #34363120,0 4px 10px #18212c10;transform:rotate(-7deg);margin-bottom:26px}
.highlight-card:nth-child(even) .highlight-icon{transform:rotate(7deg)}
.highlight-card:nth-child(3n) .highlight-icon{border-radius:50%}
.highlight-icon svg{width:29px;height:29px;fill:#f4d97c;stroke-width:1.8}
.highlight-card:nth-child(3n) .highlight-icon svg{fill:#b8dae6}
.highlight-card:nth-child(3n + 2) .highlight-icon svg{fill:#f2c9b7}
.highlight-card h3{font-size:21px;line-height:1.3;letter-spacing:-.5px}
.highlight-card .highlight-issuer{color:var(--muted);font-size:14px}
.highlight-card .highlight-date{font:22px/1.25 'Caveat',cursive;color:var(--muted);margin-top:16px}
html[data-theme=dark] .highlight-card{background:#161615;border:0;box-shadow:none}
html[data-theme=dark] .highlight-icon{color:#343631;background:#fffdf6}
@media(max-width:600px){.highlight-card{padding:26px}}
/* Company and school logos beside experience and education rows. */
.resume-row.has-logo{display:grid;grid-template-columns:48px minmax(0,1fr) auto;column-gap:20px;align-items:center}
.resume-logo{width:48px;height:48px;display:grid;place-items:center;overflow:hidden;border-radius:12px;background:#fff;border:1px solid var(--line);box-shadow:0 1px 2px #282a2710}
.resume-logo img{display:block;width:100%;height:100%;object-fit:contain}
.resume-logo.is-padded img{width:78%;height:78%}
.resume-logo.is-glyph{background:color-mix(in srgb,var(--accent) 10%,var(--paper));color:var(--accent);border-color:color-mix(in srgb,var(--accent) 22%,transparent)}
.resume-logo.is-glyph svg{width:24px;height:24px}
html[data-theme=dark] .resume-logo{border-color:#ffffff1f}
html[data-theme=dark] .resume-logo.is-glyph{background:#ffffff0d;color:#f1a07d}
@media(max-width:760px){.resume-row.has-logo{grid-template-columns:44px minmax(0,1fr);row-gap:8px;column-gap:16px;align-items:start}.resume-row.has-logo .resume-date{grid-column:2}.resume-logo{width:44px;height:44px;border-radius:11px}}
/* Work page: colour panels for Surge Revamp and Bias Breaker V2. */
.work-row-visual.surge-art{background:#dfe5d4;color:#3f5230}
.work-row-visual.bias-art{background:#e4def0;color:#4a3d6b}
/* Work page: "From the Archive" — a divider, a small heading and short cards. */
.archive{margin-top:72px;padding-top:44px;border-top:1px solid var(--line)}
html body .archive-title{margin:0 0 24px;font:500 var(--type-detail,26px)/1.25 'Geist',sans-serif;letter-spacing:-.025em}
.archive-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.archive-card{display:flex;flex-direction:column;justify-content:space-between;gap:28px;min-height:150px;padding:22px;border-radius:14px;background:#eeece3}
.archive-card .eyebrow{color:var(--muted)}
.archive-card h3{margin:0;font:500 18px/1.3 'Geist',sans-serif;letter-spacing:-.02em}
html[data-theme=dark] .archive-card{background:#161615}
@media(max-width:1000px){.archive-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.archive{margin-top:52px;padding-top:32px}.archive-grid{grid-template-columns:1fr;gap:12px}.archive-card{min-height:0;gap:16px;padding:20px}}
.work-row-visual.skyline-art{background:#d5e7e4;color:#2d5450}
/* Expandable work experience (About page). Collapsed rows look like the rest of the list. */
.resume-row.is-expandable{align-items:start;grid-template-rows:auto auto auto}
.resume-row.is-expandable .resume-logo{grid-row:1/3}
.resume-row.is-expandable .resume-date{padding-top:4px}
.resume-row.is-expandable{cursor:pointer}
.resume-row.is-expandable :is(.resume-details,a){cursor:auto}
.resume-row.is-expandable a{cursor:pointer}
.resume-extra{grid-column:2/-1;max-width:68ch}
.resume-row .resume-summary{margin:12px 0 0;font-size:15px;line-height:1.65;color:var(--muted)}
.resume-toggle{display:inline-flex;align-items:center;gap:6px;margin-top:12px;padding:4px 0;border:0;background:none;color:#bd4a25;font:500 14px/1.4 'Geist',sans-serif;cursor:pointer}
.resume-toggle svg{width:15px;height:15px;transition:transform .3s cubic-bezier(.22,1,.36,1)}
.resume-row.is-open .resume-toggle svg{transform:rotate(180deg)}
.resume-toggle:focus-visible{outline:2px solid currentColor;outline-offset:4px;border-radius:4px}
.resume-row.is-expandable:hover .resume-toggle{text-decoration:underline;text-underline-offset:4px}
html[data-theme=dark] .resume-toggle{color:#f1a07d}
.resume-details{grid-column:2/-1;display:grid;grid-template-rows:1fr}
.js-expandable .resume-details{grid-template-rows:0fr;opacity:0;transition:grid-template-rows .32s cubic-bezier(.22,1,.36,1),opacity .28s ease}
.js-expandable .resume-row.is-open .resume-details{grid-template-rows:1fr;opacity:1}
.resume-details-inner{min-height:0;overflow:hidden}
.xp-content{max-width:720px;padding:30px 0 8px}
.xp-block+.xp-block{margin-top:34px}
.xp-content .xp-label{margin:0 0 12px;font:500 11px/1.4 'Geist',sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.xp-content p{margin:0;font-size:15px;line-height:1.7;color:var(--muted)}
.xp-content .xp-lede{font-size:16px;color:var(--ink)}
.xp-group+.xp-group{margin-top:26px}
.xp-content h5{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 8px;font:500 16px/1.4 'Geist',sans-serif;letter-spacing:-.01em;color:var(--ink)}
.xp-group>p{margin-bottom:10px;font-size:14px}
.xp-sep{color:var(--muted);font-weight:400}
.xp-flag{padding:3px 8px;border:1px solid var(--line);border-radius:999px;font:500 10px/1.3 'Geist',sans-serif;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.xp-content ul:not(.xp-tags){display:grid;gap:7px;margin:0;padding-left:18px}
.xp-content li{font-size:15px;line-height:1.65;color:var(--muted)}
.xp-content li::marker{color:var(--line)}
.xp-tags{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none}
.xp-content .xp-tags li{padding:5px 11px;border:1px solid var(--line);border-radius:999px;font-size:12px;line-height:1.4}
.xp-case{display:inline-flex;align-items:center;gap:6px;margin-top:12px;font-size:14px;font-weight:500;color:var(--ink);text-decoration:underline;text-decoration-color:var(--line);text-underline-offset:4px}
.xp-case:hover,.xp-case:focus-visible{color:#bd4a25;text-decoration-color:currentColor}
html[data-theme=dark] .xp-case:hover{color:#f1a07d}
.xp-content .xp-note{margin-top:30px;font-size:13px;line-height:1.6}
/* Earlier roles: same layout, more compact. */
.resume-row.is-compact{padding:16px 0}

.resume-row.is-compact p{margin-top:4px}

@media (prefers-reduced-motion:reduce){.js-expandable .resume-details,.resume-toggle svg{transition:none}}
@media(max-width:760px){
 .resume-row.is-expandable{grid-template-rows:none}
 .resume-row.is-expandable .resume-logo{grid-row:auto}
 .resume-row.is-expandable .resume-date{padding-top:0}
 .resume-extra{grid-column:1/-1}
 .resume-details{grid-column:1/-1}
 .xp-content{padding-top:24px}
 .resume-row.is-compact{padding:14px 0}

}
.resume-row.is-expandable{row-gap:0}
/* Summary and expanded details use the full row width. */
.resume-extra,.xp-content{max-width:none}
/* Experience side panel (About page, experience.js). Details open from the right; a bottom sheet on phones. */
.js-panel .resume-details{display:none}
.js-panel .resume-toggle svg{transition:transform .25s cubic-bezier(.22,1,.36,1)}
.js-panel .resume-row.is-expandable:hover .resume-toggle svg,.js-panel .resume-toggle:focus-visible svg{transform:translateX(3px)}
html.xp-panel-open{overflow:hidden}
.xp-panel{position:fixed;inset:0 0 0 auto;width:min(760px,92vw);max-width:none;height:100dvh;max-height:none;margin:0;padding:0;border:0;background:transparent;color:var(--ink);overflow:visible}
.xp-panel::backdrop{background:#1e1f1c59;backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
.xp-panel-sheet{display:flex;flex-direction:column;height:100%;background:var(--paper);border-left:1px solid var(--line);box-shadow:-24px 0 60px #0000001f}
.xp-panel-head{display:grid;grid-template-columns:48px minmax(0,1fr) auto;align-items:start;gap:16px;padding:28px 28px 22px;border-bottom:1px solid var(--line)}
.xp-panel-logo{display:grid;place-items:center;width:48px;height:48px;overflow:hidden;border:1px solid var(--line);border-radius:12px;background:#fff}
.xp-panel-logo img{display:block;width:100%;height:100%;object-fit:contain}
.xp-panel-logo.is-glyph{background:color-mix(in srgb,var(--accent) 10%,var(--paper));color:var(--accent)}
.xp-panel-logo.is-glyph svg{width:24px;height:24px}
html body .xp-panel #xp-panel-title{margin:2px 0 0;font:500 21px/1.3 'Geist',sans-serif;letter-spacing:-.02em;color:var(--ink)}
.xp-panel .xp-panel-meta{margin:6px 0 0;font-size:14px;line-height:1.5;color:var(--muted)}
.xp-panel-close{display:grid;place-items:center;width:40px;height:40px;border:1px solid var(--line);border-radius:50%;background:transparent;color:var(--ink);cursor:pointer;transition:background .2s,border-color .2s}
.xp-panel-close svg{width:18px;height:18px}
.xp-panel-close:hover{background:color-mix(in srgb,var(--ink) 6%,transparent)}
.xp-panel-body{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:4px 28px 40px}
.xp-panel-body:focus{outline:none}
.xp-panel .xp-content{padding:24px 0 0}
html[data-theme=dark] .xp-panel-sheet{box-shadow:-24px 0 60px #00000066}
html[data-theme=dark] .xp-panel::backdrop{background:#0000008c}
@keyframes xp-in{from{transform:translateX(100%)}}
@keyframes xp-out{to{transform:translateX(100%)}}
@keyframes xp-up{from{transform:translateY(100%)}}
@keyframes xp-down{to{transform:translateY(100%)}}
@keyframes xp-fade{from{opacity:0}}
@keyframes xp-unfade{to{opacity:0}}
@media (prefers-reduced-motion:no-preference){
 .xp-panel[open] .xp-panel-sheet{animation:xp-in .38s cubic-bezier(.22,1,.36,1)}
 .xp-panel[open]::backdrop{animation:xp-fade .3s ease}
 .xp-panel.is-closing .xp-panel-sheet{animation:xp-out .26s cubic-bezier(.4,0,1,1) forwards}
 .xp-panel.is-closing::backdrop{animation:xp-unfade .26s ease forwards}
}
@media(max-width:700px){
 .xp-panel{inset:auto 0 0 0;width:100vw;height:94dvh}
 .xp-panel-sheet{border-left:0;border-top:1px solid var(--line);border-radius:20px 20px 0 0;box-shadow:0 -20px 50px #0000002e}
 .xp-panel-head{grid-template-columns:40px minmax(0,1fr) auto;gap:12px;padding:20px 20px 16px}
 .xp-panel-logo{width:40px;height:40px;border-radius:10px}
 html body .xp-panel #xp-panel-title{font-size:18px}
 .xp-panel-body{padding:0 20px 32px}
 .xp-panel[open] .xp-panel-sheet{animation-name:xp-up}
 .xp-panel.is-closing .xp-panel-sheet{animation-name:xp-down}
}
.xp-panel-body{scrollbar-gutter:stable}
/* Scrollbars: one slim, rounded style everywhere, with no arrow buttons.
   Chrome, Edge and Safari draw it with ::-webkit-scrollbar. The standard scrollbar-width and
   scrollbar-color would override those in Chrome, so they're reset to auto there.
   Firefox uses the standard properties and never shows arrows.
   The About timeline and the experience panel keep the thumb hidden until the pointer is near it
   (they add .scrollbar-hover in journey-horizontal.js and experience.js). */
:root{--sb-thumb:color-mix(in srgb,var(--ink) 26%,transparent);--sb-thumb-hover:color-mix(in srgb,var(--ink) 45%,transparent)}
@supports selector(::-webkit-scrollbar){
 html,html *,html .journey .journey-list,html .journey .journey-list.scrollbar-hover,html .xp-panel-body,html .xp-panel-body.scrollbar-hover{scrollbar-width:auto;scrollbar-color:auto}
 ::-webkit-scrollbar{width:10px;height:10px;background:transparent}
 ::-webkit-scrollbar-button,::-webkit-scrollbar-button:horizontal,::-webkit-scrollbar-button:vertical,html .journey .journey-list::-webkit-scrollbar-button,html .xp-panel-body::-webkit-scrollbar-button{display:none;width:0;height:0;background:none}
 ::-webkit-scrollbar-track,::-webkit-scrollbar-corner{background:transparent}
 ::-webkit-scrollbar-thumb{min-height:40px;min-width:40px;border:2px solid transparent;border-radius:10px;background-color:var(--sb-thumb);background-clip:padding-box}
 ::-webkit-scrollbar-thumb:hover{background-color:var(--sb-thumb-hover)}
 html .journey .journey-list::-webkit-scrollbar-thumb,html .xp-panel-body::-webkit-scrollbar-thumb{border:2px solid transparent;border-radius:10px;background:transparent;background-clip:padding-box}
 html .journey .journey-list.scrollbar-hover::-webkit-scrollbar-thumb,html .xp-panel-body.scrollbar-hover::-webkit-scrollbar-thumb{background-color:var(--sb-thumb)}
 html .journey .journey-list.scrollbar-hover::-webkit-scrollbar-thumb:hover,html .xp-panel-body.scrollbar-hover::-webkit-scrollbar-thumb:hover{background-color:var(--sb-thumb-hover)}
}
@supports not selector(::-webkit-scrollbar){
 html{scrollbar-width:thin;scrollbar-color:var(--sb-thumb) transparent}
 .xp-panel-body{scrollbar-width:thin;scrollbar-color:transparent transparent}
 .xp-panel-body.scrollbar-hover{scrollbar-color:var(--sb-thumb) transparent}
 .journey .journey-list.scrollbar-hover{scrollbar-color:var(--sb-thumb) transparent}
}
/* Case study outline (case-index.js), modelled on Notion's page outline but on the left edge.
   761px+: a small stack of lines, one per chapter; hover or keyboard focus opens a card of chapters.
   (Tablets get a more compact version and a wider left margin.) Phones: no outline for now. */
.case-layout{display:block}
.case-layout .contents .ol-lines{display:none}
@media(max-width:760px){
 .case-layout .contents{display:none}
}
@media(min-width:761px){
 .case-layout .contents.is-outline{--ol-accent:#bd4a25;position:fixed;z-index:20;left:clamp(12px,1.4vw,24px);top:140px;align-self:auto;display:block;width:auto;padding:0;margin:0;font-size:13px;transition:opacity .3s ease,visibility .3s}
 html[data-theme=dark] .case-layout .contents.is-outline{--ol-accent:#f1a07d}
 .case-layout .contents.is-outline.is-away{opacity:0;visibility:hidden}
 /* Collapsed: lines. Generous padding makes them easy to hover. */
 .case-layout .contents.is-outline .ol-lines{display:flex;flex-direction:column;gap:9px;padding:12px 14px 12px 6px;cursor:pointer;transition:opacity .15s ease}
 .ol-lines i{display:block;width:14px;height:2px;border-radius:2px;background:color-mix(in srgb,var(--ink) 22%,transparent);transition:width .2s ease,background .2s ease}
 .ol-lines i.is-active{width:22px;background:var(--ink)}
 /* Expanded: the card, opening over the lines. */
 .case-layout .contents.is-outline .ol-card{position:absolute;top:0;left:0;display:flex;flex-direction:column;gap:1px;min-width:240px;max-width:300px;max-height:calc(100vh - 200px);overflow-y:auto;padding:10px;border:1px solid var(--line);border-radius:14px;background:var(--paper);box-shadow:0 12px 40px #1f201d1f,0 2px 6px #1f201d0f;opacity:0;translate:-6px 0;pointer-events:none;transition:opacity .16s ease .12s,translate .2s ease .12s}
 html[data-theme=dark] .case-layout .contents.is-outline .ol-card{background:#141413;box-shadow:0 12px 40px #00000080}
 .case-layout .contents.is-outline:is(:hover,:focus-within):not(.is-resting) .ol-card{opacity:1;translate:0 0;pointer-events:auto;transition-delay:0s}
 .case-layout .contents.is-outline:is(:hover,:focus-within):not(.is-resting) .ol-lines{opacity:0}
 .case-layout .contents.is-outline .ol-card .eyebrow{display:block;margin:4px 10px 8px;color:var(--muted)}
 .case-layout .contents.is-outline .ol-card a{display:flex;align-items:baseline;gap:10px;padding:7px 10px;border-radius:8px;color:var(--muted);font:450 14px/1.35 'Geist',sans-serif;letter-spacing:-.005em;white-space:normal;translate:none;transition:background .15s,color .15s}
 .case-layout .contents.is-outline .ol-card a:hover{background:color-mix(in srgb,var(--ink) 6%,transparent);color:var(--ink)}
 .case-layout .contents.is-outline .ol-card a:focus-visible{outline:2px solid var(--ol-accent);outline-offset:-2px}
 .case-layout .contents.is-outline .ol-card a.active{color:var(--ol-accent);font-weight:500}
 .case-layout .contents.is-outline .ol-num{flex:none;font-size:11px;font-variant-numeric:tabular-nums;opacity:.6}
}
@media (prefers-reduced-motion:reduce){.case-layout .contents.is-outline :is(.ol-card,.ol-lines,.ol-lines i){transition:none}}
/* Outline: centred on the left edge and a touch larger, so it's easier to see and hit. */
@media(min-width:1100px){
 .case-layout .contents.is-outline{top:50%;translate:0 -50%}
 .case-layout .contents.is-outline .ol-lines{gap:12px;padding:16px 18px 16px 8px}
 .ol-lines i{width:20px;height:3px;border-radius:3px}
 .ol-lines i.is-active{width:32px}
 .case-layout .contents.is-outline .ol-card{top:50%;translate:-6px -50%;min-width:270px;max-width:320px;padding:12px}
 .case-layout .contents.is-outline:is(:hover,:focus-within):not(.is-resting) .ol-card{translate:0 -50%}
 .case-layout .contents.is-outline .ol-card a{padding:8px 12px;font-size:15px}
 .case-layout .contents.is-outline .ol-num{font-size:12px}
}
/* Case study visual placeholders: wireframe boxes (with the classic diagonal cross) that describe the
   visual to add. The placeholder's name and purpose sit underneath as the caption. */
.visual-ph{margin:36px 0 48px}
.visual-ph-frame{--ph-line:color-mix(in srgb,var(--ink) 11%,transparent);position:relative;display:grid;place-items:center;aspect-ratio:16/9;min-height:240px;padding:28px;overflow:hidden;border:1.5px dashed color-mix(in srgb,var(--ink) 24%,transparent);border-radius:14px;background:linear-gradient(to top right,transparent calc(50% - .75px),var(--ph-line) calc(50% - .75px) calc(50% + .75px),transparent calc(50% + .75px)),linear-gradient(to bottom right,transparent calc(50% - .75px),var(--ph-line) calc(50% - .75px) calc(50% + .75px),transparent calc(50% + .75px)),color-mix(in srgb,var(--ink) 3%,var(--paper))}
.visual-ph.is-wide .visual-ph-frame{aspect-ratio:21/9}
.visual-ph-body{position:relative;max-width:540px;padding:20px 24px;border:1px solid var(--line);border-radius:12px;background:var(--paper);text-align:center}
.visual-ph-tag{display:inline-block;margin-bottom:10px;font:500 11px/1.3 'Geist',sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.visual-ph p.visual-ph-insert{margin:0;font-size:15px;line-height:1.6;color:var(--ink)}
.visual-ph p.visual-ph-format{margin:10px 0 0;font-size:13px;line-height:1.55;color:var(--muted)}
.visual-ph-file{display:inline-block;margin-top:12px;padding:3px 8px;border-radius:6px;background:color-mix(in srgb,var(--ink) 5%,transparent);font:12px/1.4 ui-monospace,'SFMono-Regular',Menlo,Consolas,monospace;color:var(--muted)}
.visual-ph figcaption{max-width:780px;margin-top:12px;font-size:13px;line-height:1.6;color:var(--muted)}
.visual-ph figcaption strong{font-weight:500;color:var(--ink)}
.case-summary .eyebrow{display:block;margin-bottom:14px}
@media(max-width:760px){.visual-ph-frame,.visual-ph.is-wide .visual-ph-frame{aspect-ratio:auto;min-height:220px;padding:20px}.visual-ph-body{padding:16px 18px}}
/* Case study body text uses more of the width freed by the left outline (was 780px). */
.case-layout .story section>:is(p,ul,ol,h3,blockquote),.visual-ph figcaption,.secops-summary p{max-width:960px}
/* Tablets (761-1099px): compact outline, and a wider left margin on case study pages so text clears it. */
@media(min-width:761px) and (max-width:1099px){
 .case-study .section-wrap{padding-left:max(6%,76px)}
 .case-layout .contents.is-outline{left:10px;top:50%;translate:0 -50%}
 .case-layout .contents.is-outline .ol-lines{gap:8px;padding:12px 12px 12px 6px}
 .ol-lines i{width:12px;height:2px}
 .ol-lines i.is-active{width:20px}
 .case-layout .contents.is-outline .ol-card{top:50%;translate:-6px -50%;min-width:220px;max-width:260px;padding:8px}
 .case-layout .contents.is-outline:is(:hover,:focus-within):not(.is-resting) .ol-card{translate:0 -50%}
 .case-layout .contents.is-outline .ol-card a{padding:6px 10px;font-size:13px}
}
/* Case study: back link above the heading */
.case-back{display:inline-flex;align-items:center;gap:8px;width:max-content;margin-bottom:28px;padding:8px 14px 8px 11px;border:1px solid var(--line);border-radius:30px;font-size:12px;color:var(--muted);transition:color .2s,border-color .2s,background-color .2s}.case-back .ph-icon{width:14px;height:14px;transition:transform .25s}.case-back:hover{color:var(--ink);border-color:currentColor}.case-back:hover .ph-icon{transform:translateX(-3px)}.case-hero>.case-back+.eyebrow{display:block}@media(max-width:640px){.case-back{margin-bottom:20px}}
/* Skyline case study: product screens, point grids and design-choice notes */
.case-shot{margin:36px 0 48px}.case-shot a{display:block;border:1px solid var(--line);border-radius:10px;overflow:hidden;background:#fff;cursor:zoom-in;transition:border-color .2s,transform .3s}.case-shot a:hover{border-color:#b9bda9}.case-shot img{display:block;width:100%;height:auto}.case-shot figcaption{max-width:960px;margin-top:12px;font-size:13px;line-height:1.6;color:var(--muted)}.case-shot figcaption strong{color:var(--ink);font-weight:550}.case-shot.is-wide{margin:0 0 40px}.case-points{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px 28px;margin:30px 0 36px;max-width:1100px}.case-points.is-two{grid-template-columns:repeat(2,minmax(0,1fr))}.case-point{border-top:1px solid var(--line);padding-top:16px}.case-layout .story .case-point h3{font-size:17px;line-height:1.4;margin:0 0 8px}.case-layout .story .case-point p{font-size:14px;line-height:1.75;margin:0}.case-layout .story .case-choice{border-left:2px solid #8b9d65;padding:4px 0 4px 20px;margin:28px 0}.case-choice strong{color:var(--ink)}.story .workflow .note{margin:14px 0 0}html[data-theme=dark] .case-shot a{border-color:#333;background:#161616}html[data-theme=dark] .case-shot a:hover{border-color:#555}@media(max-width:900px){.case-points,.case-points.is-two{grid-template-columns:minmax(0,1fr)}}
/* NDA-locked case studies: blurred stand-in for the locked chapters, with the unlock card on top (nda.js) */
.nda-gate{position:relative;padding-top:65px;padding-bottom:110px;min-height:640px}.nda-ghost{display:grid;gap:64px;max-width:960px;margin-left:calc(180px + 65px);filter:blur(7px);opacity:.75;pointer-events:none;user-select:none;-webkit-mask-image:linear-gradient(#000 0,#000 45%,transparent 92%);mask-image:linear-gradient(#000 0,#000 45%,transparent 92%)}.nda-ghost-section{display:grid;gap:14px}.nda-bar{display:block;height:13px;border-radius:7px;background:color-mix(in srgb,var(--ink) 16%,transparent)}.nda-bar.is-eyebrow{width:120px;height:9px;margin-bottom:6px}.nda-bar.is-title{width:62%;height:36px;border-radius:10px;margin-bottom:14px;background:color-mix(in srgb,var(--ink) 26%,transparent)}.nda-ghost-media{display:block;aspect-ratio:16/10;margin:16px 0;border-radius:10px;background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 12%,transparent),color-mix(in srgb,#bd4a25 9%,transparent))}
.nda-lock{position:absolute;left:50%;top:150px;transform:translateX(-50%);width:min(480px,calc(100% - 32px));display:grid;justify-items:center;text-align:center;gap:6px;padding:40px 36px 32px;background:var(--paper);border:1px solid var(--line);border-radius:20px;box-shadow:0 24px 60px #282a271f,0 2px 6px #282a2714}.nda-lock-icon{display:grid;place-items:center;width:52px;height:52px;margin-bottom:12px;border-radius:50%;background:color-mix(in srgb,var(--accent) 12%,var(--paper));color:var(--accent)}.nda-lock-icon .ph-icon{width:24px;height:24px}html body .nda-lock h2{font-size:26px;line-height:1.25;letter-spacing:-.025em;font-weight:500;margin:6px 0 4px}.nda-lock>p{font-size:14px;line-height:1.65;margin:0 0 18px}.nda-form{width:100%;display:grid;gap:8px;text-align:left}.nda-label{font-size:12px;color:var(--muted)}.nda-field{display:flex;gap:8px}.nda-field input{flex:1;min-width:0;height:48px;padding:0 16px;border:1px solid var(--line);border-radius:999px;background:transparent;color:var(--ink);font:inherit;font-size:14px}.nda-field input:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-color:transparent}.nda-field button{height:48px;padding:0 22px;border:0;border-radius:999px;background:var(--cta-bg,#282a27);color:var(--cta-fg,#faf9f5);font-size:14px;font-weight:500;cursor:pointer;transition:background .2s,color .2s}.nda-field button:is(:hover,:focus-visible){background:var(--cta-hover-bg,#bd4a25);color:var(--cta-hover-fg,#fff)}.nda-field button:disabled{opacity:.7;cursor:progress}.nda-error{min-height:20px;margin:0;font-size:13px;color:#b3261e}.nda-request{margin-top:10px;font-size:13px;border-bottom:1px solid currentColor;padding-bottom:3px}.nda-gate.is-wrong .nda-lock{animation:nda-shake .4s}@keyframes nda-shake{20%,60%{transform:translateX(calc(-50% - 7px))}40%,80%{transform:translateX(calc(-50% + 7px))}}.nda-unlocked{animation:nda-in .6s ease backwards}@keyframes nda-in{from{opacity:0;transform:translateY(12px)}}
html[data-theme=dark] .nda-lock{background:#121212;border-color:#333;box-shadow:0 24px 60px #0009}html[data-theme=dark] .nda-lock-icon{background:#ffffff0d;color:#f1a07d}html[data-theme=dark] .nda-bar{background:#ffffff1f}html[data-theme=dark] .nda-bar.is-title{background:#ffffff2e}html[data-theme=dark] .nda-error{color:#ff8a80}@media(max-width:1099px){.nda-ghost{margin-left:0}}@media(max-width:640px){.nda-gate{min-height:600px;padding-bottom:80px}.nda-lock{top:90px;padding:32px 22px 26px}.nda-field{flex-direction:column}.nda-field input{flex:none}html body .nda-lock h2{font-size:22px}}@media(prefers-reduced-motion:reduce){.nda-gate.is-wrong .nda-lock,.nda-unlocked{animation:none}}
/* From the Archive: full-width rows, shorter than case study cards, with a small drawn thumbnail */
.archive-grid{grid-template-columns:minmax(0,1fr);gap:14px}.archive-card{display:grid;grid-template-columns:200px minmax(0,1fr);align-items:center;gap:32px;min-height:0;padding:18px 30px 18px 18px;border-radius:18px;background:#eeece3}.archive-thumb{position:relative;display:grid;place-items:center;height:132px;border-radius:10px;overflow:hidden}.archive-thumb.is-green{background:#dbe5b8;color:#2e3a23}.archive-thumb.is-blue{background:#dce5e9;color:#324750}.archive-thumb.is-peach{background:#eee0d6;color:#6a493a}.archive-thumb.is-yellow{background:#f4e9af;color:#5b4a14}.archive-thumb.is-lavender{background:#e5ddf2;color:#4b3a6e}.archive-thumb b{font:500 12px/1.2 'Geist',sans-serif;letter-spacing:-.01em}.ath-line{display:block;height:5px;border-radius:3px;background:currentColor;opacity:.18;width:80%}.ath-line.is-short{width:52%}.ath-browser{display:block;width:150px;margin-top:26px;align-self:end;border-radius:7px 7px 0 0;background:#fffc;box-shadow:0 6px 18px #0000000f}.ath-bar{display:flex;gap:4px;padding:7px 8px;border-bottom:1px solid #0000000d}.ath-bar i{width:5px;height:5px;border-radius:50%;background:currentColor;opacity:.3}.ath-screen{display:grid;gap:7px;padding:12px 12px 22px}.ath-phone{display:grid;align-content:start;gap:7px;width:76px;height:118px;margin-top:30px;align-self:end;padding:20px 10px 0;border-radius:14px 14px 0 0;background:#fffc;box-shadow:0 6px 18px #0000000f}.ath-notch{position:absolute;justify-self:center;margin-top:-13px;width:22px;height:5px;border-radius:3px;background:currentColor;opacity:.25}.ath-phone{position:relative}.ath-notch{left:50%;transform:translateX(-50%);top:8px;margin:0}.ath-mark{font:italic 400 44px/1 'EB Garamond',Georgia,serif;letter-spacing:-1px}.archive-copy{display:grid;gap:8px;min-width:0}html body .archive-card h3{margin:0;font:500 21px/1.3 'Geist',sans-serif;letter-spacing:-.025em}.archive-copy p{margin:0;font-size:14px;line-height:1.65;max-width:640px}.archive-meta{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}.archive-meta span{font-size:10px;font-weight:600;letter-spacing:1.2px;text-transform:uppercase;color:var(--muted)}.archive-meta span+span::before{content:'·';margin-right:8px}
html[data-theme=dark] .archive-card{background:#161615}html[data-theme=dark] .archive-thumb.is-green{background:#2b3322;color:#dbe5b8}html[data-theme=dark] .archive-thumb.is-blue{background:#243036;color:#dce5e9}html[data-theme=dark] .archive-thumb.is-peach{background:#382b23;color:#eee0d6}html[data-theme=dark] .archive-thumb.is-yellow{background:#36311a;color:#f4e9af}html[data-theme=dark] .archive-thumb.is-lavender{background:#2d2738;color:#e5ddf2}html[data-theme=dark] :is(.ath-browser,.ath-phone){background:#ffffff14;box-shadow:none}html[data-theme=dark] .ath-bar{border-color:#ffffff12}
@media(max-width:1000px){.archive-grid{grid-template-columns:minmax(0,1fr)}}@media(max-width:560px){.archive-grid{grid-template-columns:minmax(0,1fr);gap:12px}.archive-card{grid-template-columns:96px minmax(0,1fr);gap:16px;padding:12px 16px 12px 12px;border-radius:14px}.archive-thumb{height:96px}.ath-browser{width:84px;margin-top:18px}.ath-screen{padding:8px 8px 14px;gap:5px}.ath-bar{padding:5px 6px}.ath-phone{width:52px;height:80px;margin-top:20px;padding:14px 7px 0;gap:5px;border-radius:10px 10px 0 0}.archive-thumb b{font-size:9px}.ath-mark{font-size:30px}html body .archive-card h3{font-size:17px}.archive-copy p{font-size:13px;line-height:1.55}}
/* Case study cards without a real image: a drawn product mockup, cropped at the bottom of the panel */
.work-row-visual.has-mock{justify-content:flex-start;gap:26px;padding-bottom:0}.mock{flex:1;display:flex;flex-direction:column;min-height:0;margin:0 -2px;border-radius:12px 12px 0 0;background:#fffffff0;box-shadow:0 18px 40px #0000001a,0 0 0 1px #0000000a;overflow:hidden;transition:transform .5s cubic-bezier(.2,.7,.2,1)}.work-row-link:hover .mock{transform:translateY(-6px)}.mock-bar{display:flex;align-items:center;gap:6px;padding:11px 14px;border-bottom:1px solid #0000000d}.mock-bar>i{width:8px;height:8px;border-radius:50%;background:currentColor;opacity:.22}.mock-url{height:8px;width:38%;margin-left:14px;border-radius:4px;background:currentColor;opacity:.08}.mock-body{flex:1;display:grid;grid-template-columns:minmax(0,1fr);min-height:0}.mock-body.has-side{grid-template-columns:42px minmax(0,1fr)}.mock-side{display:flex;flex-direction:column;align-items:center;gap:14px;padding:16px 0;border-right:1px solid #0000000a;background:#00000005}.mock-side i{width:14px;height:14px;border-radius:4px;background:currentColor;opacity:.16}.mock-side i.is-on{opacity:.55}.mock-main{display:flex;flex-direction:column;gap:10px;padding:18px 20px;min-width:0;overflow:hidden}.mk-h{display:block;margin-bottom:4px;font:500 clamp(17px,1.7vw,23px)/1.15 'Geist',sans-serif;letter-spacing:-.03em}.mk-h em{font-family:'EB Garamond',Georgia,serif;font-style:italic;font-weight:400}.mk-line{display:block;height:6px;border-radius:3px;background:currentColor;opacity:.14;flex:none}.mk-line.is-dark{opacity:.42;height:7px}.mk-split{display:grid;grid-template-columns:1.15fr 1fr;gap:10px;margin-top:6px}.mk-split.is-wide-left{grid-template-columns:1.6fr 1fr}.mk-stack{display:flex;flex-direction:column;gap:10px}.mk-card{display:flex;flex-direction:column;gap:8px;padding:12px;border-radius:8px;border:1px solid #00000010;background:#fff}.mk-card.is-strong{background:color-mix(in srgb,currentColor 7%,#fff);border-color:color-mix(in srgb,currentColor 18%,transparent)}.mk-btn{display:block;width:70px;height:20px;margin-top:4px;border-radius:999px;background:currentColor;opacity:.75}.mk-chip{display:inline-block;width:44px;height:14px;border-radius:999px;background:currentColor;opacity:.2}.mk-tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:4px}.mk-tile{display:flex;flex-direction:column;gap:7px;padding:10px 12px;border-radius:8px;border:1px solid #00000010;background:#fff}.mk-tile b{font:500 18px/1 'Geist',sans-serif;letter-spacing:-.02em}.mk-toolbar{display:flex;align-items:center;gap:8px;margin-top:4px}.mk-toolbar .mk-btn{margin:0 0 0 auto;width:60px;height:18px}.mk-table{display:flex;flex-direction:column;border:1px solid #00000010;border-radius:8px;overflow:hidden;background:#fff}.mk-tr{display:grid;grid-template-columns:12px 1.5fr 1fr 1fr .8fr;align-items:center;gap:12px;padding:10px 12px;border-top:1px solid #0000000a}.mk-tr:first-child{border-top:0}.mk-tr.is-head{background:#00000006}.mk-tr.is-head .mk-line{opacity:.3}.mk-tr .mk-line{width:auto!important;max-width:100%}.mk-dot{width:12px;height:12px;border-radius:4px;background:currentColor;opacity:.2}.mk-canvas{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:10px;border-radius:8px;background:#00000008}.mk-ad{aspect-ratio:4/3;border-radius:6px;background:linear-gradient(135deg,color-mix(in srgb,currentColor 22%,#fff),color-mix(in srgb,currentColor 8%,#fff))}.mk-ad:nth-child(2){background:linear-gradient(160deg,#f3d9c9,#fbefe6)}.mk-ad:nth-child(3){background:linear-gradient(160deg,#d9e6d0,#f0f5ec)}.mk-hero{display:flex;flex-direction:column;align-items:center;gap:9px;padding:14px 0 10px;text-align:center}.mk-hero .mk-line{align-self:center}.mk-cards3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}@media(max-width:640px){.mock-main{padding:14px;gap:8px}.mock-body.has-side{grid-template-columns:32px minmax(0,1fr)}.mk-tr{grid-template-columns:10px 1.5fr 1fr .8fr}.mk-tr .mk-line:last-child{display:none}}@media(prefers-reduced-motion:reduce){.mock{transition:none}}
/* Archive cards with an external project link: the whole card is clickable */
.archive-card.is-link{position:relative;transition:background-color .2s}.archive-card.is-link h3 a::after{content:'';position:absolute;inset:0;border-radius:inherit}.archive-card.is-link h3 .ph-icon{width:16px;height:16px;margin-left:4px;vertical-align:-.1em;transition:transform .2s}.archive-card.is-link:hover h3 .ph-icon{transform:translate(2px,-2px)}.archive-card.is-link:hover{background:#e7e4d8}html[data-theme=dark] .archive-card.is-link:hover{background:#1d1d1b}.archive-card.is-link h3 a:focus-visible{outline:none}.archive-card.is-link:has(a:focus-visible){outline:2px solid var(--accent);outline-offset:4px}
/* WhatsApp archive thumbnail: teal, with a chat-app header on the phone */
.archive-thumb.is-teal{background:#d3ebe4;color:#075e54}.archive-thumb.is-teal .ath-phone{background:linear-gradient(#128c7e 0 22px,#fffffff2 22px)}.archive-thumb.is-teal .ath-notch{background:#fff;opacity:.6}.archive-thumb.is-teal .ath-phone b{margin-top:6px}.archive-thumb.is-teal .ath-line{background:#25d366;opacity:.35}.archive-thumb.is-teal .ath-line.is-short{background:currentColor;opacity:.18}html[data-theme=dark] .archive-thumb.is-teal{background:#10302b;color:#a8e6d5}html[data-theme=dark] .archive-thumb.is-teal .ath-phone{background:linear-gradient(#128c7e 0 22px,#ffffff14 22px)}
/* Case study card art and drawn mockups in the dark theme */
html[data-theme=dark] .work-row-visual.secops-art{background:#1d2926;color:#cfe0da}html[data-theme=dark] .work-row-visual.skyline-art{background:#1a2b29;color:#c4e3dd}html[data-theme=dark] .work-row-visual.pulse-art{background:#2c231d;color:#eed9ca}html[data-theme=dark] .work-row-visual.bias-art{background:#241f36;color:#dcd2f2}html[data-theme=dark] .work-row-visual.surge-art{background:#212819;color:#d5e2c4}html[data-theme=dark] .mock{background:#ffffff0c;box-shadow:0 18px 40px #00000059,0 0 0 1px #ffffff14}html[data-theme=dark] .mock-bar{border-color:#ffffff12}html[data-theme=dark] .mock-side{background:#ffffff05;border-color:#ffffff0f}html[data-theme=dark] :is(.mk-card,.mk-tile,.mk-table){background:#ffffff08;border-color:#ffffff14}html[data-theme=dark] .mk-card.is-strong{background:color-mix(in srgb,currentColor 9%,transparent);border-color:color-mix(in srgb,currentColor 24%,transparent)}html[data-theme=dark] .mk-tr{border-color:#ffffff0d}html[data-theme=dark] .mk-tr.is-head{background:#ffffff08}html[data-theme=dark] .mk-canvas{background:#ffffff08}html[data-theme=dark] .mk-ad{background:linear-gradient(135deg,color-mix(in srgb,currentColor 30%,transparent),color-mix(in srgb,currentColor 10%,transparent))}html[data-theme=dark] .mk-ad:nth-child(2){background:linear-gradient(160deg,#f1a07d4d,#f1a07d1a)}html[data-theme=dark] .mk-ad:nth-child(3){background:linear-gradient(160deg,#b3cc854d,#b3cc851a)}html[data-theme=dark] .mk-btn{opacity:.85}