:root {
  --green:#0B4439;
  --green-2:#06392F;
  --mint:#A8D8C7;
  --mint-2:#CDE9DF;
  --ivory:#F5F3ED;
  --ivory-2:#ECE9E1;
  --stone:#D2CEC4;
  --ink:#10201B;
  --muted:#627069;
  --line:rgba(11,68,57,.18);
  --line-dark:rgba(245,243,237,.18);
  --max:1240px;
  --pad:clamp(20px,4vw,56px);
  --radius:24px;
  --ease:cubic-bezier(.2,.7,.2,1);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--ivory);color:var(--ink);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:16px;line-height:1.6;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button,input,textarea,select{font:inherit}
::selection{background:var(--mint);color:var(--green)}
.skip-link{position:fixed;left:16px;top:16px;z-index:1000;padding:10px 14px;background:var(--green);color:var(--ivory);transform:translateY(-160%);transition:transform .2s}
.skip-link:focus{transform:translateY(0)}

.site-header{position:sticky;top:0;z-index:100;backdrop-filter:blur(18px);background:color-mix(in srgb,var(--ivory) 88%,transparent);border-bottom:1px solid transparent;transition:border-color .25s var(--ease),background .25s var(--ease),box-shadow .25s var(--ease)}
.site-header.scrolled{border-bottom-color:color-mix(in srgb,var(--stone) 74%,var(--green) 26%);box-shadow:0 8px 26px rgba(11,68,57,.04)}
.nav-wrap{max-width:var(--max);margin:0 auto;padding:13px var(--pad);display:flex;align-items:center;justify-content:space-between;gap:24px}
.brand{display:inline-flex;align-items:center}
.site-header .brand-badge{width:58px;height:58px;display:grid;place-items:center;background:transparent;overflow:visible;flex:0 0 auto;transition:transform .3s var(--ease),opacity .2s var(--ease)}
.site-header .brand:hover .brand-badge{transform:translateY(-1px) scale(1.025)}
.site-header .brand-badge img{width:100%;height:100%;object-fit:contain}
.nav-links{display:flex;align-items:center;gap:clamp(16px,2.4vw,30px)}
.nav-links a{font-size:.92rem;color:var(--green);position:relative}
.nav-links a::after{content:"";position:absolute;left:0;right:100%;bottom:-5px;height:1px;background:currentColor;transition:right .25s var(--ease)}
.nav-links a:hover::after,.nav-links a[aria-current="page"]::after{right:0}
.nav-cta{padding:10px 15px;border:1px solid var(--green);border-radius:999px;transition:background .2s,color .2s,transform .2s var(--ease),border-color .2s}
.nav-cta:hover{background:var(--green);color:var(--ivory);transform:translateY(-1px)}
.menu-toggle{display:none;border:0;background:transparent;color:var(--green);padding:8px;cursor:pointer}
.menu-toggle span{display:block;width:24px;height:1.5px;background:currentColor;margin:5px 0}

