/* Homepage editorial system. Case studies and About keep their own styles. */
@font-face{font-family:HomeSans;src:url('./assets/Geist-variable.ttf') format('truetype');font-style:normal;font-weight:100 900;font-display:swap}
@font-face{font-family:HomeMeraki;src:url('./assets/merakitrial-regular.otf') format('opentype');font-style:normal;font-weight:400;font-display:swap}
body:not(.about-page){--home-blue:#1b4c78;--home-muted:#557da3;--home-line:#dce9f4;--home-width:1320px;--home-gutter:max(48px,calc((100vw - var(--home-width))/2));--home-serif:HomeMeraki,Georgia,'Times New Roman',serif;background:#fff;color:var(--home-blue);font-family:HomeSans,Montreal,Arial,sans-serif;font-weight:400}
body:not(.about-page) main{overflow:clip}
.hero{position:relative;isolation:isolate;min-height:760px;height:100svh;max-height:1400px;margin:0;border:0;border-radius:0;display:flex;align-items:center;padding:132px var(--home-gutter) 116px;background:#e6f3fc;color:var(--home-blue)}
.hero .hero-photo{position:absolute;inset:0;overflow:hidden;z-index:-2;will-change:auto;background:#e6f3fc}
.hero .hero-photo img[data-hero-image]{position:absolute;inset:-4%;width:108%;height:108%;max-width:none;object-fit:cover;object-position:center;mask:none;translate:none;transform:none;animation:none}
.hero .hero-photo:after{display:none}
/* Match the reference hero's soft fade into the white section below. */
.hero:after{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(to bottom,rgba(255,255,255,.04) 0%,rgba(255,255,255,0) 30%,rgba(255,255,255,0) 82%,rgba(255,255,255,.55) 94%,#fff 100%)}
.hero .hero-silk{position:absolute;inset:0;width:100%;height:100%;display:block;pointer-events:none;opacity:0}
.hero .hero-photo.silk-ready .hero-silk{opacity:1}
.hero .hero-photo.silk-ready img[data-hero-image]{opacity:0}
.hero-guides{position:absolute;inset:0 var(--home-gutter);z-index:-1;pointer-events:none;border-inline:1px solid #ffffff50;background-image:repeating-linear-gradient(90deg,transparent 0,transparent calc(25% - 1px),#ffffff40 calc(25% - 1px),#ffffff40 25%)}
.hero .topbar{padding:24px var(--home-gutter);color:var(--home-blue)}
.hero .brand{font-size:18px;letter-spacing:-.025em}
.hero .brand-window{height:24px;line-height:24px}
.hero .brand-second{font-size:16px}
.hero .desktop-nav{gap:40px}
.hero .nav-link{font-size:18px;padding:7px 0;background:none}
.hero .nav-link:hover{background:none}
.hero-copy{width:100%;max-width:1320px}
.hero-kicker{font-size:14px;letter-spacing:.01em;margin-bottom:24px}
.hero-title{font-family:var(--home-serif);font-size:clamp(66px,8vw,116px);font-weight:400;line-height:.9;letter-spacing:-.04em;color:#27517e;text-shadow:0 2px 0 #e8f5ffb3;text-wrap:balance}
.hero-intro{font-size:20px;line-height:1.4;letter-spacing:-.025em;max-width:620px;margin-top:34px;text-wrap:pretty}
.hero-ctas{display:flex;gap:24px;align-items:center;margin-top:26px}
.editorial-link{display:inline-flex;align-items:center;justify-content:center;min-height:44px;font-size:18px;line-height:1.3;color:var(--home-blue);transition:background .2s,color .2s;text-align:left}
.hero-ctas .editorial-link:last-child{padding:10px 14px;background:#ffffff7d}
.editorial-link:hover{color:#153858;background:#e8f3fc}
.hero-foot{position:absolute;left:var(--home-gutter);right:var(--home-gutter);bottom:28px;display:flex;justify-content:space-between;align-items:center;font-size:14px;color:var(--home-muted)}
/* Updated Figma logos; preserve the supplied artwork and negative spaces. */
.company-logos{--logo-scale:.48;background:#fff;padding:42px 0;border-bottom:1px solid var(--home-line)}
.company-logo-track{animation-duration:40s}
.company-logo-group{gap:50px;padding-right:50px}
.company-logo-art{filter:brightness(0);color:#000}
.company-logos.figma-logos .company-logo-art{filter:none}
/* Broad, gradual fades at both edges of the moving logo strip. */
.company-logos.figma-logos{--logo-fade-width:clamp(64px,16vw,240px)}
.company-logos.figma-logos .company-logo-window{-webkit-mask-image:linear-gradient(to right,transparent 0,rgba(0,0,0,.2) calc(var(--logo-fade-width) * .45),#000 var(--logo-fade-width),#000 calc(100% - var(--logo-fade-width)),rgba(0,0,0,.2) calc(100% - var(--logo-fade-width) * .45),transparent 100%);mask-image:linear-gradient(to right,transparent 0,rgba(0,0,0,.2) calc(var(--logo-fade-width) * .45),#000 var(--logo-fade-width),#000 calc(100% - var(--logo-fade-width)),rgba(0,0,0,.2) calc(100% - var(--logo-fade-width) * .45),transparent 100%)}
.company-logo-toggle{background:#fff;color:#000;border-color:#d3dce4;right:20px;bottom:10px}
/* Shared vertical grid aligns the About and Work sections. */
.intro.section-wrap,.work.section-wrap{position:relative;margin:0;padding-inline:var(--home-gutter);background:#fff}
.intro.section-wrap:before,.work.section-wrap:before{content:'';position:absolute;inset:0 var(--home-gutter);pointer-events:none;border-inline:1px solid var(--home-line);background-image:repeating-linear-gradient(90deg,transparent 0,transparent calc(25% - 1px),#e7eff7 calc(25% - 1px),#e7eff7 25%)}
.intro.section-wrap>* ,.work.section-wrap>*{position:relative}
.intro.section-wrap{display:grid;grid-template-columns:1fr 1fr;gap:64px;padding-block:112px 120px}
.intro .eyebrow{color:var(--home-muted);font-size:13px;text-transform:none;letter-spacing:0;margin-bottom:24px}
.intro-heading{font-family:var(--home-serif);font-size:clamp(40px,4.5vw,64px);line-height:1.08;letter-spacing:-.035em;max-width:540px}
.intro-aside{padding-top:40px}
.intro-aside p{max-width:600px;font-size:18px;line-height:1.6;letter-spacing:-.02em}
.intro-actions{display:flex;align-items:center;flex-wrap:wrap;gap:14px 26px;margin-top:26px}

.work.section-wrap{padding-top:28px;padding-bottom:100px}
.work-label{display:flex;align-items:flex-start;gap:24px;padding:0 0 72px;color:var(--home-blue)}
.work-label h2{font-family:var(--home-serif);font-size:48px;line-height:1;letter-spacing:-.035em}
.work-label p{font-size:18px;line-height:1.4;max-width:610px;color:var(--home-muted)}
.work-count{margin-left:auto;color:var(--home-muted);padding-top:8px}
.project-list,.archive-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:24px;row-gap:64px}
.project-card{display:block;min-width:0;color:var(--home-blue);background:none;border:0;border-radius:0;overflow:visible;aspect-ratio:auto;text-align:left}
.project-card-media{aspect-ratio:3/2;width:100%;overflow:hidden;background:#f0f5fa}
.project-card-image{display:block;position:static;width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.22,1,.36,1)}
.project-card-panel{position:static;display:flex;align-items:baseline;justify-content:space-between;gap:18px;padding:16px 0 0;border:0;border-radius:0;backdrop-filter:none;background:none;max-width:none}
.project-card-panel h3{font-family:var(--home-serif);font-size:clamp(23px,2vw,30px);font-weight:400;line-height:1.17;letter-spacing:-.025em;max-width:75%;margin:0;text-wrap:pretty}
.project-card-meta{color:var(--home-muted);font-size:11px;line-height:1.4;letter-spacing:.06em;text-transform:uppercase;text-align:right;max-width:24ch;flex-shrink:1}
.project-card:hover .project-card-image,.project-card:focus-visible .project-card-image{transform:scale(1.035)}
.project-card:hover h3{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px}
.project-card:focus-visible{outline:2px solid var(--home-blue);outline-offset:7px}
.work-more{padding-top:50px}

.work-more .work-note{color:var(--home-muted)}
.work-preview,.project-ribbon{display:none!important}
.archive-content{color:#1b4c78}
.archive-grid .project-card-panel{gap:12px}
.archive-grid .project-card-panel h3{font-size:27px}
@media(hover:hover){.company-logos:hover .company-logo-track{animation-play-state:running}.company-logos.paused:hover .company-logo-track{animation-play-state:paused}}
@media(max-width:1024px){body:not(.about-page){--home-gutter:48px}.hero{min-height:700px}.hero-title{font-size:clamp(62px,8.4vw,86px)}.intro.section-wrap{gap:40px}.project-card-panel{flex-direction:column;gap:8px}.project-card-panel h3{max-width:100%}.project-card-meta{text-align:left;max-width:none}}
@media(max-width:700px){
 body:not(.about-page){--home-gutter:24px}
 .hero{min-height:690px;height:100svh;max-height:none;padding:140px var(--home-gutter) 110px;align-items:center}
 .hero .topbar{padding:24px var(--home-gutter);align-items:flex-start;flex-wrap:wrap;gap:14px}
 .hero .brand{font-size:15px}
 .hero .desktop-nav{display:flex;gap:20px;margin-left:auto}
 .hero .nav-link{font-size:14px;padding:5px 0}
 .hero .mobile-menu{display:none}
 .hero .brand-second{font-size:14px}
 .hero-title{font-size:clamp(46px,9.1vw,64px);line-height:1.02;letter-spacing:-.045em}
 .hero-kicker{font-size:12px;margin-bottom:24px}
 .hero-intro{font-size:17px;line-height:1.5;margin-top:28px;max-width:480px}
 .hero-ctas{margin-top:22px;gap:22px}
 .hero-foot{font-size:12px;bottom:26px}
 .editorial-link{font-size:16px}
 .company-logos{--logo-scale:.36;padding:30px 0}
 .company-logo-track{animation-duration:40s}
 .intro.section-wrap{grid-template-columns:1fr;gap:28px;padding-block:72px 76px}
 .intro-heading{font-size:42px;max-width:500px}
 .intro-aside{padding-top:0}
 .intro-aside p{font-size:17px}
 .intro .eyebrow{margin-bottom:18px}
 .work.section-wrap{padding-bottom:70px}
 .work-label{gap:16px;flex-wrap:wrap;padding-bottom:34px}
 .work-label h2{font-size:40px}
 .work-label p{font-size:16px;flex-basis:calc(100% - 120px)}
 .work-count{display:none}
 .project-list,.archive-grid{grid-template-columns:minmax(0,1fr);row-gap:40px}
 .project-card-panel{flex-direction:row;gap:20px;padding-top:14px}
 .project-card-panel h3{font-size:24px;max-width:72%}
 .project-card-meta{font-size:10px;max-width:16ch;text-align:right}
 .intro.section-wrap:before,.work.section-wrap:before{background-size:100% 100%;background-image:none}
 .work-more{padding-top:34px}
}
@media(max-width:390px){.hero .topbar{flex-wrap:wrap;gap:16px}.hero .desktop-nav{margin-left:auto}.hero-title{font-size:43px}.hero-intro{font-size:16px}.project-card-panel{flex-direction:column;gap:8px}.project-card-panel h3{max-width:100%}.project-card-meta{max-width:none;text-align:left}}
@media(prefers-reduced-motion:reduce){.hero .hero-photo img[data-hero-image]{animation:none;transform:none}.project-card-image{transition:none}.project-card:hover .project-card-image{transform:none}}

@media(prefers-reduced-motion:reduce){.company-logos.figma-logos .company-logo-window{-webkit-mask-image:none;mask-image:none}}

/* Continue the About grid guides through the Work section. */
.work.section-wrap:before{display:block}

/* Reference capsule buttons: shared by resume download and the work archive. */
.intro-actions .reference-pill,.work-more .reference-pill{position:relative;display:inline-flex;align-items:center;justify-content:center;isolation:isolate;overflow:hidden;min-height:70px;max-width:100%;padding:0 38px;gap:8px;border:1px solid #c9c9cb;border-radius:999px;background:#fff;color:#1c1d20;font-family:Montreal,Arial,sans-serif;font-size:16px;font-weight:400;line-height:1.3;transition:color .4s,border-color .4s}
.reference-pill>span,.reference-pill>sup{position:relative;z-index:1}
.reference-pill:before{background:#455ce9}
.intro-actions .reference-pill:hover,.work-more .reference-pill:hover{color:#fff;border-color:#455ce9}
.reference-pill:hover sup{color:#fff}
.reference-pill:focus-visible{outline:2px solid #455ce9;outline-offset:5px}
@media(max-width:700px){.intro-actions .reference-pill,.work-more .reference-pill{min-height:64px;padding-inline:30px}}