/* Portfolio direction: quiet paper, architectural blue-grey, precise editorial type. */
:root{--paper:#f8f7f3;--ink:#202b2f;--blue:#456a7a;--orange:#a86c53;--line:#d6dbd8;--muted:#59676a;--night:#202b2f}
html{scroll-padding-top:82px}.home-page{background:var(--paper);color:var(--ink)}
.home-page .site-header{background:rgba(248,247,243,.94);border-color:#d9dedb}.home-page .nav{min-height:72px}.home-page .brand-mark{color:var(--ink)}.home-page .brand-dot{color:#a86c53}.home-page .nav-links a[aria-current]{color:var(--ink)}
.home-page .home-hero{width:min(100% - 100px,1260px);min-height:0;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(300px,.8fr);gap:clamp(45px,6vw,105px);align-items:center;padding:74px 0 90px}
.home-page .home-hero::after{bottom:28px;background:#d2d8d4}.home-page .hero-main{align-self:center;padding-block:10px}.home-page .hero-main .eyebrow{color:#456a7a;font-size:11px;letter-spacing:.17em}.home-page .hero-main h1{font-size:clamp(52px,5.55vw,82px);line-height:1.06;letter-spacing:-.065em;font-weight:500;max-width:780px;margin:28px 0 27px;color:#202b2f}.home-page .hero-main h1 span{color:#456a7a}.home-page .hero-main>p{font-size:19px;line-height:1.6;max-width:590px;color:#4d5a5c;margin-bottom:0}.home-page .hero-actions{margin-top:35px}.home-page .hero-actions .button{background:#223a43;border-color:#223a43;padding:16px 22px}.home-page .hero-actions .button:hover{background:#456a7a;border-color:#456a7a}.home-page .hero-actions .text-action{color:#26363b}.home-page .hero-footnote{display:flex;flex-wrap:wrap;gap:12px 26px;margin-top:65px;padding-top:16px;border-top:1px solid #d2d8d4;font-size:11px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:#637075}.home-page .hero-footnote span::before{content:'↗';color:#a86c53;margin-right:8px;font-size:12px}
.home-page .portrait-wrap{position:relative;display:block;width:min(100%,455px);max-width:none;margin:0;justify-self:end;align-self:center;padding:0;background:none}.home-page .portrait-wrap::before{content:'';position:absolute;inset:18px -18px -18px 18px;border:1px solid #b9c8cc;z-index:0}.home-page .portrait-wrap::after{content:none}.home-page .portrait{position:relative;z-index:1;width:100%;height:540px;aspect-ratio:auto;object-fit:cover;object-position:center 58%;filter:none;box-shadow:none;background:#d8e0e2}.home-page .portrait-wrap figcaption{position:relative;z-index:2;display:flex;justify-content:space-between;gap:20px;margin-top:15px;font-size:10px;letter-spacing:.13em;text-transform:uppercase;font-weight:700;color:#607077}
.home-page .work-section{background:#f2f4f1;color:var(--ink);padding:104px 0 120px}.home-page .work-intro{display:grid;grid-template-columns:1.2fr .8fr;gap:40px;align-items:end}.home-page .work-intro .eyebrow{grid-column:1/-1;color:#55717d}.home-page .work-intro h2{font-size:clamp(48px,5vw,72px);font-weight:500;line-height:1.07;letter-spacing:-.055em;margin:0}.home-page .work-intro>p{font-size:17px;color:#58676a;line-height:1.55;max-width:460px;margin:0 0 5px}.home-page .work-section .accent-dot{color:#a86c53}
.home-page .work-index{display:grid;grid-template-columns:100px repeat(4,1fr);margin:46px 0 28px;border-top:1px solid #cbd3d0;border-bottom:1px solid #cbd3d0;align-items:stretch}.home-page .work-index>span{display:flex;align-items:center;font-size:11px;text-transform:uppercase;letter-spacing:.12em;font-weight:700;color:#667477}.home-page .work-index a{display:flex;align-items:center;gap:10px;padding:19px 12px;border-left:1px solid #cbd3d0;text-decoration:none;font-size:13px;font-weight:600;color:#2a3b40;transition:background .2s,color .2s}.home-page .work-index a:hover,.home-page .work-index a:focus-visible{background:#e4ebe9;color:#274f5e}.home-page .work-index b{font-size:10px;color:#76898e;letter-spacing:.06em}
.home-page .work-group{padding:54px 0 74px;border-bottom:1px solid #cbd3d0;scroll-margin-top:72px}.home-page .work-group:last-child{border-bottom:0;padding-bottom:0}.home-page .work-group-heading{display:grid;grid-template-columns:100px 1fr;gap:22px;align-items:start;margin-bottom:30px}.home-page .work-group-number{font-size:12px;font-weight:700;letter-spacing:.1em;color:#73888e;padding-top:8px}.home-page .work-group-heading h3{font-size:clamp(29px,3vw,43px);line-height:1.13;font-weight:500;letter-spacing:-.05em;margin:0 0 7px}.home-page .work-group-heading p{font-size:15px;color:#647174;margin:0}.home-page .work-group-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:44px 30px}.home-page .work-group-cards .work-card{color:var(--ink)}.home-page .work-group-cards .work-card-art{height:clamp(250px,26vw,360px);border:1px solid #d6deda;background:#e3e8e7}.home-page .work-group-cards .work-card-art img{width:100%;height:100%;object-fit:cover;filter:saturate(.93)}.home-page .work-group-cards .work-card-info{padding-top:16px}.home-page .work-group-cards .work-card-info .eyebrow{color:#607276;font-size:10px}.home-page .work-group-cards .work-card-title{margin:9px 0 7px}.home-page .work-group-cards .work-card-title h3{font-size:clamp(27px,2.5vw,37px);color:var(--ink)}.home-page .work-group-cards .work-card-title>span{color:#607f88}.home-page .work-group-cards .work-card-info p{color:#58666a;font-size:15px;line-height:1.5}.home-page .work-group-cards .card-index{display:none}.home-page #product-ux .work-card:nth-child(3){grid-column:1/-1;display:grid;grid-template-columns:1.1fr .9fr;align-items:center;gap:30px;border-top:1px solid #d0d7d3;padding-top:32px}.home-page #product-ux .work-card:nth-child(3) .work-card-art{height:300px}.home-page #creative-code .work-group-cards{grid-template-columns:1fr}.home-page #creative-code .work-card{display:grid;grid-template-columns:1.1fr .9fr;align-items:center;gap:30px}.home-page #creative-code .work-card-art{height:340px}
.home-page .approach-section{background:#fff;padding-block:112px}.home-page .approach-section .section-top h2,.home-page .about-section h2{color:var(--ink)}.home-page .approach-grid>div{border-color:#d2d9d6}.home-page .pm-note{background:#edf1ef;border-left:2px solid #577783}.home-page .about-section{background:#e9eeed}.home-page .about-layout p{color:#4f5c5d}.home-page .about-links a{color:#263a40}
.home-page .footer{background:#22343b}
@media(max-width:1000px){.home-page .home-hero{gap:38px}.home-page .hero-main h1{font-size:clamp(48px,6vw,68px)}.home-page .portrait{height:480px}.home-page .work-index{grid-template-columns:85px repeat(4,1fr)}.home-page .work-index a{font-size:12px;padding-inline:8px}}
@media(max-width:720px){html{scroll-padding-top:64px}.home-page .home-hero{width:min(100% - 36px,1260px);grid-template-columns:1fr;gap:35px;padding:52px 0 80px}.home-page .home-hero::after{bottom:25px}.home-page .hero-main h1{font-size:clamp(49px,12vw,68px);margin:19px 0 20px}.home-page .hero-main>p{font-size:17px}.home-page .hero-actions{margin-top:27px}.home-page .hero-footnote{margin-top:36px;gap:9px 18px}.home-page .portrait-wrap{width:min(100% - 15px,420px);justify-self:start}.home-page .portrait{height:auto;aspect-ratio:4/5}.home-page .portrait-wrap::before{inset:12px -12px -12px 12px}.home-page .work-section{padding:72px 0 88px}.home-page .work-intro{grid-template-columns:1fr;gap:15px}.home-page .work-intro .eyebrow{grid-column:auto}.home-page .work-intro h2{font-size:clamp(44px,11vw,58px)}.home-page .work-intro>p{font-size:15px}.home-page .work-index{display:flex;overflow-x:auto;gap:0;margin:32px 0 8px;scrollbar-width:thin;white-space:nowrap}.home-page .work-index>span{min-width:80px}.home-page .work-index a{min-width:max-content;padding:16px 17px;font-size:12px}.home-page .work-group{padding:43px 0 52px}.home-page .work-group-heading{grid-template-columns:42px 1fr;gap:7px}.home-page .work-group-heading h3{font-size:31px}.home-page .work-group-cards{grid-template-columns:1fr;gap:37px}.home-page .work-group-cards .work-card-art{height:auto;aspect-ratio:1.35}.home-page #product-ux .work-card:nth-child(3),.home-page #creative-code .work-card{display:block;grid-column:auto;padding-top:0;border-top:0}.home-page #product-ux .work-card:nth-child(3) .work-card-art,.home-page #creative-code .work-card-art{height:auto;aspect-ratio:1.35}.home-page .approach-section{padding-block:78px}}
@media(max-width:390px){.home-page .hero-main h1{font-size:47px}.home-page .hero-footnote{font-size:10px}.home-page .portrait{aspect-ratio:1/1.23}}
@media(prefers-reduced-motion:reduce){.home-page .work-index a{transition:none}}
@media(max-width:720px){.home-page .work-index{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));overflow:visible;white-space:normal}.home-page .work-index>span{grid-column:1/-1;min-width:0;padding:12px 0}.home-page .work-index a{min-width:0;border-top:1px solid #cbd3d0;padding:14px 10px;font-size:11px;line-height:1.3}.home-page .work-index a:nth-of-type(odd){border-left:0}}
/* Case-study covers are presented square to the page, at their full proportions. */
.case-page .case-hero-wrap .back-link{padding-top:28px}
.case-page .case-hero{grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);column-gap:clamp(44px,5.4vw,82px);row-gap:34px;align-items:start;padding:43px 0 38px;min-height:0}
.case-page .case-hero-copy{padding-top:clamp(13px,2.1vw,32px)}
.case-page .case-hero-copy .eyebrow{font-size:10px;line-height:1.5;letter-spacing:.14em;opacity:.72}
.case-page .case-hero h1{font-size:clamp(55px,5.5vw,78px);line-height:1.04;letter-spacing:-.06em;margin:16px 0 22px;max-width:600px}
.case-page .case-lead{font-size:clamp(18px,1.52vw,21px);line-height:1.55;letter-spacing:-.015em;max-width:560px;margin:0;color:color-mix(in srgb,var(--case-ink) 86%,#fff)}
.case-page .case-hero-art{width:100%;margin:0;padding:0;background:none;border:0;box-shadow:none;transform:none}
.case-page .case-hero-art-inner{aspect-ratio:1.5;display:flex;align-items:center;justify-content:center;overflow:hidden;border:1px solid color-mix(in srgb,var(--case-ink) 15%,transparent);background:color-mix(in srgb,var(--case-surface) 60%,white)}
.case-page .case-hero-art-inner img{display:block;width:100%;height:100%;object-fit:contain;object-position:center;filter:none}
.case-page .case-art-label{position:static;display:block;padding-top:12px;left:auto;bottom:auto;font-size:10px;letter-spacing:.13em;color:color-mix(in srgb,var(--case-ink) 75%,#fff)}
.case-page .case-hero-detail{padding-top:17px;gap:24px}
.case-page .case-facts{gap:14px 32px}
/* Category names start at the same left edge as their project images. */
.home-page .work-group-heading{display:block;margin-bottom:30px}
.home-page .work-group-number{display:block;padding:0;margin-bottom:11px}
.home-page .work-group-heading h3{margin:0 0 7px}
@media(max-width:850px){.case-page .case-hero{column-gap:34px}.case-page .case-hero h1{font-size:clamp(48px,6vw,64px)}.case-page .case-lead{font-size:18px}}
@media(max-width:700px){.case-page .case-hero{grid-template-columns:1fr;gap:25px;padding:26px 0 42px}.case-page .case-hero-copy{padding-top:0}.case-page .case-hero h1{font-size:clamp(49px,11vw,66px);margin:11px 0 15px}.case-page .case-lead{font-size:17px;line-height:1.52}.case-page .case-hero-art{width:100%}.case-page .case-hero-art-inner{aspect-ratio:1.45}.case-page .case-hero-detail{padding-top:18px}.home-page .work-group-heading{margin-bottom:23px}.home-page .work-group-number{margin-bottom:8px}}
/* Four legacy cover exports are square; show the full designed canvas. */
.case-page .theme-spinex .case-hero-art-inner,.case-page .theme-squadsizzle .case-hero-art-inner,.case-page .theme-ommihub .case-hero-art-inner,.case-page .theme-ice-fire .case-hero-art-inner{aspect-ratio:1;max-width:500px;margin-inline:auto}
.case-page .theme-spinex .case-art-label,.case-page .theme-squadsizzle .case-art-label,.case-page .theme-ommihub .case-art-label,.case-page .theme-ice-fire .case-art-label{max-width:500px;margin-inline:auto}
@media(max-width:700px){.case-page .theme-spinex .case-hero-art-inner,.case-page .theme-squadsizzle .case-hero-art-inner,.case-page .theme-ommihub .case-hero-art-inner,.case-page .theme-ice-fire .case-hero-art-inner{max-width:none}.case-page .theme-spinex .case-art-label,.case-page .theme-squadsizzle .case-art-label,.case-page .theme-ommihub .case-art-label,.case-page .theme-ice-fire .case-art-label{max-width:none}}
/* Small, explicit software markers below each case introduction. */
.case-page .case-tools{margin-top:27px;max-width:570px}
.case-page .case-tools-label{display:block;margin-bottom:10px;color:color-mix(in srgb,var(--case-ink) 68%,#fff);font-size:10px;font-weight:800;letter-spacing:.15em;text-transform:uppercase}
.case-page .tool-list{display:flex;flex-wrap:wrap;gap:8px}
.case-page .tool-chip{display:inline-flex;align-items:center;gap:8px;min-height:34px;padding:5px 10px 5px 6px;border:1px solid color-mix(in srgb,var(--case-ink) 19%,transparent);background:color-mix(in srgb,var(--case-surface) 69%,white);color:var(--case-ink);font-size:11px;font-weight:650;line-height:1.2;white-space:nowrap}
.case-page .tool-icon{display:grid;place-items:center;width:22px;height:22px;background:#fff;flex:none}
.case-page .tool-icon img{display:block;width:16px;height:16px;object-fit:contain}
@media(max-width:700px){.case-page .case-tools{margin-top:20px}.case-page .tool-list{gap:7px}.case-page .tool-chip{font-size:10px}}
/* Green Justice Africa: a complete, quietly framed brand presentation. */
.gj-page{background:#f8f7f3;color:#1e322c;padding:0 0 80px}
.gj-opening{display:grid;grid-template-columns:minmax(170px,.35fr) minmax(0,1fr);gap:48px;padding-top:110px;padding-bottom:76px;border-bottom:1px solid #cbd5cd}
.gj-opening .eyebrow{color:#627a70}
.gj-opening h2{max-width:860px;margin:0 0 25px;font-size:clamp(44px,5.4vw,80px);font-weight:500;line-height:1.05;letter-spacing:-.065em}
.gj-opening p{max-width:700px;margin:0 0 13px;font-size:17px;line-height:1.65;color:#455d52}
.gj-opening .gj-disclaimer{font-size:13px;color:#6d7d74}
.gj-feature{padding-top:76px;padding-bottom:70px}
.gj-frame{margin:0;background:#f1f2ed}
.gj-frame a{display:block;line-height:0}
.gj-frame img{display:block;width:100%;height:auto;object-fit:contain}
.gj-frame figcaption{padding:11px 0 0;color:#617467;font-size:11px;font-weight:650;letter-spacing:.06em;text-transform:uppercase;background:#f8f7f3}
.gj-section{padding-top:76px;padding-bottom:76px;border-top:1px solid #cbd5cd}
.gj-section-heading{display:grid;grid-template-columns:200px minmax(0,1fr) minmax(220px,.7fr);gap:28px;align-items:start;margin-bottom:45px}
.gj-section-heading>span{padding-top:10px;color:#5e786b;font-size:11px;font-weight:800;letter-spacing:.13em;text-transform:uppercase}
.gj-section-heading h2{margin:0;font-size:clamp(36px,4.3vw,62px);font-weight:500;line-height:1.08;letter-spacing:-.055em}
.gj-section-heading p{margin:7px 0 0;color:#52675b;font-size:16px;line-height:1.65}
.gj-duo{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.gj-guide-pages{display:grid;gap:16px;max-width:1100px;margin-inline:auto}
.gj-guide-pages .gj-frame{box-shadow:0 0 0 1px #dce3db}
.gj-download{display:flex;justify-content:space-between;gap:15px;max-width:1100px;margin:29px auto 0;padding:22px 0;border-top:1px solid #b6c8bd;border-bottom:1px solid #b6c8bd;color:#1f5037;text-decoration:none;font-size:16px;font-weight:700}
.gj-download:hover{text-decoration:underline}
.gj-poster-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.gj-poster-grid .gj-frame{background:#dee8dd}
.gj-motion video{display:block;width:min(100%,1100px);margin-inline:auto;background:#152d24;aspect-ratio:16/9;object-fit:contain}
.gj-end{display:flex;justify-content:space-between;gap:25px;padding-top:32px;border-top:1px solid #cbd5cd;color:#607467;font-size:13px}
.gj-end p{margin:0}.gj-end>div{display:flex;flex-wrap:wrap;gap:14px 30px}.gj-end a{color:#1f5037;font-weight:700;text-decoration:none}.gj-end a:hover{text-decoration:underline}
@media(max-width:900px){.gj-section-heading{grid-template-columns:1fr 1.3fr;gap:18px}.gj-section-heading>span{grid-column:1/-1}.gj-poster-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.gj-page{padding-bottom:55px}.gj-opening{grid-template-columns:1fr;gap:15px;padding-top:65px;padding-bottom:45px}.gj-opening h2{font-size:clamp(43px,10vw,61px)}.gj-opening p{font-size:15px}.gj-feature{padding-top:38px;padding-bottom:45px}.gj-section{padding-top:48px;padding-bottom:50px}.gj-section-heading{display:block;margin-bottom:27px}.gj-section-heading>span{display:block;margin-bottom:16px}.gj-section-heading h2{font-size:clamp(38px,10vw,52px)}.gj-section-heading p{font-size:15px;margin-top:18px}.gj-duo{grid-template-columns:1fr}.gj-guide-pages{gap:7px}.gj-poster-grid{gap:7px}.gj-end{display:block}.gj-end>div{margin-top:20px}.gj-download{font-size:14px}}