main{overflow:clip}.container{max-width:var(--max);margin:0 auto;padding-inline:var(--pad)}
.section{padding-block:clamp(82px,10vw,150px)}.section-tight{padding-block:clamp(62px,8vw,108px)}
.eyebrow{display:inline-flex;align-items:center;gap:8px;font-size:.76rem;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--green);margin-bottom:20px}
.eyebrow::before{content:"";width:26px;height:1px;background:currentColor}.eyebrow.light{color:var(--mint)}
.display{margin:0;font-size:clamp(3.35rem,7.7vw,8rem);line-height:.91;letter-spacing:-.07em;font-weight:760;max-width:11.2ch}
.display .accent{color:var(--green);position:relative;display:inline-block}.display .accent::after{content:"";position:absolute;left:1%;right:0;bottom:.04em;height:.12em;background:var(--stone);z-index:-1}
.lede{max-width:720px;font-size:clamp(1.06rem,1.42vw,1.3rem);color:#41534C;margin:28px 0 0}
.hero{padding:clamp(60px,8vw,110px) 0 clamp(88px,10vw,138px)}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(320px,.8fr);gap:clamp(48px,8vw,110px);align-items:center}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:36px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:12px 18px;border-radius:999px;border:1px solid var(--green);font-size:.92rem;font-weight:700;transition:transform .22s var(--ease),background .22s,color .22s,border-color .22s,box-shadow .22s}
.btn:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(11,68,57,.08)}.btn-primary{background:var(--green);color:var(--ivory)}.btn-secondary{background:transparent;color:var(--green)}.btn-accent{background:var(--mint);color:var(--green);border-color:var(--mint)}
.arrow{transition:transform .22s var(--ease)}.btn:hover .arrow,.text-link:hover .arrow,.service-row:hover .service-arrow{transform:translateX(4px)}
.hero-meta{display:flex;flex-wrap:wrap;gap:10px 22px;margin-top:42px;padding-top:22px;border-top:1px solid var(--line);color:var(--green);font-size:.82rem;letter-spacing:.06em;text-transform:uppercase}
.brand-canvas{min-height:550px;border-radius:var(--radius);background:var(--green);color:var(--ivory);position:relative;overflow:hidden;padding:28px;display:flex;align-items:center;justify-content:center;transition:transform .45s var(--ease),box-shadow .45s var(--ease);box-shadow:0 24px 60px rgba(11,68,57,.10)}
.brand-canvas:hover{transform:translateY(-5px);box-shadow:0 34px 80px rgba(11,68,57,.14)}
.brand-canvas::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 18% 18%,rgba(168,216,199,.2),transparent 32%),radial-gradient(circle at 88% 78%,rgba(210,206,196,.17),transparent 26%),linear-gradient(135deg,transparent 0 46%,rgba(245,243,237,.05) 46% 47%,transparent 47% 100%);animation:ambientDrift 12s ease-in-out infinite alternate}
.brand-canvas::after{content:"";position:absolute;right:-18%;bottom:-20%;width:70%;aspect-ratio:1;border:1px solid rgba(245,243,237,.15);border-radius:50%}
.hero-mark{width:min(82%,430px);position:relative;z-index:2;filter:drop-shadow(0 20px 60px rgba(0,0,0,.08));animation:heroFloat 8s ease-in-out infinite;transition:transform .6s var(--ease),filter .6s var(--ease)}
.brand-canvas:hover .hero-mark{transform:scale(1.03);filter:drop-shadow(0 24px 80px rgba(0,0,0,.1))}

