.portfolio-page{--bg:var(--page);--surface:#111214;--line:#292b2f;--line-soft:#202226;--text:#f0f0f1;--muted:#999ba1;--dim:#66686f;--red:var(--accent);--mono:var(--font-mono);--content:var(--content-width)}
.portfolio-page .wrap{width:min(calc(100% - 96px),var(--content));margin-inline:auto}
.portfolio-page .hero{position:relative;isolation:isolate;width:100%;margin:0;padding:0;overflow:hidden;border-bottom:1px solid var(--line);background:radial-gradient(ellipse 58% 75% at 93% 14%,rgba(78,27,36,.20),transparent 75%),linear-gradient(130deg,#090a0b 0%,#0e1015 60%,#08090a 100%)}
.hero-ambient{position:absolute;z-index:-1;top:-440px;right:-360px;width:950px;height:950px;border:1px solid rgba(255,255,255,.035);border-radius:50%;box-shadow:0 0 0 90px rgba(255,255,255,.006),0 0 0 180px rgba(255,255,255,.005),0 0 0 270px rgba(255,255,255,.004);pointer-events:none}
.hero-inner{display:flex;min-height:700px;flex-direction:column;justify-content:space-between;padding:38px 0 38px}.hero-topline,.hero-bottomline{display:flex;justify-content:space-between;gap:24px;color:#777980;font:500 10px/1.5 var(--mono);letter-spacing:.08em}.hero-topline span:first-child{display:flex;align-items:center;gap:12px}.hero-topline span:first-child::before,.small-dot{display:inline-block;width:6px;height:6px;background:var(--red);border-radius:50%;box-shadow:0 0 15px rgba(221,25,25,.35)}
.hero-main{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(280px,.5fr);gap:80px;align-items:end;padding:80px 0 110px}.hero h1{max-width:950px;margin:0;font-size:clamp(60px,5.6vw,88px);font-weight:500;letter-spacing:-.054em;line-height:1.05}.hero h1 em{font-style:normal;color:#a6a8ae}.hero-aside{padding-bottom:10px}.hero-aside p{margin:0;color:#b0b1b6;font-size:16px;line-height:1.7}.text-link{display:inline-flex;align-items:center;gap:18px;margin-top:30px;color:#dedee0;font-size:14px}.text-link span{color:var(--red);font-size:21px;line-height:1;transition:transform .2s}.text-link:hover span{transform:translate(3px,-3px)}
.selector{border-bottom:1px solid var(--line-soft)}.selector-inner{display:grid;grid-template-columns:minmax(0,.65fr) minmax(0,1.35fr);gap:100px;padding:120px 0 140px}.eyebrow{display:flex;align-items:center;gap:10px;margin:0 0 26px;color:#808289;font:500 10px/1.5 var(--mono);letter-spacing:.09em}.section-intro h2{margin:0;font-size:clamp(39px,3.8vw,56px);font-weight:500;letter-spacing:-.045em;line-height:1.08}.section-intro>p:last-child{max-width:330px;margin:28px 0 0;color:#92949a;font-size:16px;line-height:1.7}.selector-list{border-top:1px solid #393b40}.selector-list a{display:grid;grid-template-columns:46px minmax(0,1fr) 152px 18px;gap:16px;align-items:center;min-height:118px;border-bottom:1px solid #35373c;transition:background .2s,padding .2s}.selector-list a:hover{padding-left:12px;background:rgba(255,255,255,.025)}.selector-number{color:#676970;font:500 11px var(--mono)}.selector-problem{max-width:340px;color:#dedee1;font-size:17px;line-height:1.4}.selector-list strong{color:#9c9ea5;font-size:13px;font-weight:500}.selector-arrow{color:var(--red);font-size:20px}
.platform{border-bottom:1px solid var(--line-soft);scroll-margin-top:72px}.platform-smartbis{background:radial-gradient(ellipse 50% 70% at 78% 50%,rgba(95,29,36,.10),transparent 75%),#0a0b0c}.platform-wpp{background:#0c0d10}.platform-whatsplaid{background:radial-gradient(ellipse 55% 65% at 25% 50%,rgba(43,47,62,.14),transparent 75%),#090a0c}.platform-inner{display:grid;grid-template-columns:minmax(0,.77fr) minmax(0,1.23fr);align-items:center;gap:9%;min-height:720px;padding:112px 0}.platform-wpp .platform-copy{order:2}.platform-wpp .media-slot{order:1}.platform-copy .eyebrow{margin-bottom:48px}.platform-copy h2{margin:0;font-size:clamp(48px,4.8vw,70px);font-weight:500;letter-spacing:-.055em;line-height:1.03}.platform-promise{max-width:450px;margin:23px 0 0;color:#dedfe2;font-size:24px;letter-spacing:-.025em;line-height:1.32}.platform-description{max-width:480px;margin:25px 0 0;color:#999ba2;font-size:16px;line-height:1.7}.platform-details{display:flex;flex-wrap:wrap;gap:8px;margin-top:36px}.platform-details span{padding:8px 10px;color:#7f8188;border:1px solid #313339;border-radius:4px;font:500 10px var(--mono);letter-spacing:.04em}.platform-link{display:inline-flex;align-items:center;gap:20px;margin-top:50px;padding:0 0 9px;border-bottom:1px solid #5e6067;color:#f1f1f2;font-size:15px;transition:border-color .2s}.platform-link span{color:var(--red);font-size:21px;line-height:1}.platform-link:hover{border-color:var(--red)}
.media-slot{min-width:0;margin:0;overflow:hidden;border:1px solid #33353b;border-radius:18px;background:#141619;box-shadow:0 35px 90px rgba(0,0,0,.32)}.media-top,.media-slot figcaption{display:flex;justify-content:space-between;gap:12px;padding:18px 22px;color:#686a72;font:500 9px var(--mono);letter-spacing:.08em}.media-top{border-bottom:1px solid #2b2d33}.media-mark{color:#999ba2}.media-stage{display:grid;min-height:360px;aspect-ratio:1.47;place-items:center;overflow:hidden;background:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px),radial-gradient(circle at 50% 55%,rgba(91,96,108,.13),transparent 57%),#101215;background-size:52px 52px,52px 52px,auto,auto}.media-guide{display:flex;max-width:360px;flex-direction:column;align-items:center;gap:12px;padding:30px;text-align:center}.media-guide-icon{display:grid;width:64px;height:64px;place-items:center;border:1px solid #53565f;border-radius:14px;color:#d5d6d9;font-size:30px}.media-guide strong{color:#d0d1d5;font-size:17px;font-weight:500}.media-guide>span:last-child{color:#7f828a;font-size:13px;line-height:1.5}.media-slot figcaption{padding:18px 22px;border-top:1px solid #2b2d33}.media-slot[data-product="smartbis"] .media-stage{background-color:#141214}.media-slot[data-product="wpp"] .media-stage{background-color:#111518}.media-slot[data-product="whatsplaid"] .media-stage{background-color:#12141a}
.independent{position:relative;overflow:hidden;border-bottom:1px solid var(--line);background:radial-gradient(ellipse 58% 82% at 90% 100%,rgba(58,67,83,.14),transparent 80%),#0a0b0d}.independent::after{position:absolute;right:-12%;bottom:-50%;width:750px;aspect-ratio:1;border:1px solid rgba(255,255,255,.04);border-radius:50%;box-shadow:0 0 0 85px rgba(255,255,255,.012),0 0 0 170px rgba(255,255,255,.009);content:"";pointer-events:none}.independent-inner{position:relative;z-index:1;padding:135px 0 145px}.independent h2{max-width:930px;margin:0;font-size:clamp(44px,5vw,72px);font-weight:500;letter-spacing:-.052em;line-height:1.08}.independent-bottom{display:flex;justify-content:space-between;align-items:flex-end;gap:50px;margin-top:50px}.independent-bottom p{max-width:630px;margin:0;color:#a0a2a8;font-size:17px;line-height:1.65}.independent-bottom .text-link{flex:none;margin:0}
@media(max-width:1050px){.portfolio-page .wrap{width:calc(100% - 64px)}.hero-main{gap:45px}.selector-inner{grid-template-columns:1fr;gap:50px}.section-intro>p:last-child{max-width:600px}.platform-inner{gap:6%}.selector-list a{grid-template-columns:38px minmax(0,1fr) 150px 18px}}
@media(max-width:760px){.portfolio-page .wrap{width:calc(100% - 40px)}.hero-inner{min-height:650px;padding:30px 0}.hero-topline span:last-child,.hero-bottomline span:last-child{display:none}.hero-main{grid-template-columns:1fr;gap:35px;padding:65px 0}.hero h1{font-size:clamp(43px,9.4vw,68px)}.hero-aside{max-width:560px}.hero-aside p{font-size:15px}.hero-ambient{top:-160px;right:-330px;width:650px;height:650px}.selector-inner{padding:85px 0 95px;gap:45px}.section-intro h2{font-size:42px}.selector-list a{grid-template-columns:30px minmax(0,1fr) 18px;gap:12px;min-height:110px}.selector-list strong{grid-column:2;grid-row:2;margin:-14px 0 15px}.selector-arrow{grid-column:3;grid-row:1}.selector-problem{font-size:16px}.platform{scroll-margin-top:64px}.platform-inner{grid-template-columns:1fr;gap:50px;min-height:0;padding:92px 0 105px}.platform-wpp .platform-copy,.platform-wpp .media-slot{order:initial}.platform-copy .eyebrow{margin-bottom:35px}.platform-copy h2{font-size:clamp(46px,9vw,64px)}.platform-promise{font-size:22px}.platform-description{font-size:15px}.platform-link{margin-top:38px}.media-stage{min-height:280px}.independent-inner{padding:105px 0 115px}.independent h2{font-size:clamp(38px,8vw,58px)}.independent-bottom{align-items:flex-start;flex-direction:column;gap:30px}}
@media(max-width:430px){.hero-inner{min-height:640px}.hero h1{font-size:43px}.hero-main{padding:55px 0}.hero-aside p{font-size:14px}.selector-list a{min-height:126px}.selector-problem{font-size:15px}.media-stage{min-height:250px;aspect-ratio:1.1}.media-guide{padding:22px}.media-top,.media-slot figcaption{padding:14px 16px;font-size:8px}.media-slot figcaption span:last-child{display:none}.platform-details span{font-size:9px}}
@media(prefers-reduced-motion:reduce){.portfolio-page *{transition-duration:.01ms!important;animation-duration:.01ms!important}}
@media(min-width:761px){.platform-wpp .platform-inner{grid-template-columns:minmax(0,1.23fr) minmax(0,.77fr)}}
.brand-lockup{display:flex;align-items:center;justify-content:center;gap:18px;max-width:100%;padding:30px}
.brand-symbol{display:block;width:104px;height:104px;flex:none;object-fit:contain}
.brand-name{color:#f5f5f6;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:clamp(30px,3vw,43px);font-weight:600;letter-spacing:-.03em;line-height:1.1;white-space:nowrap}
.brand-wordmark{display:block;width:min(290px,55vw);height:auto;filter:invert(1)}
.brand-lockup-smartbis{gap:20px}
@media(max-width:430px){.brand-lockup{gap:10px;padding:18px}.brand-symbol{width:66px;height:66px}.brand-name{font-size:clamp(24px,7vw,31px)}.brand-wordmark{width:min(196px,53vw)}}

/* Shared institutional heading scale: Home, About and Portfolio. */
.portfolio-page .hero h1{font-size:var(--heading-h1-size);font-weight:var(--heading-weight);letter-spacing:var(--heading-h1-spacing);line-height:var(--heading-h1-line)}
.portfolio-page .section-intro h2,.portfolio-page .platform-copy h2,.portfolio-page .independent h2{font-size:var(--heading-h2-size);font-weight:var(--heading-weight);letter-spacing:var(--heading-h2-spacing);line-height:var(--heading-h2-line)}
