@font-face{font-family:Fraunces;src:url('/assets/serif.woff2')}@font-face{font-family:Fraunces;src:url('/assets/serif-italic.woff2');font-style:italic}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:#161616;background:#fff;font:14px Arial,Helvetica,sans-serif}a{color:inherit;text-decoration:none}button,input,textarea{font:inherit}button,a,input,textarea{-webkit-tap-highlight-color:transparent}button{cursor:pointer}a:focus-visible,button:focus-visible{outline:2px solid #8b7b72;outline-offset:5px}header{height:90px;position:relative;background:#eeece9;display:flex;align-items:center;justify-content:center;padding:0 6%}.logo{width:86px;display:block}.logo img{width:100%;display:block}nav{position:absolute;right:6.5%;display:flex;gap:30px;color:#858480;font-size:13px}nav a:hover,nav a[aria-current=page]{color:#292723}footer{text-align:center;color:#8c8a85;font-size:14px;line-height:16px;padding:65px 20px 90px}.home-page{background:#eeece9;min-height:100vh}.home{height:480px;display:flex;align-items:center;justify-content:center;padding:0 20px}.home h1{font:400 clamp(42px,5.94vw,80px)/.85 Fraunces,Georgia,serif;letter-spacing:-.5px;text-align:center;color:#cec6c2;margin:0;transform:translateY(22px)}.home-page footer{padding-top:48px}.portfolio{padding:80px 6% 0}.intro{max-width:670px;border-bottom:1px solid #aaa;margin-bottom:65px}.intro h1{font:italic 400 100px/.95 Fraunces,Georgia,serif;color:#c5beb9;margin:0 0 35px;letter-spacing:-4px}.intro p{font-size:22px;letter-spacing:-1px;margin:0 0 12px}.filters{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:30px}.filters button{border:0;padding:8px 12px;background:#f1f1f1;color:#8c8c88;border-radius:4px;letter-spacing:-.4px}.filters button[aria-pressed=true]{background:#cfc8c2;color:#222}.projects{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:42px 30px}.project img{width:100%;aspect-ratio:3/4;object-fit:cover;display:block}.project h2{font-size:18px;font-weight:400;margin:17px 0 7px}.project p{margin:0;color:#777}.project:hover img{opacity:.9}.project[hidden]{display:none}.work-grid{display:flex;flex-wrap:wrap;gap:10px}.work-image{padding:0;border:0;background:none;height:340px;flex:1 1 24%;overflow:hidden}.work-image:nth-child(2){flex-basis:70%}.work-image img{height:100%;width:100%;object-fit:cover;display:block}.about{padding:90px 8% 0;text-align:center}.about h1{font:400 52px/1.12 Fraunces,Georgia,serif;color:#b9b0aa;max-width:1080px;margin:0 auto 70px}.about>p{font:400 30px/1.4 Fraunces,Georgia,serif;max-width:900px;margin:0 auto 90px}.services{font-size:17px;line-height:2;margin-bottom:55px}.clients{display:flex;justify-content:center;flex-wrap:wrap}.clients img{width:10%;max-width:143px;object-fit:contain}.contact{padding:90px 12%;display:grid;grid-template-columns:1fr 1fr;gap:80px;min-height:500px}.contact h1{font:400 58px Fraunces,Georgia,serif;margin:0 0 40px;color:#b9b0aa}.contact h2{font-size:17px;font-weight:400;margin:26px 0 9px}form label{display:block;line-height:2.2}input,textarea{display:block;width:100%;border:0;border-bottom:1px solid #777;border-radius:0;padding:8px 0;background:transparent;margin-bottom:23px;resize:vertical}.names{display:grid;grid-template-columns:1fr 1fr;gap:25px}form button{border:1px solid #333;background:transparent;padding:10px 32px;float:right}.form-note{clear:both;font-size:12px;color:#888;padding-top:20px}dialog{border:0;background:#eee;padding:35px;max-width:95vw;max-height:95vh}dialog::backdrop{background:#000b}dialog img{max-width:85vw;max-height:80vh;object-fit:contain}.close{position:absolute;right:8px;top:3px;border:0;background:transparent;font-size:30px}.detail{padding:60px 6%}.back{display:inline-block;margin-bottom:50px;color:#888}.detail-copy{max-width:850px;margin:0 auto 60px;font-size:18px;line-height:1.6}.detail-copy p:first-child{font:400 60px Fraunces,serif;color:#b9b0aa}.detail-images{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.detail-images img{width:100%;display:block}.detail-images img:first-child{grid-column:1/-1}@media(min-width:1600px){.home{height:56vh}.home h1{font-size:90px}}@media(max-width:700px){header{height:105px;align-items:flex-start;padding-top:23px}.logo{width:75px}nav{top:70px;right:0;width:100%;justify-content:center;gap:24px;font-size:12px}.home{height:430px;padding:0 24px}.home h1{font-size:clamp(36px,7.4vw,52px);line-height:1.02;transform:none;max-width:550px}.home-page footer{padding-top:20px}.portfolio{padding:55px 6% 0}.intro{margin-bottom:35px}.intro h1{font-size:66px;letter-spacing:-2px;margin-bottom:25px}.intro p{font-size:19px}.filters{gap:5px}.filters button{font-size:12px;padding:8px}.projects{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 13px}.project h2{font-size:15px}.project p{font-size:12px}.work-image{height:240px;flex-basis:45%}.work-image:nth-child(2){flex-basis:100%}.about{padding:60px 7% 0}.about h1{font-size:34px;margin-bottom:50px}.about>p{font-size:24px;margin-bottom:50px}.services{font-size:14px}.clients img{width:25%}.contact{padding:50px 8%;grid-template-columns:1fr;gap:50px}.detail{padding:40px 6%}.detail-copy{font-size:16px}.detail-copy p:first-child{font-size:42px}.detail-images{grid-template-columns:1fr}footer{padding-bottom:50px}}
body:has(.about){background:#eeece9}.about{text-align:left;padding:90px 12.5% 0}.about h1{font-size:64px;line-height:1.04;letter-spacing:-3px;max-width:none;color:#cec6c2}.about>p{font-size:54px;line-height:1.1;letter-spacing:-2px;max-width:none;color:#cec6c2}.services{letter-spacing:0}.clients{margin:0 -7%}@media(max-width:700px){.about{padding:60px 7% 0}.about h1{font-size:36px;letter-spacing:-1px}.about>p{font-size:30px;letter-spacing:-.5px}}

/* Natural text widths reserve the resting layout; hover layers are out of flow. */
.home h1{display:flex;flex-direction:column;align-items:center}
.home h1 .line{display:flex;align-items:baseline;justify-content:center;gap:.18em;white-space:nowrap}
.home h1 .word{position:relative;display:inline-block;flex:none;white-space:nowrap}
.home h1 .word-reserve{display:block;pointer-events:none;transition:opacity .2s ease}
.home h1 .word-hover{position:absolute;top:0;left:50%;display:block;width:max-content;line-height:inherit;color:#000;opacity:0;pointer-events:none;transform:translateX(-50%) scaleX(var(--hover-fit,1));transform-origin:center;transition:opacity .2s ease}
.home h1 .creative .word-hover{font-family:Georgia,serif;font-size:.98em}
.home h1 .branding .word-hover{font-weight:600;font-size:.875em}
.home h1 .storytelling .word-hover{font-style:italic}
.home h1 .art .word-hover,.home h1 .cultural .word-hover{font-family:Arial,sans-serif;font-size:.875em}
.home h1 .cultural .word-hover{text-decoration:line-through}
@media(hover:hover){.home h1 .animated:hover .word-reserve{opacity:0}.home h1 .animated:hover .word-hover{opacity:1}}
.home h1 .animated:focus-visible{outline:1px solid currentColor;outline-offset:4px}
.home h1 .animated:focus-visible .word-reserve{opacity:0}.home h1 .animated:focus-visible .word-hover{opacity:1}
@media(max-width:700px){.home h1{font-size:clamp(24px,6.1vw,42px);line-height:1.05;max-width:100%}}
@media(prefers-reduced-motion:reduce){.home h1 .word-reserve,.home h1 .word-hover{transition:none}}

/* Homepage atmosphere: the original warm grey, beige, and taupe palette. */
.home-page{position:relative;isolation:isolate;background:#eeece9}
.ambient-background{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none;background:#eeece9}
.ambient-field{position:absolute;inset:-55%;will-change:transform;transform-origin:50% 50%;backface-visibility:hidden}
.ambient-field-one{background:radial-gradient(ellipse 40% 46% at 27% 35%,#b9b0aa 0%,#cec6c2 40%,rgba(206,198,194,0) 75%),radial-gradient(ellipse 38% 44% at 76% 69%,#b9b0aa 0%,#cec6c2 38%,rgba(206,198,194,0) 75%);animation:ambient-drift-one 9s ease-in-out infinite alternate;animation-delay:-3s}
.ambient-field-two{background:radial-gradient(ellipse 36% 42% at 68% 29%,#eeece9 0%,rgba(238,236,233,.94) 32%,rgba(238,236,233,0) 75%),radial-gradient(ellipse 33% 40% at 35% 76%,#b9b0aa 0%,rgba(185,176,170,.85) 30%,rgba(185,176,170,0) 75%);animation:ambient-drift-two 13s ease-in-out infinite alternate;animation-delay:-8s}
.ambient-light{position:absolute;inset:0;background:radial-gradient(ellipse 52% 34% at 50% 38%,rgba(238,236,233,.5) 0%,rgba(238,236,233,.22) 52%,transparent 100%)}
.home-page .home h1{color:#77716d}
.home-page header{background:transparent}
.motion-toggle{position:fixed;right:22px;bottom:18px;z-index:2;border:0;background:transparent;color:#77716d;font-size:11px;letter-spacing:.02em;padding:8px;cursor:pointer}
.motion-toggle:hover{color:#161616}.motion-toggle:focus-visible{outline:1px solid currentColor;outline-offset:2px}
.home-page.motion-paused .ambient-field{animation-play-state:paused}
@keyframes ambient-drift-one{0%{transform:translate(-14%,-8%) rotate(-12deg) scale(1.02)}50%{transform:translate(4%,10%) rotate(6deg) scale(1.12)}100%{transform:translate(15%,-6%) rotate(22deg) scale(1.04)}}
@keyframes ambient-drift-two{0%{transform:translate(12%,8%) rotate(12deg) scale(1.05)}50%{transform:translate(-5%,-7%) rotate(-9deg) scale(.98)}100%{transform:translate(-13%,9%) rotate(-23deg) scale(1.14)}}
@media(max-width:700px){.motion-toggle{right:12px;bottom:18px}}
@media(prefers-reduced-motion:reduce){.ambient-field{animation:none;will-change:auto}.motion-toggle{display:none}}

/* Mobile navigation: centered mark and nine-dot corner control. */
.mobile-menu-toggle{display:none}
@media(max-width:700px){
 header{height:90px;align-items:center;padding-top:0;z-index:20}
 .mobile-menu-toggle{display:flex;position:absolute;right:24px;top:23px;align-items:center;justify-content:center;width:44px;height:44px;padding:8px;border:0;background:transparent;color:#cec6c2;cursor:pointer}
 .mobile-menu-toggle svg{width:28px;height:28px;fill:currentColor}
 header nav{display:none;top:76px;right:20px;left:auto;width:min(240px,calc(100vw - 40px));flex-direction:column;gap:0;align-items:stretch;padding:14px 0;border:1px solid rgba(185,176,170,.3);background:#eeece9;border-radius:3px;box-shadow:0 12px 32px rgba(65,55,48,.1);font-size:18px;color:#77716d}
 header nav a{display:block;padding:14px 24px;min-height:48px}
 header nav a:hover,header nav a:focus-visible{background:#e6e1dd}
 header.menu-open nav{display:flex}
 .mobile-menu-toggle[aria-expanded=true]{color:#77716d}
}
/* Full-screen mobile menu and animated dot-to-X control. */
@media(max-width:700px){
 body.menu-open-global{overflow:hidden}
 header .logo{position:relative;z-index:23;transition:opacity .35s ease,transform .35s ease}
 .mobile-menu-toggle{z-index:24}
 .mobile-menu-toggle svg{overflow:visible;transition:transform .45s cubic-bezier(.22,1,.36,1)}
 .mobile-menu-toggle circle{transform-box:fill-box;transform-origin:center;transition:opacity .3s ease,transform .45s cubic-bezier(.22,1,.36,1)}
 header nav{display:flex;position:fixed;z-index:22;inset:0;width:auto;height:100dvh;padding:26vh 28px 15vh;border:0;border-radius:0;box-shadow:none;background:#eeece9;align-items:flex-end;justify-content:flex-start;gap:0;opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-12px);transition:opacity .38s ease,transform .5s cubic-bezier(.22,1,.36,1),visibility 0s linear .5s}
 header nav a{min-height:auto;padding:7px 0;font-size:clamp(38px,11vw,54px);line-height:1;font-weight:600;letter-spacing:-.045em;text-align:right;color:#cec6c2;opacity:0;transform:translateX(24px);transition:color .2s ease,opacity .35s ease,transform .45s cubic-bezier(.22,1,.36,1)}
 header nav a:hover,header nav a:focus-visible{background:transparent;color:#77716d}
 header.menu-open nav{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0);transition-delay:0s}
 header.menu-open nav a{opacity:1;transform:translateX(0)}
 header.menu-open nav a:nth-child(1){transition-delay:.08s}
 header.menu-open nav a:nth-child(2){transition-delay:.12s}
 header.menu-open nav a:nth-child(3){transition-delay:.16s}
 header.menu-open nav a:nth-child(4){transition-delay:.20s}
 header.menu-open .logo{opacity:0;transform:scale(.92)}
 header.menu-open .mobile-menu-toggle svg{transform:rotate(90deg) scale(.9)}
 header.menu-open .mobile-menu-toggle circle:nth-child(2),header.menu-open .mobile-menu-toggle circle:nth-child(4),header.menu-open .mobile-menu-toggle circle:nth-child(6),header.menu-open .mobile-menu-toggle circle:nth-child(8){opacity:0;transform:scale(0)}
  }
@media(max-width:700px) and (prefers-reduced-motion:reduce){header nav,header nav a,header .logo,.mobile-menu-toggle svg,.mobile-menu-toggle circle{transition:none}}
/* Refined mobile menu proportions and fixed homepage frame. */
.home-page{height:100dvh;overflow:hidden}
.home-page .home{height:calc(100dvh - 90px)}
.home-page footer{position:fixed;z-index:3;bottom:18px;left:50%;display:flex;align-items:center;gap:9px;padding:8px 0;font-size:10px;line-height:1;transform:translateX(-50%);white-space:nowrap}
.home-page footer br{display:none}
@media(max-width:700px){
 header nav{padding:132px 25px 15vh}
 header nav a{padding:6px 0;font-size:clamp(25px,7.8vw,34px);line-height:1.08;letter-spacing:-.035em}
 header.menu-open .mobile-menu-toggle svg{transform:none}
 header.menu-open .mobile-menu-toggle circle:nth-child(1),header.menu-open .mobile-menu-toggle circle:nth-child(3),header.menu-open .mobile-menu-toggle circle:nth-child(5),header.menu-open .mobile-menu-toggle circle:nth-child(7),header.menu-open .mobile-menu-toggle circle:nth-child(9){transform:none}
 .home-page .home{height:calc(100dvh - 90px)}
 .home-page footer{bottom:10px;font-size:9px}
}
/* Center the homepage statement on the viewport and increase it uniformly. */
.home-page .home{position:fixed;inset:0;z-index:0;width:100%;height:100dvh;padding:0 20px;pointer-events:none}
.home-page .home h1{font-size:clamp(46px,6.4vw,86px);transform:none;pointer-events:auto}
@media(max-width:700px){.home-page .home{height:100dvh;padding:0 18px}.home-page .home h1{font-size:clamp(26px,6.6vw,45px)}}
/* Final responsive headline scale and exact viewport centering. */
.home-page .home{display:block}
.home-page .home h1{position:absolute;top:50%;left:50%;width:max-content;max-width:calc(100vw - 56px);font-size:clamp(40px,5.2vw,70px);line-height:.9;transform:translate(-50%,-50%)}
@media(max-width:700px){.home-page .home h1{max-width:calc(100vw - 30px);font-size:clamp(30px,7.8vw,40px);line-height:.94}}

/* Keep the statement centered against the viewport itself. */
.home-page{height:100vh;height:100dvh}
.home-page header{z-index:20}
.home-page .home{
  position:fixed;
  inset:0;
  display:grid;
  place-items:center;
  width:100vw;
  height:100vh;
  height:100dvh;
  min-height:100vh;
  min-height:100dvh;
  padding:0 28px;
}
.home-page .home h1{
  position:static;
  top:auto;
  left:auto;
  width:max-content;
  max-width:100%;
  margin:0;
  transform:none;
}
@media(max-width:700px){
  .home-page .home{padding:0 15px}
}

/* Glass lives on its own layer so it never contains the fixed mobile menu. */
header{z-index:20;background:transparent}
header::before{
  content:"";
  position:absolute;
  inset:12px 24px;
  z-index:0;
  pointer-events:none;
  border:1px solid rgba(255,255,255,.58);
  border-radius:18px;
  background:rgba(238,236,233,.72);
  box-shadow:0 8px 28px rgba(80,68,59,.055),inset 0 1px 0 rgba(255,255,255,.45);
}
header .logo{position:relative;z-index:1}
header nav{z-index:1}
@supports ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  header::before{
    background:linear-gradient(120deg,rgba(255,255,255,.34),rgba(238,236,233,.2));
    -webkit-backdrop-filter:blur(20px) saturate(120%);
    backdrop-filter:blur(20px) saturate(120%);
  }
}
@media(max-width:700px){
  header::before{inset:12px 14px;border-radius:16px}
  header .logo{z-index:23}
  header nav{z-index:22;height:100vh;height:100dvh}
}
 .about .clients.marquee{display:block;overflow:hidden;width:calc(100% + 15vw);margin-left:-7.5vw;white-space:nowrap;mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
 .about .clients-track{display:flex;align-items:center;width:max-content;animation:client-marquee 34s linear infinite;will-change:transform}
 .about .clients-track img{flex:0 0 auto;width:clamp(115px,14vw,180px);height:82px;margin:0 30px;object-fit:contain;opacity:.72}
 @keyframes client-marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
 @media(max-width:700px){.about .clients.marquee{width:calc(100% + 14vw);margin-left:-7vw}.about .clients-track img{width:125px;height:72px;margin:0 18px}.about .clients-track{animation-duration:28s}}

/* About page editorial type system */
body:has(.about){background:#eeece9;color:#c9c1bd}
.about{padding:82px 6.5% 0;text-align:left;overflow:hidden}
.about h1,.about>p{font-family:Fraunces,Georgia,serif;font-weight:400;color:#c9c1bd;letter-spacing:-2.2px}
.about h1{font-size:clamp(48px,5.15vw,84px);line-height:.98;max-width:1180px;margin:0 0 80px}
.about>p{font-size:clamp(42px,4.15vw,68px);line-height:1.08;max-width:1180px;margin:0 0 105px}
.about em{font-style:italic}
.about .services{font-family:Arial,Helvetica,sans-serif;font-size:clamp(17px,1.45vw,24px);font-weight:400;line-height:2.2;letter-spacing:-.45px;color:#151515;max-width:1100px;margin:0 0 92px}
.about .clients.marquee{display:block;overflow:hidden;width:calc(100% + 13vw);margin-left:-6.5vw;white-space:nowrap;mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.about .clients-track{display:flex;align-items:center;width:max-content;animation:client-marquee 34s linear infinite;will-change:transform}
.about .clients-track img{flex:0 0 auto;width:clamp(115px,11vw,170px);height:66px;margin:0 34px;object-fit:contain;opacity:.58}
@media(max-width:700px){
 .about{padding:54px 6.8% 0}
 .about h1{font-size:clamp(37px,9.8vw,60px);line-height:1.03;letter-spacing:-1.25px;margin-bottom:74px}
 .about>p{font-size:clamp(30px,7.9vw,49px);line-height:1.12;letter-spacing:-.7px;margin-bottom:82px}
 .about .services{font-size:18px;line-height:2.65;letter-spacing:-.4px;margin-bottom:74px;max-width:100%}
 .about .clients.marquee{width:calc(100% + 14vw);margin-left:-7vw}
 .about .clients-track{animation-duration:28s}
 .about .clients-track img{width:125px;height:58px;margin:0 18px}
}

/* Consistent footer scale and bottom spacing across every page. */
body>footer{font-size:11px!important;line-height:14px!important;padding:32px 20px 34px!important;margin:0!important}
@media(max-width:700px){body>footer{padding:28px 20px 30px!important}}

/* Equal line boxes, padding and bottom anchor keep both labels aligned.
   Preserve the footer text's existing height: 52px desktop / 40px mobile. */
.home-page{--home-footer-bottom:44px}
.home-page>footer,.home-page>.motion-toggle{bottom:var(--home-footer-bottom);font-size:11px;line-height:14px;padding-top:8px!important;padding-bottom:8px!important}
@media(max-width:700px){.home-page{--home-footer-bottom:32px}}
@media(min-width:701px){.portfolio>.intro{max-width:none;width:100%}}