.dark-section{background:var(--green);color:var(--ivory)}
.statement-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(42px,8vw,110px);align-items:start}.statement{margin:0;font-size:clamp(2.5rem,5.5vw,6.2rem);line-height:.98;letter-spacing:-.055em;max-width:11ch}.statement-copy{max-width:610px;color:#DCE6E1;font-size:1.07rem}
.principles{margin-top:48px;display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line-dark)}.principle{padding:22px 18px 0 0;border-right:1px solid var(--line-dark);min-height:138px}.principle:last-child{border-right:0;padding-left:18px}.principle:nth-child(2){padding-left:18px}.principle strong{display:block;font-size:.76rem;letter-spacing:.12em;text-transform:uppercase;color:var(--mint);margin-bottom:12px}.principle span{color:#E9EFEC;font-size:.95rem}

.section-head{display:flex;justify-content:space-between;gap:36px;align-items:end;margin-bottom:50px}.section-title{margin:0;font-size:clamp(2.5rem,5vw,5.8rem);line-height:.98;letter-spacing:-.055em;max-width:11ch}.section-intro{max-width:590px;color:#4F605A;margin:0}
.service-list{border-top:1px solid var(--line)}.service-row{display:grid;grid-template-columns:86px minmax(0,1fr) minmax(260px,.8fr) auto;gap:20px;align-items:center;padding:28px 0;border-bottom:1px solid var(--line);transition:padding .22s var(--ease),color .22s,background .22s,transform .22s var(--ease)}.service-row:hover{padding-left:14px;padding-right:14px;background:color-mix(in srgb,var(--stone) 28%,transparent);transform:translateY(-1px)}.service-no{color:var(--muted);font-size:.8rem;letter-spacing:.1em}.service-row h3{margin:0;font-size:clamp(1.4rem,2.2vw,2.3rem);letter-spacing:-.04em}.service-row p{margin:0;color:#52625C;font-size:.95rem}.service-arrow{width:38px;height:38px;border:1px solid var(--line);border-radius:50%;display:grid;place-items:center;transition:transform .22s var(--ease),background .22s,border-color .22s}.service-row:hover .service-arrow{background:var(--green);color:var(--ivory);border-color:var(--green)}

.work-stack{display:grid;gap:34px}.work-card{border-top:1px solid var(--line);padding-top:24px;display:grid;grid-template-columns:.42fr 1fr;gap:clamp(28px,5vw,72px);align-items:start}.work-meta{position:sticky;top:92px}.work-meta .index{font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}.work-meta h3{font-size:clamp(1.75rem,3vw,3.2rem);line-height:1;letter-spacing:-.045em;margin:14px 0}.work-meta p{margin:0 0 18px;color:#53635D}.tags{display:flex;flex-wrap:wrap;gap:8px}.tag{border:1px solid var(--line);border-radius:999px;padding:6px 10px;font-size:.72rem;color:var(--green);background:rgba(255,255,255,.2)}.text-link{display:inline-flex;gap:9px;align-items:center;margin-top:22px;font-weight:700;font-size:.9rem}
.project-visual,.work-index-visual,.case-hero-visual,.gallery-panel,.showcase-panel{border-radius:var(--radius);position:relative;overflow:hidden;border:1px solid var(--line);background:#E9E6DE;isolation:isolate;transition:transform .45s var(--ease),box-shadow .45s var(--ease),border-color .45s var(--ease)}
.project-visual:hover,.work-index-visual:hover,.gallery-panel:hover,.case-hero-visual:hover,.showcase-panel:hover{transform:translateY(-6px);box-shadow:0 26px 60px rgba(11,68,57,.10);border-color:color-mix(in srgb,var(--stone) 74%,var(--green) 26%)}
.project-visual{min-height:560px}.project-visual.m22j{background:var(--green)}.project-visual.stone{background:#E4E0D7;padding:clamp(18px,3vw,36px)}

.desktop-window{width:100%;background:#fff;border:7px solid #18201D;border-radius:20px;overflow:hidden;box-shadow:0 28px 70px rgba(11,68,57,.16);transition:transform .45s var(--ease),box-shadow .45s var(--ease)}
.desktop-window-bar{height:36px;background:#18201D;display:flex;align-items:center;gap:7px;padding:0 14px}.desktop-window-bar i{width:8px;height:8px;border-radius:50%;background:#F5F3ED;opacity:.48}.desktop-window-screen{background:#fff;overflow:hidden}.desktop-window-screen img{width:100%;height:auto;object-fit:contain;object-position:top center;transition:transform .55s var(--ease)}
.project-visual:hover .desktop-window,.work-index-visual:hover .desktop-window,.case-hero-visual:hover .desktop-window{transform:translateY(-3px) rotate(-.25deg)}.project-visual:hover .desktop-window-screen img,.showcase-panel:hover img{transform:scale(1.012)}

.m22j-visual-inner{position:absolute;inset:8%;display:grid;grid-template-columns:1.15fr .85fr;grid-template-rows:1fr auto;gap:18px;align-items:stretch}.m22j-mark-panel{grid-row:1/3;border:1px solid rgba(245,243,237,.16);border-radius:18px;display:grid;place-items:center;position:relative;overflow:hidden;background:rgba(255,255,255,.025)}.m22j-mark-panel img{width:63%;transition:transform .45s var(--ease)}.project-visual:hover .m22j-mark-panel img,.case-hero-visual:hover .m22j-mark-panel img{transform:scale(1.035)}.m22j-mark-panel::after{content:"M22J";position:absolute;left:18px;bottom:14px;color:var(--mint);font-size:.7rem;letter-spacing:.14em}.ui-card{border-radius:18px;background:var(--ivory);padding:18px;color:var(--green);position:relative;overflow:hidden;min-width:0}.ui-card.mint{background:var(--mint)}.ui-card.soft{background:var(--stone)}.ui-card .mini{font-size:.66rem;text-transform:uppercase;letter-spacing:.12em;opacity:.72}.ui-card .big{font-size:clamp(1.55rem,3vw,3rem);line-height:.92;letter-spacing:-.055em;font-weight:760;margin-top:18px;overflow-wrap:anywhere}.ui-swatch-row{display:flex;gap:8px;margin-top:18px}.swatch{width:26px;height:26px;border-radius:50%;border:1px solid rgba(11,68,57,.12)}

.process-grid{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line)}.process-step{padding:28px 22px 0 0;border-right:1px solid var(--line);min-height:230px}.process-step:not(:first-child){padding-left:22px}.process-step:last-child{border-right:0}.process-step .num{font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}.process-step h3{font-size:1.5rem;letter-spacing:-.035em;margin:36px 0 12px}.process-step p{margin:0;color:#586760;font-size:.92rem}
.about-strip{background:var(--mint);color:var(--green)}.about-grid{display:grid;grid-template-columns:.65fr 1.35fr;gap:clamp(42px,8vw,100px);align-items:start}.about-title{font-size:clamp(2.4rem,5vw,5rem);letter-spacing:-.055em;line-height:.98;margin:0}.about-copy{font-size:clamp(1.2rem,2.2vw,2.05rem);line-height:1.22;letter-spacing:-.035em;margin:0;max-width:820px}.about-copy small{display:block;font-size:.95rem;letter-spacing:0;line-height:1.6;margin-top:30px;max-width:700px;color:#315B50}
.cta-section{background:var(--green);color:var(--ivory)}.cta-wrap{display:grid;grid-template-columns:1.3fr .7fr;gap:40px;align-items:end}.cta-title{font-size:clamp(3.2rem,7vw,7.5rem);line-height:.9;letter-spacing:-.065em;margin:0;max-width:9ch}.cta-side{padding-bottom:8px}.cta-side p{color:#D8E1DD;margin:0 0 24px}
.site-footer{background:var(--green);color:var(--ivory);border-top:1px solid var(--line-dark)}.footer-grid{max-width:var(--max);margin:0 auto;padding:28px var(--pad) 34px;display:grid;grid-template-columns:1fr auto auto;gap:28px;align-items:end}.footer-brand{display:flex;align-items:center;gap:12px}.site-footer .brand-badge{width:36px;height:36px;border-radius:50%;background:transparent;display:grid;place-items:center;overflow:hidden}.site-footer .brand-badge img{width:100%;height:100%;object-fit:contain}.footer-links{display:flex;gap:18px;font-size:.82rem;color:#D9E2DE;flex-wrap:wrap}.footer-meta{font-size:.72rem;color:#B7C5BF;text-align:right}

.page-hero{padding:clamp(72px,9vw,126px) 0 clamp(62px,8vw,106px);border-bottom:1px solid var(--line)}.page-title{margin:0;font-size:clamp(3.55rem,8.8vw,8rem);line-height:.89;letter-spacing:-.07em;max-width:10.5ch}.page-lede{margin:28px 0 0;max-width:760px;color:#4F605A;font-size:1.12rem}
.work-index-card{display:grid;grid-template-columns:.58fr 1fr;gap:clamp(32px,6vw,76px);padding:38px 0 74px;border-bottom:1px solid var(--line)}.work-index-card:first-child{padding-top:0}.work-index-copy h2{margin:0 0 18px;font-size:clamp(2.2rem,4.5vw,5rem);line-height:.96;letter-spacing:-.055em}.work-index-copy p{color:#53635D;max-width:560px}.work-index-copy{min-width:0}.work-index-copy .tags{margin-bottom:18px}.work-index-copy .btn{margin-top:0}.work-index-visual{min-height:430px;background:#E4E0D7;padding:clamp(18px,3vw,34px);display:flex;align-items:center}

.case-hero-grid{display:grid;grid-template-columns:1fr .82fr;gap:clamp(40px,6vw,76px);align-items:center}.case-title{margin:0;font-size:clamp(3.6rem,7.6vw,7.5rem);line-height:.9;letter-spacing:-.07em}.case-summary{color:#4F605A;font-size:1.05rem;max-width:600px;margin:24px 0 0}.case-meta-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:38px;padding-top:22px;border-top:1px solid var(--line)}.case-meta-grid dt{font-size:.68rem;text-transform:uppercase;letter-spacing:.12em;color:var(--muted);margin-bottom:6px}.case-meta-grid dd{margin:0;color:var(--green);font-size:.9rem}.case-hero-visual{min-height:0;padding:clamp(18px,2.5vw,28px);background:#E4E0D7}
.case-section{padding:clamp(62px,7vw,92px) 0;border-top:1px solid var(--line)}.case-section-head{display:grid;grid-template-columns:.28fr 1fr;gap:clamp(28px,5vw,72px);align-items:start;margin-bottom:34px}.case-kicker{font-size:.74rem;text-transform:uppercase;letter-spacing:.12em;color:var(--muted)}.case-copy h2{margin:0;font-size:clamp(2rem,4vw,4.2rem);line-height:.98;letter-spacing:-.05em;max-width:14ch}.case-copy p{margin:18px 0 0;color:#4E5D57;max-width:690px}
.case-feature-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.feature-card{min-height:210px;padding:22px;border:1px solid var(--line);border-radius:20px;background:rgba(255,255,255,.26);transition:transform .3s var(--ease),box-shadow .3s var(--ease),background .3s var(--ease)}.feature-card:hover{transform:translateY(-5px);box-shadow:0 20px 46px rgba(11,68,57,.07);background:rgba(255,255,255,.48)}.feature-card.mint{background:var(--mint)}.feature-card.stone{background:var(--stone)}.feature-card.dark{background:var(--green);color:var(--ivory);border-color:var(--green)}.feature-icon{width:34px;height:34px;color:var(--green);margin-bottom:38px}.feature-card.dark .feature-icon{color:var(--mint)}.feature-card h3{font-size:1.28rem;line-height:1.05;letter-spacing:-.03em;margin:0 0 10px}.feature-card p{margin:0;font-size:.88rem;line-height:1.5;color:#53635D}.feature-card.dark p{color:#DDE6E2}
.showcase-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.showcase-grid.asym{grid-template-columns:.42fr 1fr}.showcase-grid.reverse{grid-template-columns:1fr .42fr}.showcase-panel{background:#E4E0D7;padding:18px}.showcase-panel.full{grid-column:1/-1}.showcase-panel img{width:100%;height:auto;object-fit:contain;object-position:top center;transition:transform .55s var(--ease)}.shot-label{display:flex;justify-content:space-between;gap:14px;margin:0 0 12px;font-size:.72rem;text-transform:uppercase;letter-spacing:.1em;color:var(--green)}.portrait-wrap{display:flex;justify-content:center;align-items:center;min-height:100%;padding:10px}.portrait-wrap img{max-width:360px;max-height:720px;width:auto;height:auto}.wide-strip img{width:100%}
.brand-system{display:grid;grid-template-columns:1fr 1fr;gap:20px}.brand-logo-stage{min-height:430px;background:var(--green);border-radius:22px;display:grid;place-items:center;position:relative;overflow:hidden}.brand-logo-stage img{width:56%;transition:transform .45s var(--ease)}.brand-logo-stage:hover img{transform:scale(1.035)}.brand-palette{display:grid;grid-template-rows:1fr auto;gap:20px}.brand-principle{border-radius:22px;background:var(--mint);padding:28px;display:flex;flex-direction:column;justify-content:space-between;min-height:280px}.brand-principle strong{font-size:clamp(2rem,3vw,3.2rem);line-height:.92;letter-spacing:-.05em;color:var(--green);max-width:10ch}.palette-row{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.palette-swatch{height:120px;border-radius:18px;border:1px solid var(--line);position:relative}.palette-swatch span{position:absolute;left:12px;bottom:10px;font-size:.68rem;text-transform:uppercase;letter-spacing:.08em}
.outcome-strip{display:grid;grid-template-columns:1.3fr .7fr;gap:34px;align-items:end;padding:34px;border-radius:22px;background:var(--stone)}.outcome-strip h2{margin:0;font-size:clamp(2.2rem,4vw,4.2rem);line-height:.95;letter-spacing:-.05em}.outcome-strip p{margin:0;color:#43554e}

.about-page-grid{display:grid;grid-template-columns:.45fr 1fr;gap:clamp(42px,8vw,100px)}.about-note{color:var(--muted);font-size:.9rem}.about-main p{font-size:clamp(1.2rem,1.85vw,1.65rem);line-height:1.36;letter-spacing:-.025em;margin-top:0}.about-main p+p{margin-top:24px}.founder-split{display:grid;grid-template-columns:.72fr 1.28fr;gap:clamp(36px,7vw,88px);align-items:center}.founder-photo{position:relative;border-radius:24px;overflow:hidden;border:1px solid var(--line);background:var(--stone)}.founder-photo img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:center 28%;transition:transform .55s var(--ease)}.founder-photo:hover img{transform:scale(1.025)}.founder-info h2{font-size:clamp(2.8rem,5.5vw,5.7rem);line-height:.95;letter-spacing:-.055em;margin:0 0 14px}.founder-role{font-size:1.05rem;color:var(--green);font-weight:700}.founder-info p{max-width:620px;color:#4E5D57}.founder-links{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}

.contact-grid{display:grid;grid-template-columns:.78fr 1.22fr;gap:clamp(50px,9vw,120px);align-items:start}.contact-direct{display:block;width:max-content;max-width:100%;margin-top:4px;font-size:clamp(1.9rem,3.7vw,3.9rem);line-height:1.05;letter-spacing:-.05em;color:var(--green);white-space:nowrap}.contact-options{display:grid;gap:16px;margin-bottom:34px}.contact-option{padding:22px;border:1px solid var(--line);border-radius:20px;background:rgba(255,255,255,.35);transition:transform .25s var(--ease),box-shadow .25s var(--ease),border-color .25s var(--ease),background .25s var(--ease)}.contact-option:hover{transform:translateY(-4px);box-shadow:0 18px 45px rgba(11,68,57,.06);border-color:color-mix(in srgb,var(--stone) 72%,var(--green) 28%)}.contact-option h2{margin:0 0 8px;font-size:1.5rem;line-height:1.05;letter-spacing:-.03em}.contact-option p{margin:0 0 14px;color:#52625C}.contact-form{display:grid;gap:18px}.field{display:grid;gap:7px}.field label{font-size:.76rem;text-transform:uppercase;letter-spacing:.1em;color:var(--green);font-weight:700}.field input,.field textarea,.field select{width:100%;border:0;border-bottom:1px solid var(--line);background:transparent;color:var(--ink);padding:12px 0;outline:none;border-radius:0;min-height:48px}.field textarea{min-height:140px;resize:vertical}.field input:focus,.field textarea:focus,.field select:focus{border-bottom-color:var(--green)}.form-note{font-size:.78rem;color:var(--muted)}

button,a,.btn,.menu-toggle{touch-action:manipulation;-webkit-tap-highlight-color:rgba(11,68,57,.08)}

/* Motion */
.reveal{opacity:1;transform:none}.js .reveal{opacity:0;transform:translateY(28px);transition:opacity .78s var(--ease),transform .78s var(--ease)}.js .reveal[data-motion="left"]{transform:translateX(-34px)}.js .reveal[data-motion="right"]{transform:translateX(34px)}.js .reveal[data-motion="scale"]{transform:scale(.975)}.js .reveal.visible{opacity:1;transform:none}.js .reveal[data-delay="1"]{transition-delay:.08s}.js .reveal[data-delay="2"]{transition-delay:.16s}.js .reveal[data-delay="3"]{transition-delay:.24s}.js .reveal[data-delay="4"]{transition-delay:.32s}
.js .reveal-shot{opacity:0;transform:translateY(24px) scale(.985);clip-path:inset(0 0 12% 0 round 22px);transition:opacity .85s var(--ease),transform .85s var(--ease),clip-path .95s var(--ease)}.js .reveal-shot.visible{opacity:1;transform:none;clip-path:inset(0 0 0 0 round 22px)}
.js .stagger-grid .stagger-item{opacity:0;transform:translateY(18px);transition:opacity .58s var(--ease),transform .58s var(--ease)}.js .stagger-grid.visible .stagger-item{opacity:1;transform:none}.js .stagger-grid.visible .stagger-item:nth-child(2){transition-delay:.08s}.js .stagger-grid.visible .stagger-item:nth-child(3){transition-delay:.16s}.js .stagger-grid.visible .stagger-item:nth-child(4){transition-delay:.24s}.js .stagger-grid.visible .stagger-item:nth-child(5){transition-delay:.32s}.js .stagger-grid.visible .stagger-item:nth-child(6){transition-delay:.40s}
.js body:not(.page-ready) .site-header{opacity:0;transform:translateY(-12px)}.js .site-header{transition:opacity .55s var(--ease),transform .55s var(--ease),border-color .25s var(--ease),background .25s var(--ease),box-shadow .25s var(--ease)}
.js body:not(.page-ready) .hero .eyebrow,.js body:not(.page-ready) .hero .display,.js body:not(.page-ready) .hero .lede,.js body:not(.page-ready) .hero .hero-actions,.js body:not(.page-ready) .hero .hero-meta{opacity:0;transform:translateY(22px)}
.js .hero .eyebrow,.js .hero .display,.js .hero .lede,.js .hero .hero-actions,.js .hero .hero-meta{transition:opacity .7s var(--ease),transform .7s var(--ease)}
.js body.page-ready .hero .eyebrow,.js body.page-ready .hero .display,.js body.page-ready .hero .lede,.js body.page-ready .hero .hero-actions,.js body.page-ready .hero .hero-meta{opacity:1;transform:none}.js .hero .display{transition-delay:.08s}.js .hero .lede{transition-delay:.16s}.js .hero .hero-actions{transition-delay:.24s}.js .hero .hero-meta{transition-delay:.32s}
@keyframes heroFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}@keyframes ambientDrift{0%{transform:translate3d(0,0,0) scale(1)}100%{transform:translate3d(0,-10px,0) scale(1.035)}}

@media(max-width:980px){.hero-grid,.statement-grid,.about-grid,.cta-wrap,.case-hero-grid,.contact-grid,.about-page-grid,.founder-split{grid-template-columns:1fr}.brand-canvas{min-height:460px}.service-row{grid-template-columns:60px 1fr auto}.service-row p{grid-column:2/-1}.work-card,.work-index-card{grid-template-columns:1fr}.work-meta{position:static}.process-grid{grid-template-columns:1fr 1fr}.process-step{border-bottom:1px solid var(--line)}.case-feature-grid{grid-template-columns:1fr 1fr}.case-section-head{grid-template-columns:1fr}.case-hero-visual{max-width:760px}.footer-grid{grid-template-columns:1fr}.footer-meta{text-align:left}.brand-system{grid-template-columns:1fr}.outcome-strip{grid-template-columns:1fr}}
@media(max-width:760px){html:not(.js) .menu-toggle{display:none}html:not(.js) .nav-links{position:static;display:flex;opacity:1;pointer-events:auto;transform:none;padding:0;border:0;box-shadow:none}.nav-links{position:fixed;top:80px;left:16px;right:16px;display:grid;gap:4px;padding:16px;background:var(--ivory);border:1px solid var(--line);border-radius:16px;box-shadow:0 20px 60px rgba(11,68,57,.12);transform:translateY(-10px);opacity:0;pointer-events:none;transition:.2s var(--ease)}.nav-links.open{transform:none;opacity:1;pointer-events:auto}.nav-links a{padding:10px 8px}.menu-toggle{display:block}.display{font-size:clamp(3.05rem,14.5vw,5.5rem)}.hero{padding-top:46px}.brand-canvas{min-height:370px}.principles{grid-template-columns:1fr}.principle,.principle:nth-child(2),.principle:last-child{border-right:0;border-bottom:1px solid var(--line-dark);padding:20px 0;min-height:auto}.principle:last-child{border-bottom:0}.section-head{display:block}.section-intro{margin-top:18px}.service-row{grid-template-columns:44px 1fr auto;padding:22px 0}.service-row:hover{padding-left:0;padding-right:0;background:transparent;transform:none}.project-visual{min-height:390px}.m22j-visual-inner{grid-template-columns:1fr;grid-template-rows:1fr}.m22j-mark-panel{grid-row:auto}.m22j-visual-inner .ui-card{display:none}.process-grid{grid-template-columns:1fr}.process-step,.process-step:not(:first-child){padding:24px 0;border-right:0;min-height:auto}.process-step h3{margin-top:18px}.case-meta-grid{grid-template-columns:1fr}.case-feature-grid{grid-template-columns:1fr}.showcase-grid,.showcase-grid.asym,.showcase-grid.reverse{grid-template-columns:1fr}.showcase-panel.full{grid-column:auto}.portrait-wrap img{max-width:280px}.brand-palette{grid-template-rows:auto auto}.palette-swatch{height:88px}.contact-direct{white-space:normal;overflow-wrap:anywhere}.founder-photo{max-width:480px}.desktop-window{border-width:5px}.work-index-visual{min-height:300px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}.reveal,.reveal-shot,.stagger-item{opacity:1!important;transform:none!important;clip-path:none!important}}


/* Final mobile QA fixes */
@media(max-width:760px){
  .menu-toggle{width:44px;height:44px;display:grid;align-content:center;justify-content:center;border-radius:50%;position:relative;z-index:170}
  .nav-links{top:74px;z-index:160;padding:12px}
  .nav-links a{display:flex;align-items:center;min-height:48px;padding:11px 12px;border-radius:10px}
  .nav-links a:active{background:rgba(168,216,199,.22)}
  .nav-links .nav-cta{justify-content:center;margin-top:4px;background:var(--green);color:var(--ivory);border-color:var(--green)}
  body.nav-open{overflow:hidden}
  .contact-grid>div:first-child .eyebrow{display:flex;width:max-content}
  .contact-direct{display:block;width:100%;max-width:100%;margin-top:10px;font-size:clamp(1.7rem,8vw,2.25rem);line-height:1.08;letter-spacing:-.035em;white-space:nowrap;overflow-wrap:normal}
  .work-index-copy{min-width:0}
  .work-index-copy h2{font-size:clamp(2.15rem,10.5vw,3rem);line-height:.98;max-width:100%;overflow-wrap:normal}
  .work-index-copy .tags{margin-bottom:20px}
  .work-index-copy .btn{display:inline-flex;margin-top:0;clear:both}
  .work-index-card{gap:26px;padding-bottom:58px}
  .tag{padding:6px 9px}
}
@media(max-width:380px){
  .contact-direct{font-size:1.62rem;letter-spacing:-.025em}
  .work-index-copy h2{font-size:2.05rem}
}

/* Homepage signature motion */
.hero-display{max-width:11.4ch}
.phrase-rotator{
  display:inline-grid;
  grid-template-columns:1fr;
  grid-template-rows:1fr;
  vertical-align:baseline;
  position:relative;
  color:var(--green);
  isolation:isolate;
  white-space:nowrap;
}
.phrase-rotator::after{
  content:"";
  position:absolute;
  left:.02em;
  right:.02em;
  bottom:.03em;
  height:.11em;
  background:var(--mint);
  z-index:-1;
  transform-origin:left center;
  transform:scaleX(1);
  transition:transform .55s var(--ease),opacity .35s var(--ease);
}
.phrase-rotator.is-switching::after{transform:scaleX(.18);opacity:.65}
.phrase{
  grid-area:1/1;
  display:inline-block;
  opacity:0;
  transform:translate3d(0,.58em,0);
  filter:blur(4px);
  transition:opacity .5s var(--ease),transform .58s var(--ease),filter .5s var(--ease);
  will-change:transform,opacity,filter;
}
.phrase.is-active{opacity:1;transform:none;filter:blur(0)}
.phrase.is-leaving{opacity:0;transform:translate3d(0,-.48em,0);filter:blur(3px)}
.hero-ending{white-space:normal}

/* Hero logo zoom. On desktop the full mark resolves automatically on load.
   On mobile JavaScript links the same zoom-out to the visitor's scroll. */
.logo-zoom{overflow:hidden}
.hero-logo-zoom{
  width:min(82%,430px);
  position:relative;
  z-index:2;
  filter:drop-shadow(0 20px 60px rgba(0,0,0,.08));
  transform-origin:21% 79%;
  will-change:transform,opacity;
  backface-visibility:hidden;
}
@media(min-width:761px){
  .js .hero-logo-zoom{
    opacity:.98;
    animation:logoFocusReveal 1.55s cubic-bezier(.16,.84,.22,1) .18s both;
  }
  .logo-zoom:hover .hero-logo-zoom{transform:scale(1.025);transition:transform .42s var(--ease)}
}
@keyframes logoFocusReveal{
  0%{transform:translate(29%,-29%) scale(4.75);filter:drop-shadow(0 28px 85px rgba(0,0,0,.03));opacity:.96}
  72%{transform:translate(-1.5%,1.5%) scale(.985);opacity:1}
  100%{transform:translate(0,0) scale(1);filter:drop-shadow(0 20px 60px rgba(0,0,0,.08));opacity:1}
}

@media(max-width:760px){
  .hero-display{max-width:10.6ch}
  .phrase-rotator{white-space:nowrap}
  .hero-logo-zoom{width:min(78%,330px);transform:translate(29%,-29%) scale(4.5)}
}

@media(max-width:390px){
  .phrase-rotator{font-size:.96em}
}

@media(prefers-reduced-motion:reduce){
  .phrase:not(.is-active){display:none}
  .phrase-rotator::after{transition:none}
  .hero-logo-zoom{animation:none!important;transform:none!important;opacity:1!important}
}