:root{--black:#171717;--ink:#222;--mid:#686868;--line:#d7d7d7;--paper:#fff;--soft:#f0f0f0;--serif:Georgia,'Times New Roman',serif;--sans:Arial,Helvetica,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#fff;color:var(--ink);font-family:var(--sans);line-height:1.55}a{color:inherit;text-decoration:none}.topbar{position:sticky;top:0;z-index:10;display:flex;align-items:center;justify-content:space-between;padding:15px max(5vw,24px);background:var(--black);color:#fff}.wordmark{font-family:var(--serif);font-size:25px;letter-spacing:-2px;color:#fff}.wordmark span{color:#aaa}.nav-links{display:flex;gap:28px}.nav-links a,.menu-toggle{font-size:10px;letter-spacing:1px}.nav-links a:hover,.footer-bottom a:hover{opacity:.65}.menu-toggle{display:none;color:#fff;background:none;border:0}.section-wrap{width:min(1120px,90%);margin:0 auto}.hero{display:grid;grid-template-columns:1fr 1fr;min-height:540px;padding:42px 0;gap:clamp(28px,6vw,80px);align-items:center}.hero-photo{height:470px;background:#e8e8e8;overflow:hidden}.hero-photo img{width:100%;height:100%;object-fit:cover;object-position:center 34%;filter:none}.hero-copy{padding:20px 0}.eyebrow{font-size:10px;letter-spacing:1.8px;font-weight:700;color:#777;margin:0 0 20px}.hero h1,.section-heading-row h2,.clients h2,.manifesto h2,.ai-section h2,.how-work h2,.background-section h2,footer h2{font-family:var(--serif);font-weight:400;letter-spacing:-1.5px;line-height:.98;margin:0}.hero h1{font-size:clamp(58px,8vw,100px);line-height:.9;color:#111}.hero-subtitle{font-family:var(--serif);font-size:clamp(22px,3vw,32px);margin:18px 0}.intro,.section-intro{font-size:15px;color:#555;max-width:440px}.text-link,.contact-link{display:inline-flex;gap:22px;align-items:center;margin-top:26px;padding-bottom:8px;border-bottom:1px solid #222;font-size:10px;font-weight:700;letter-spacing:1px}.text-link span,.contact-link span{font-size:18px}.statement{padding:62px 0 70px;border-top:1px solid var(--line)}.statement h2{font-size:clamp(36px,6vw,68px);font-family:var(--serif);font-weight:400;line-height:1.05;letter-spacing:-1.5px;margin:0}.career-section{background:#171717;color:#fff;padding:70px 0 75px}.muted{color:#aaa}.section-heading-row{display:flex;justify-content:space-between;align-items:end;gap:40px}.section-heading-row h2,.clients h2,.ai-section h2,.background-section h2{font-size:clamp(36px,5vw,58px)}.section-heading-row>p{max-width:300px;color:#bdbdbd;font-size:13px;margin-bottom:4px}.timeline{display:grid;grid-template-columns:repeat(5,minmax(125px,1fr));gap:0;margin:46px 0 0;overflow-x:auto;padding-bottom:12px}.timeline-stop{position:relative;text-align:left;min-width:125px;background:none;border:0;color:#aaa;padding:0 12px 18px 0;cursor:pointer;font-family:var(--sans)}.timeline-stop:before{content:"";display:block;height:1px;background:#555;margin:0 0 17px;transition:background .2s}.timeline-stop:after{content:"";position:absolute;top:-4px;left:0;width:8px;height:8px;border-radius:50%;background:#777;border:1px solid #171717}.timeline-stop.active{color:#fff}.timeline-stop.active:before{height:2px;background:#fff}.timeline-stop.active:after{background:#fff;box-shadow:0 0 0 3px #555}.stop-number,.stop-name,.stop-date{display:block}.stop-number{font-size:10px;letter-spacing:1px;margin-bottom:8px}.stop-name{font-family:var(--serif);font-size:19px;line-height:1.1;margin-bottom:7px}.stop-date{font-size:11px;color:#aaa}.timeline-detail{background:#fff;color:#222;padding:clamp(22px,4vw,42px);max-width:850px;margin-top:12px}.detail-top{display:flex;justify-content:space-between;gap:20px}.detail-company,.detail-date{font-size:10px;letter-spacing:1.2px;color:#777;margin:0}.timeline-detail h3{font-family:var(--serif);font-size:clamp(28px,4vw,42px);font-weight:400;line-height:1.05;letter-spacing:-.5px;margin:22px 0 14px}.timeline-detail>p:not(.detail-company):not(.detail-date){max-width:650px;color:#555;font-size:14px}.skill-list{display:flex;flex-wrap:wrap;gap:8px;margin:22px 0}.skill-list span{border:1px solid #ccc;border-radius:30px;padding:6px 10px;font-size:10px}.impact{border-top:1px solid #ddd;margin-top:24px;padding-top:18px}.impact .eyebrow{margin-bottom:8px}.impact>p:last-child{font-size:13px;margin:0}.career-throughline{font-family:var(--serif);font-size:clamp(24px,4vw,38px);max-width:650px;margin:42px 0 0}.clients{padding:76px 0}.clients h2{margin-bottom:16px}.section-intro{max-width:600px}.client-groups{margin-top:36px}.client-group{padding:25px 0;border-top:1px solid var(--line)}.group-heading{display:flex;align-items:baseline;justify-content:space-between;gap:15px;margin-bottom:18px}.group-heading h3{font-family:var(--serif);font-size:22px;font-weight:400;margin:0}.group-heading p{font-size:11px;color:#777;margin:0}.logo-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.client-logo{display:flex;align-items:center;justify-content:center;text-align:center;min-height:84px;padding:12px;background:#f3f3f3;color:#202020;font-weight:700;font-size:clamp(12px,1.5vw,19px);letter-spacing:-.4px;filter:none}.baygon{font-style:italic}.clover{font-family:var(--serif);font-size:25px}.bci{font-size:28px;letter-spacing:3px}.fnb{font-weight:900;font-size:28px;letter-spacing:-2px}.save{font-size:12px;letter-spacing:1px}.coke{font-family:var(--serif);font-style:italic;font-size:25px}.powerade{letter-spacing:2px;font-style:italic}.investec{letter-spacing:2px;font-size:15px}.mancosa{letter-spacing:1px}.velux{letter-spacing:2px;font-size:24px}.swarovski{letter-spacing:1px;font-size:14px}.avene{font-family:var(--serif);font-size:27px}.tih{font-size:28px;letter-spacing:2px}.skin-cupid{font-size:14px;letter-spacing:1px}.clear{font-weight:400;font-size:17px}.butlins{font-family:var(--serif);font-size:25px}.klira{letter-spacing:3px}.allbright{font-family:var(--serif);font-size:23px}.salt-lake{font-size:12px;letter-spacing:1px}.wvh{font-size:12px;letter-spacing:1px}.client-note,.disclaimer{font-size:11px;color:#777}.client-note{margin:12px 0 0}.disclaimer{margin-top:28px}.manifesto{background:#ededed;padding:76px 0}.manifesto-inner{max-width:900px}.quote-mark{font-family:var(--serif);font-size:80px;line-height:.6;color:#bbb;margin:28px 0 15px}.manifesto h2{font-size:clamp(39px,6vw,72px)}.quote-body{font-family:var(--serif);font-size:clamp(20px,3vw,30px);max-width:680px;line-height:1.3;margin:28px 0}.manifesto-rule{height:1px;background:#bbb;max-width:160px;margin:30px 0}.manifesto-support{max-width:540px;color:#555;font-size:14px}.ai-section{padding:76px 0}.ai-section h2{max-width:850px}.ai-section>.section-intro{font-size:16px;margin:24px 0 38px}.principles-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}.principles-grid article{border-top:1px solid #222;padding-top:15px}.principles-grid article>span{font-size:10px;color:#777}.principles-grid h3,.working-principles h3,.background-facts h3{font-size:16px;margin:17px 0 8px}.principles-grid p,.working-principles p,.background-facts p{font-size:13px;color:#666;margin:0}.how-work{background:#171717;color:#fff;padding:70px 0}.how-inner{display:grid;grid-template-columns:.8fr 1.2fr;column-gap:70px}.how-inner>.eyebrow{grid-column:1/-1}.how-work h2{font-size:clamp(42px,6vw,70px)}.working-principles{display:grid;grid-template-columns:1fr 1fr;gap:26px}.working-principles article{border-top:1px solid #555;padding-top:10px}.working-principles h3{color:#fff}.working-principles p{color:#bbb}.background-section{padding:70px 0}.background-section h2{margin-bottom:34px}.background-facts{display:grid;grid-template-columns:1fr 1fr;gap:24px}.background-facts>div{display:flex;align-items:center;gap:16px}.fact-icon{display:flex;align-items:center;justify-content:center;width:58px;height:58px;border:1px solid #aaa;font-size:12px;font-weight:700}.background-facts h3{margin:0 0 5px}footer{background:#171717;color:#fff;padding:65px 0 24px}.footer-inner>h2{font-size:clamp(48px,8vw,88px)}.footer-inner>p:not(.eyebrow){color:#bbb}.contact-link{border-color:#aaa;margin-top:22px}.footer-bottom{border-top:1px solid #555;margin-top:70px;padding-top:20px;display:flex;align-items:center;justify-content:space-between;gap:18px}.footer-bottom p,.footer-bottom>a:last-child{font-size:10px;letter-spacing:1px;color:#bbb;margin:0}.footer-bottom .wordmark{color:#fff}@media(max-width:720px){.topbar{padding:13px 5%}.menu-toggle{display:block}.nav-links{display:none;position:absolute;left:0;right:0;top:55px;background:#171717;padding:20px 5% 25px;flex-direction:column;gap:20px}.nav-links.open{display:flex}.hero{grid-template-columns:1fr;gap:24px;padding:22px 0 40px}.hero-photo{height:390px;max-width:100%}.hero-copy{padding:0}.hero h1{font-size:70px}.statement{padding:45px 0}.career-section,.clients,.ai-section,.background-section{padding:52px 0}.section-heading-row{display:block}.section-heading-row>p{margin-top:18px}.timeline{grid-template-columns:repeat(5,145px);margin-top:32px}.timeline-detail{margin-top:0}.logo-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.group-heading{display:block}.group-heading p{margin-top:4px}.principles-grid{grid-template-columns:1fr;gap:24px}.how-inner{display:block}.how-work{padding:52px 0}.how-work h2{margin-bottom:32px}.working-principles{grid-template-columns:1fr;gap:18px}.background-facts{grid-template-columns:1fr}.manifesto{padding:55px 0}.footer-bottom{flex-wrap:wrap}.footer-bottom p{order:3;width:100%}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

/* Portfolio refinements: value-led positioning, colour brand marks and platform experience */
.language-tags{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}.language-tags>span{display:inline-flex;align-items:center;gap:6px;border:1px solid #ddd;border-radius:30px;padding:6px 10px;font-size:11px;color:#333}.flag{font-size:14px;line-height:1}
.client-logo{position:relative;gap:9px;filter:none;background:#fafafa;border:1px solid #eee}.client-logo .brand-mark{max-width:100%;max-height:58px;width:auto;height:auto;object-fit:contain}.client-logo span{display:inline-block}.client-logo img:not([src]){display:none}
.manifesto-layout{display:grid;grid-template-columns:1.2fr .8fr;gap:clamp(28px,5vw,70px);align-items:center}.manifesto-inner{max-width:760px}.culture-photo-placeholder{min-height:330px;border:1px dashed #888;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:24px;color:#555;background:linear-gradient(135deg,#e5e5e5,#f8f8f8)}.photo-placeholder-icon{width:42px;height:42px;border:1px solid #888;border-radius:50%;display:grid;place-items:center;font-size:26px;margin-bottom:14px}.culture-photo-placeholder p{font-size:10px;letter-spacing:1.6px;font-weight:700;margin:0 0 6px}.culture-photo-placeholder span{font-size:12px;color:#777}
.platforms-section{padding:72px 0}.platforms-section h2{font-family:var(--serif);font-size:clamp(36px,5vw,58px);font-weight:400;letter-spacing:-1.5px;line-height:.98;margin:0}.platform-groups{margin-top:34px;display:grid;grid-template-columns:repeat(3,1fr);gap:24px}.platform-group{border-top:1px solid #222;padding-top:14px}.platform-label{font-size:10px;letter-spacing:1.2px;color:#777;font-weight:700;margin:0 0 14px}.platform-logos{display:flex;flex-wrap:wrap;gap:10px}.platform-logo{display:flex;align-items:center;gap:9px;min-height:52px;border:1px solid #e0e0e0;padding:10px 12px;flex:1 1 135px;font-size:12px;font-weight:700;color:#222;background:#fff}.platform-logo img{width:25px;height:25px;object-fit:contain}.platform-note{font-size:11px;color:#777;margin-top:22px}
@media(max-width:720px){.manifesto-layout{grid-template-columns:1fr}.culture-photo-placeholder{min-height:240px}.platform-groups{grid-template-columns:1fr;gap:22px}.platforms-section{padding:52px 0}.platform-logo{flex-basis:130px}}

/* Refinements for the original portfolio layout */
.hero{grid-template-columns:minmax(230px,.78fr) minmax(0,1.22fr);gap:clamp(36px,7vw,100px)}
.hero-photo{width:clamp(230px,28vw,340px);height:clamp(230px,28vw,340px);border-radius:50%;justify-self:center;overflow:hidden}
.hero-photo img{object-position:center 32%}
.hero-credential{margin-bottom:18px;color:#333}
.hero-actions{display:flex;flex-wrap:wrap;gap:18px 24px}
.hero-actions .text-link{margin-top:20px;gap:10px}
.hero-location{font-size:11px;color:#777;margin-top:18px}
.statement{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(36px,6vw,80px);align-items:start}
.statement-copy{position:sticky;top:95px}
.statement-context{max-width:390px;color:#666;font-size:14px;margin-top:26px}
.career-summary>.eyebrow{margin-bottom:14px}
.career-item{border-top:1px solid var(--line);padding:0}
.career-item:last-child{border-bottom:1px solid var(--line)}
.career-item summary{list-style:none;display:flex;align-items:flex-start;justify-content:space-between;gap:18px;padding:16px 0;cursor:pointer}
.career-item summary::-webkit-details-marker{display:none}
.career-role{font-family:var(--serif);font-size:18px;line-height:1.25}
.career-arrow{font-size:19px;line-height:1;flex:0 0 20px;text-align:center;color:#777}
.career-item>p{font-size:13px;color:#555;margin:0 0 14px;max-width:560px}
.career-item .career-detail{padding-left:14px;border-left:1px solid #bbb;color:#777}
.founder-note{padding:0 0 60px;max-width:1120px}
.founder-note>p:last-child{max-width:680px;font-size:14px;color:#555}
.founder-note a{text-decoration:underline;text-underline-offset:3px}
@media(max-width:720px){
 .hero{grid-template-columns:1fr;gap:22px}
 .hero-photo{width:240px;height:240px;justify-self:start;margin-left:2px}
 .hero-actions{gap:6px 20px}
 .statement{grid-template-columns:1fr;gap:34px}
 .statement-copy{position:static}
 .career-role{font-size:17px}
 .founder-note{padding-bottom:42px}
}
.hero-role{font-size:13px;color:#666;margin:0 0 4px;letter-spacing:.2px}
.manifesto-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,.72fr);gap:clamp(32px,6vw,78px);align-items:center}
.culture-photo{margin:0}
.culture-photo img{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;object-position:center 38%;filter:none}
.culture-photo figcaption{font-size:10px;line-height:1.5;color:#666;margin-top:10px}
@media(max-width:720px){.manifesto-layout{grid-template-columns:1fr}.culture-photo img{aspect-ratio:4/3}}

/* Local brand assets */
.client-logo{filter:none;overflow:hidden}
.client-logo .brand-mark{display:block;width:auto;height:auto;max-width:92%;max-height:62px;object-fit:contain}
.client-logo:has(.brand-mark){padding:10px 14px}
.agency-heading{display:flex;align-items:center;gap:14px;min-width:0}
.agency-heading h3{margin:0}
.agency-mark{display:block;width:auto;height:auto;max-width:112px;max-height:38px;object-fit:contain}
.client-group .group-heading{align-items:center}
@media(max-width:720px){
  .agency-heading{gap:10px}
  .agency-mark{max-width:88px;max-height:30px}
  .client-logo .brand-mark{max-height:58px}
}

/* Career-at-a-glance agency marks */
.career-heading{display:flex;align-items:center;gap:12px;min-width:0}
.career-agency-logo{width:42px;height:42px;object-fit:contain;flex:0 0 42px;border-radius:50%}
.career-role{display:block}
.agency-heading .agency-mark{max-width:48px;max-height:42px;object-fit:contain}


/* Hero spacing and alignment refinement */
.hero{
  min-height:620px;
  padding:76px 0 82px;
  grid-template-columns:minmax(250px,.82fr) minmax(0,1.18fr);
  gap:clamp(48px,8vw,112px);
  align-items:center;
}
.hero-photo{
  width:clamp(250px,29vw,350px);
  height:clamp(250px,29vw,350px);
  justify-self:center;
}
.hero-copy{
  max-width:590px;
  padding:12px 0;
}
.hero-credential{
  margin:0 0 24px;
  line-height:1.4;
}
.hero h1{
  margin:0;
  line-height:.98;
}
.hero-subtitle{
  max-width:520px;
  margin:28px 0 18px;
  line-height:1.2;
}
.hero .intro{
  max-width:500px;
  margin:0;
  line-height:1.75;
}
.language-tags{
  margin-top:24px;
  gap:10px;
}
.hero-actions{
  margin-top:12px;
  gap:14px 28px;
}
.hero-actions .text-link{
  margin-top:18px;
}
.hero-location{
  margin-top:24px;
  line-height:1.5;
}
@media(max-width:720px){
  .hero{
    min-height:0;
    padding:48px 0 58px;
    grid-template-columns:1fr;
    gap:30px;
  }
  .hero-photo{
    width:220px;
    height:220px;
    justify-self:start;
    margin:0;
  }
  .hero-copy{
    max-width:100%;
    padding:0;
  }
  .hero-credential{
    margin-bottom:18px;
  }
  .hero-subtitle{
    margin:22px 0 14px;
  }
  .hero .intro{
    line-height:1.7;
  }
  .language-tags{
    margin-top:20px;
  }
  .hero-actions{
    margin-top:8px;
    gap:4px 18px;
  }
  .hero-actions .text-link{
    margin-top:18px;
  }
  .hero-location{
    margin-top:20px;
  }
}
