@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(assets/font-0.ttf) format('truetype');
}
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(assets/font-1.ttf) format('truetype');
}
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(assets/font-2.ttf) format('truetype');
}
@font-face {
  font-family: 'DM Sans';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(assets/font-3.ttf) format('truetype');
}
@font-face {
  font-family: 'Instrument Serif';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url(assets/font-4.ttf) format('truetype');
}
@font-face {
  font-family: 'Instrument Serif';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(assets/font-5.ttf) format('truetype');
}

:root{--paper:#efefeb;--ink:#191b18;--acid:#dfff00;--muted:#65675f;--line:#cecec6;font-family:'DM Sans',Arial,sans-serif;color:var(--ink);background:var(--paper);font-synthesis:none}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0}a{color:inherit;text-decoration:none}button{font:inherit}button,a{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible{outline:3px solid #8271fb;outline-offset:6px}a:hover{opacity:.76}p{line-height:1.65}h1,h2,h3,p{margin:0}em{font-family:'Instrument Serif',Georgia,serif;font-weight:400}header{height:108px;padding:0 4.4%;display:flex;align-items:center;gap:34px;border-bottom:1px solid var(--line);position:relative;z-index:2;background:var(--paper)}.wordmark{font-size:41px;letter-spacing:-2px;font-weight:450;line-height:1}.wordmark span{font-size:13px;vertical-align:top;letter-spacing:0;margin-left:4px}.header-note{font-size:10px;letter-spacing:1.3px;line-height:1.5}nav{display:flex;gap:32px;margin-left:auto;font-size:14px}nav a:last-child{margin-left:25px}nav span{padding-left:18px}.hero{min-height:740px;height:calc(100svh - 178px);max-height:1080px;position:relative;isolation:isolate;overflow:hidden;background:#eae7e2}.hero-photo{position:absolute;inset:0 0 0 35%;z-index:-1;overflow:hidden;mask-image:linear-gradient(90deg,transparent 0%,#000 30%)}.hero-photo img{height:115%;width:100%;object-fit:cover;object-position:50% 22%}.hero-content{padding:48px 4.4% 35px;position:relative;height:100%;display:flex;flex-direction:column;align-items:flex-start}.eyebrow,.section-label{font-size:12px;font-weight:500;letter-spacing:1.8px;line-height:1.5}.hero h1{font-size:clamp(62px,6.9vw,112px);font-weight:450;line-height:1.02;letter-spacing:-5px;margin-top:35px}.hero h1 em{font-size:1.16em;line-height:.87}.period{color:#6f7625}.hero-bottom{display:flex;align-items:center;gap:50px;margin-top:auto;padding-top:28px}.hero-bottom p{font-size:16px;line-height:1.55}.hero-bottom em{font-family:inherit;font-style:normal;border-bottom:1px solid}.round-link{display:grid;place-items:center;border:1px solid #777b71;border-radius:50%;width:49px;height:49px;font-size:25px}.photo-label{position:absolute;right:4.4%;bottom:36px;color:white;font-size:11px;letter-spacing:1.6px;line-height:1.6}.current{min-height:70px;display:flex;align-items:center;gap:40px;background:var(--acid);padding:20px 4.4%;font-size:14px}.current>span:first-child{font-size:11px;letter-spacing:1.5px}.current strong{font-weight:500;font-size:18px}.current-end{margin-left:auto}.current-end b{margin-left:28px;font-size:24px;font-weight:400}.section{padding:100px 5.6%}.section-label{margin-bottom:54px}.intro{display:grid;grid-template-columns:23% 1fr;gap:3%}.intro .section-label{padding-top:12px}h2{font-size:clamp(44px,4.8vw,76px);line-height:1.07;font-weight:450;letter-spacing:-2.5px}h2 em{font-size:1.08em}.intro-columns{display:grid;grid-template-columns:1fr 1fr;gap:42px;margin:45px 0 26px;font-size:17px}.intro-foot{font-size:15px;color:var(--muted);max-width:670px}.disciplines{display:flex;flex-wrap:wrap;gap:10px;margin-top:32px}.disciplines span{font-size:12px;padding:9px 14px;border:1px solid #bfc0b7;border-radius:30px}.dark{background:#191b18;color:var(--paper)}.dark .section-label{color:#b7baae}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:40px;margin-bottom:55px}.section-heading>p,.section-heading>div{max-width:325px;font-size:16px}.cases{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:#4c4e43;border:1px solid #4c4e43}.case{padding:35px 40px;background:#20221e;position:relative;transition:background .3s}.case:hover{background:#282b23}.case-top,.case-bottom{display:flex;justify-content:space-between;gap:12px;font-size:11px;letter-spacing:1.2px;color:#b5b9ab}.case-brand{font-size:42px;font-weight:700;margin:45px 0 32px;letter-spacing:-2px}.case-brand.oura{font-weight:400;letter-spacing:3px}.case-brand.nafas{font-weight:500}.case h3{font-size:33px;line-height:1.12;font-weight:450;letter-spacing:-1px}.case>p{max-width:510px;color:#c3c7b9;font-size:15px;margin:23px 0 35px;min-height:100px}.case-bottom{border-top:1px solid #44473d;padding-top:22px;letter-spacing:0}.experience{margin-top:85px}.experience>.eyebrow{color:#b7baae}.logos{display:grid;grid-template-columns:repeat(4,1fr);align-items:center;text-align:center;gap:40px 35px;padding:50px 0;font-size:29px;font-weight:600}.logos img{width:100%;height:50px;object-fit:contain;filter:grayscale(1) brightness(0) invert(1);opacity:.88}.logo-note{font-size:12px;max-width:620px;color:#a3a899;line-height:1.6}.mearra{background:var(--acid);display:grid;grid-template-columns:23% 1fr;gap:3%}.mearra-main>.eyebrow{margin-bottom:30px}.mearra h2{font-size:clamp(50px,6.7vw,102px)}.mearra-copy{display:grid;grid-template-columns:1fr 1fr;gap:30px;margin-top:40px;font-size:17px}.button{display:flex;align-items:center;justify-content:space-between;gap:28px;width:fit-content;background:var(--ink);color:var(--paper);padding:18px 25px;font-size:14px}.button span{font-size:21px}.mearra-copy .button{grid-column:1/-1;margin-top:6px}.method{margin-top:60px;display:flex;justify-content:space-between;border-top:1px solid #9da924;padding-top:25px;font-size:15px}.method i{font-style:normal;color:#65701e}.creative-grid{display:grid;grid-template-columns:1fr 1fr;gap:32px}.creative-image{aspect-ratio:1.5;background:#282b26;overflow:hidden}.creative-image img{width:100%;height:100%;object-fit:cover;transition:transform 1s}.creative:hover img{transform:scale(1.025)}.creative-body{padding:28px 0}.creative h3{font-size:30px;letter-spacing:-1px;font-weight:500;margin:20px 0}.creative p:not(.eyebrow){font-size:16px;margin-bottom:20px}.creative p em{font-family:inherit}.award{border-left:2px solid var(--ink);padding-left:16px;font-size:13px!important}.award strong{font-weight:500}.text-link{font-size:14px;display:inline-block;border-bottom:1px solid #9b9e91;padding:4px 0}.text-link span{margin-left:20px}.voices{background:#e2e3dc}.voices .section-heading{margin-bottom:45px}.voices .text-link{margin-top:12px}.quotes{display:grid;grid-template-columns:1fr 1fr;gap:65px;min-height:315px}.quote{border-top:1px solid #b6b9ad;padding:28px 0 0;display:flex;flex-direction:column}.quote blockquote{font-family:'Instrument Serif',Georgia,serif;font-size:30px;line-height:1.2;margin:0 0 30px;max-width:580px}.quote-author{margin-top:auto}.quote-author strong{display:block;font-size:14px;font-weight:550}.quote-author span{font-size:12px;line-height:1.5;color:#555b4c}.quote-controls{display:flex;justify-content:space-between;align-items:center;margin-top:36px}.quote-controls p{font-size:12px;letter-spacing:1px}.muted{color:#666c5d;margin-left:15px}.quote-controls button{border:1px solid #979d8c;border-radius:50%;background:transparent;width:48px;height:48px;font-size:24px;margin-left:8px;cursor:pointer}.quote-controls button:hover{background:var(--acid)}.quote-note{font-size:11px;color:#626858;margin-top:25px}.contact{display:grid;grid-template-columns:23% 1fr;gap:3%}.contact h2{font-size:clamp(66px,7.5vw,110px)}.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:38px;margin-top:50px}.contact-grid p{font-size:16px;color:#c2c5b9;margin-bottom:25px}.lime{background:var(--acid);color:var(--ink)}.email{font-size:23px;display:block;margin-bottom:20px}.contact .text-link{color:#b9bfad}footer{padding:40px 4.4%;display:flex;gap:40px;align-items:center}footer p{font-size:12px;color:#656b5c}footer>a:last-child{font-size:13px;margin-left:auto}#business-id{border:0;background:none;cursor:pointer;margin-left:auto;font-size:13px;color:var(--ink)}#business-id strong{font-weight:500}#business-id span{padding-left:8px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip{position:absolute;left:20px;top:-100px;z-index:10;padding:15px;background:var(--acid)}.skip:focus{top:10px}
@media(min-width:1700px){.section{padding-left:max(6%,calc((100vw - 1500px)/2));padding-right:max(6%,calc((100vw - 1500px)/2))}}
@media(max-width:1000px){header{gap:20px}.header-note{display:none}.hero{min-height:690px}.hero h1{font-size:8vw;letter-spacing:-3px}.hero-photo{left:25%;opacity:.9}.hero-content{padding-top:40px}.hero-bottom{gap:25px}.intro,.mearra,.contact{grid-template-columns:1fr}.section{padding:75px 6%}.section-label{margin-bottom:32px}.case{padding:26px}.case h3{font-size:29px}.case-bottom{flex-wrap:wrap}.current{gap:25px}.current-end{font-size:12px}.quotes{gap:35px}.quote blockquote{font-size:27px}footer{gap:25px;flex-wrap:wrap}.mearra h2{font-size:74px}}
@media(max-width:640px){header{height:82px;padding:0 6%}.wordmark{font-size:34px}nav{gap:20px;font-size:12px}nav a:first-child,nav a:nth-child(2){display:none}nav a:last-child{margin:0}.hero{height:auto;min-height:0;padding-bottom:0;background:#eae7e2}.hero-photo{inset:auto 0 0 15%;height:440px;mask-image:linear-gradient(180deg,transparent 0%,#000 28%);opacity:1}.hero-photo img{height:115%;object-position:center 25%}.hero-content{padding:33px 6% 360px}.eyebrow,.section-label{font-size:10px;letter-spacing:1.5px}.hero h1{font-size:clamp(47px,11.8vw,75px);letter-spacing:-2.5px;margin-top:25px}.hero-bottom{margin-top:25px;padding:0;align-items:start}.hero-bottom p{font-size:14px;max-width:260px}.round-link{width:36px;height:36px;flex-shrink:0;font-size:20px}.photo-label{bottom:25px;right:6%;font-size:9px}.current{display:grid;grid-template-columns:1fr auto;gap:6px;padding:18px 6%}.current>span:first-child{grid-column:1/-1;font-size:9px}.current strong{font-size:15px}.current-end{font-size:0}.current-end b{font-size:23px;margin:0}.section{padding:58px 6%}h2{font-size:43px;letter-spacing:-1.5px}.intro-columns,.mearra-copy{grid-template-columns:1fr;gap:22px;margin-top:28px;font-size:16px}.intro-foot{font-size:14px}.disciplines{gap:7px}.disciplines span{font-size:11px;padding:8px 11px}.section-heading{display:block;margin-bottom:30px}.section-heading>p,.section-heading>div{margin-top:23px;font-size:14px}.cases{grid-template-columns:1fr}.case{padding:25px}.case-brand{margin:30px 0 23px}.case h3{font-size:31px}.case>p{min-height:0;font-size:15px}.experience{margin-top:55px}.logos{grid-template-columns:repeat(2,1fr);font-size:25px;gap:25px;padding:30px 0}.logos img{height:38px}.mearra h2{font-size:52px;letter-spacing:-2px}.method{font-size:12px;margin-top:40px}.creative-grid{grid-template-columns:1fr;gap:30px}.creative-body{padding-bottom:0}.creative h3{font-size:28px}.quotes{grid-template-columns:1fr;gap:30px;min-height:0}.quote{min-height:230px}.quote blockquote{font-size:27px}.quote-note{font-size:10px}.muted{font-size:10px;margin-left:8px}.quote-controls button{width:40px;height:40px}.contact h2{font-size:61px}.contact-grid{grid-template-columns:1fr;gap:40px;margin-top:35px}footer{padding:30px 6%;display:grid;grid-template-columns:1fr 1fr;gap:25px 15px}footer p{font-size:10px}footer>a:last-child{font-size:12px}#business-id{margin:0;padding:0;text-align:left;font-size:11px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}}

.wordmark img{display:block;width:135px;height:45px;object-fit:contain;filter:brightness(0)}.case-brand img{object-fit:contain;object-position:left;filter:brightness(0) invert(1)}.creative .image-credit{font-size:10px!important;color:#74796b;margin:9px 0 0!important;line-height:1.4}.logos img{max-width:180px;justify-self:center}

.header-note{font-size:12px;letter-spacing:1px}.eyebrow,.section-label{font-size:12px}.case>p{font-size:16px}.disciplines span{font-size:14px}.case-top,.case-bottom{font-size:12px}.current>span:first-child{font-size:12px}.hero-bottom{max-width:52%}@media(max-width:640px){.hero-bottom{max-width:none}.eyebrow,.section-label{font-size:12px}.disciplines span{font-size:12px}.current>span:first-child{font-size:12px}.case-top,.case-bottom{font-size:12px}.method{font-size:13px}.creative .image-credit{font-size:12px!important}}
/* Personal portfolio — revision 2 */
.hero{height:auto;min-height:0;max-height:none;aspect-ratio:16/9;background:#e9e6e0;overflow:hidden}.hero-photo{inset:0;mask-image:none;opacity:1;overflow:hidden}.hero-photo img{width:100%;height:100%;object-fit:cover;object-position:center}.hero-content{padding:5% 5.6% 3.5%;width:59%;height:100%;position:absolute;inset:0 auto 0 0}.hero h1{font-size:clamp(50px,5.85vw,112px);letter-spacing:-.045em;margin-top:4.5%;line-height:1.03}.hero h1 em{font-size:1.13em}.hero-bottom{max-width:100%;width:100%;gap:20px;justify-content:space-between;padding-top:20px}.hero-bottom p{font-size:clamp(14px,1.1vw,19px)}.hero-bottom a:not(.round-link){border-bottom:1px solid #75776c}.photo-label{display:none}.hero .eyebrow{font-size:clamp(10px,.85vw,14px);letter-spacing:1.3px}.logo-wall{padding-bottom:60px}.logo-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid #454a3d;border-left:1px solid #454a3d}.logo-cell{height:160px;display:flex;justify-content:center;align-items:center;padding:35px;border-right:1px solid #454a3d;border-bottom:1px solid #454a3d}.logo-cell img{width:100%;height:65px;object-fit:contain;filter:brightness(0) invert(1);opacity:.92}.logo-cell img[alt="VR"]{max-width:125px}.logo-cell img[alt="Red Bull"]{height:90px}.logo-cell img[alt="The Salvation Army"],.logo-cell img[alt="Finnkino"]{height:85px;max-width:150px}.logo-cell img[alt="Oura"]{max-width:180px}.work{padding-top:35px}.cases{border:0;background:none;gap:48px 32px}.visual-case{padding:0;background:none!important}.case-image{aspect-ratio:1.5;position:relative;overflow:hidden;background:#353a31}.case-image>img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .8s}.visual-case:hover .case-image>img{transform:scale(1.025)}.case-image-brand{position:absolute;left:25px;bottom:25px;min-height:64px;min-width:150px;padding:17px 22px;background:#171a16;display:flex;align-items:center;justify-content:center;box-shadow:0 8px 35px #0003}.case-image-brand img{height:32px;width:135px;object-fit:contain;filter:brightness(0) invert(1)}.case-image-brand span{font-size:27px;letter-spacing:-1px}.case-content{padding:25px 0 0}.case-content h3{margin-top:25px}.case-content>p{font-size:16px;color:#c3c7b9;margin:22px 0 30px;line-height:1.65;max-width:550px;min-height:132px}.case-content .case-bottom{font-size:12px}.footer-name{font-size:20px;letter-spacing:-.5px}.case-image-credit{font-size:11px;color:#a8ae9e;line-height:1.5;padding-top:8px}
@media(min-width:1700px){.hero-content{padding-left:5.6%}.hero h1{font-size:6vw}}
@media(max-width:1000px){.hero-content{width:60%;padding-top:4%}.hero h1{font-size:5.9vw;letter-spacing:-.04em}.hero-bottom{padding-top:14px}.hero-bottom p{font-size:13px}.hero .round-link{width:36px;height:36px;font-size:20px}.logo-cell{height:135px;padding:28px}.logo-cell img{height:55px}.case-content>p{min-height:185px}.case-image-brand{left:18px;bottom:18px;min-width:125px;padding:14px 18px}.case-image-brand img{width:110px}}
@media(max-width:640px){.hero{aspect-ratio:auto;display:flex;flex-direction:column;padding:0;background:#e8e5df}.hero-content{position:relative;width:100%;padding:35px 6% 30px;height:auto;background-image:url('assets/janne-original-extended.jpg');background-size:auto 220%;background-position:left top}.hero h1{font-size:12vw;line-height:1.02;margin-top:25px;max-width:100%;letter-spacing:-.04em}.hero .eyebrow{font-size:10px}.hero-bottom{margin-top:25px;padding:0;justify-content:space-between}.hero-bottom p{font-size:15px}.hero-photo{position:relative;inset:auto;order:2;z-index:0;width:100%;height:370px;mask-image:none}.hero-photo img{height:100%;width:100%;object-fit:cover;object-position:88% center;transform:scale(1.65);transform-origin:82% 58%}.logo-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.logo-cell{height:120px;padding:25px}.logo-cell img{height:50px}.logo-cell img[alt="VR"]{max-width:95px}.logo-cell img[alt="Red Bull"]{height:70px}.logo-cell img[alt="The Salvation Army"],.logo-cell img[alt="Finnkino"]{height:65px}.logo-wall{padding-bottom:35px}.work{padding-top:30px}.cases{gap:40px}.case-content>p{min-height:0}.case-image{aspect-ratio:1.4}.case-image-brand{bottom:16px;left:16px}.footer-name{font-size:18px}.current strong{font-size:15px}}
@media(max-width:640px){.hero-photo img{transform:none;object-position:88% center}.hero-photo{height:340px}}
@media(min-width:641px) and (max-width:1000px){.hero h1{font-size:5.85vw}.hero-bottom p{font-size:12px}.hero .eyebrow{font-size:10px}.hero-content{width:61%}}
/* Portrait and editorial refinement — revision 3 */
.hero{position:relative;display:block;aspect-ratio:auto;height:clamp(640px,64vw,920px);background:#e9e3dd;isolation:isolate}.hero-photo{position:absolute;inset:0;z-index:-1;height:100%;width:100%;order:initial;mask-image:none;overflow:hidden}.hero-photo img{position:absolute;width:150%;max-width:none;height:auto;left:-49%;bottom:0;transform:none;object-fit:initial;object-position:initial}.hero-content{position:relative;inset:auto;margin-left:49%;width:51%;height:100%;padding:7% 5.6% 5% 2%;background:none;align-items:flex-end;text-align:right}.hero h1{font-size:clamp(48px,5.35vw,96px);margin-top:40px;line-height:1.07;letter-spacing:-.045em}.hero .eyebrow{font-size:12px;letter-spacing:1.4px}.hero-bottom{margin-top:auto;width:100%;max-width:none;justify-content:flex-end;gap:25px;padding-top:30px}.hero-bottom p{font-size:16px}.hero .round-link{flex-shrink:0}.logo-grid{border:0;gap:30px 40px;grid-template-columns:repeat(4,minmax(0,1fr));align-items:center}.logo-cell{height:125px;border:0;padding:22px 18px}.logo-cell img{max-width:205px;height:65px;width:100%;object-fit:contain}.case-image-brand{inset:0;min-width:0;min-height:0;padding:0;background:none;box-shadow:none;pointer-events:none}.case-image-brand img{height:68px;width:50%;max-width:240px;filter:brightness(0) invert(1);object-fit:contain;filter:brightness(0) invert(1) drop-shadow(0 2px 12px #0004)}.case-image-brand img[alt="VR"]{width:30%;max-width:170px}.case-image-brand span{font-size:42px}.case-image>img{object-fit:cover}.concept-note{font-size:12px;color:#a8ae9e;margin-top:26px}.quotes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:42px 36px;min-height:0}.quote{min-height:0}.quote blockquote{font-size:27px;line-height:1.25}.quote-author{padding-top:10px}.quote-author span{display:block;margin-top:6px;font-size:13px}.quote-note{margin-top:35px}.creative .image-credit{font-size:12px!important}.hero .period{color:inherit}
@media(max-width:1000px) and (min-width:641px){.hero{height:660px}.hero-photo img{width:175%;left:-61%}.hero-content{margin-left:45%;width:55%;padding:7% 5% 5% 1%}.hero h1{font-size:5.4vw;margin-top:35px}.hero .eyebrow{font-size:10px}.hero-bottom p{font-size:14px}.quotes{grid-template-columns:repeat(2,minmax(0,1fr))}.logo-grid{gap:20px}.logo-cell{padding:15px;height:110px}}
@media(max-width:640px){.hero{height:800px;min-height:800px;display:block;aspect-ratio:auto;padding:0}.hero-photo{position:absolute;inset:0;height:100%;width:100%;z-index:-1}.hero-photo img{width:350%;left:-125%;bottom:0;height:auto;transform:none;object-fit:initial;object-position:initial}.hero-content{position:relative;width:100%;height:auto;margin:0;padding:30px 6% 0;background:none;align-items:center;text-align:center}.hero .eyebrow{font-size:10px;letter-spacing:1px}.hero h1{font-size:clamp(40px,10vw,61px);line-height:1.05;letter-spacing:-.04em;margin-top:24px}.hero-bottom{margin-top:24px;padding:0;justify-content:center}.hero-bottom p{font-size:14px}.hero .round-link{display:none}.logo-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 22px}.logo-cell{height:100px;padding:18px 5px}.logo-cell img{height:48px}.logo-cell img[alt="VR"]{max-width:95px}.quotes{grid-template-columns:1fr;gap:32px}.quote blockquote{font-size:28px}.case-image-brand img{height:56px;width:50%}}
@media(max-width:380px){.hero{height:750px;min-height:750px}.hero-photo img{width:365%;left:-132.5%}.hero-content{padding-top:24px}.hero h1{font-size:10vw}.hero-bottom{margin-top:18px}}
@media(min-width:381px) and (max-width:640px){.hero{height:calc(420px + 94vw);min-height:0}}
.visual-case:nth-child(2) .case-image-brand img{filter:brightness(0);opacity:.88}
.logo-grid{display:flex;flex-wrap:wrap;justify-content:center;gap:28px 40px}.logo-cell{width:calc(25% - 30px);flex:0 0 auto}.logo-cell img[alt="Sampo Group"],.logo-cell img[alt="Helsingin Sanomat"]{max-width:230px;height:70px}.logo-cell img[alt="Oura"]{max-width:160px}.logo-cell img[alt="Birdietime"]{height:85px}.case-image-brand img[alt="Birdietime"]{height:130px;width:42%}@media(max-width:1000px){.logo-grid{gap:20px}.logo-cell{width:calc(25% - 15px)}}@media(max-width:640px){.logo-grid{gap:18px 22px}.logo-cell{width:calc(50% - 11px)}.logo-cell img[alt="Sampo Group"],.logo-cell img[alt="Helsingin Sanomat"]{height:55px}.logo-cell img[alt="Oura"]{max-width:130px}.logo-cell img[alt="Birdietime"]{height:68px}}
.logo-cell img[alt="Tikkurila"],.logo-cell img[alt="Jabra"]{filter:none}.logo-cell img[alt="Tikkurila"]{height:85px}@media(max-width:640px){.logo-cell img[alt="Tikkurila"]{height:66px}}

/* Responsive portrait framing: preserve the supplied photograph, cap enlargement. */
.hero{width:100%;max-width:1520px;margin-inline:auto;height:640px;min-height:0;max-height:none;aspect-ratio:auto}
.hero-photo{position:absolute;inset:0;width:100%;height:100%;overflow:hidden;mask-image:none}
.hero-photo img{width:2200px;height:1650px;max-width:none;left:calc(28% - 1100px);bottom:0;object-fit:initial;transform:none}
.hero-content{position:relative;margin-left:47%;width:53%;height:100%;padding:64px 5% 54px 0;justify-content:center;align-items:flex-end;text-align:right;background:none}
.hero h1{font-size:clamp(58px,5.1vw,78px);line-height:1.03;margin-top:30px;letter-spacing:-.045em}
.hero-bottom{margin-top:30px;padding-top:0;gap:24px}
.hero-bottom p{font-size:16px}
.hero .eyebrow{font-size:11px;letter-spacing:1.15px}
.current{display:grid;grid-template-columns:auto 1fr auto;column-gap:36px;row-gap:4px;align-items:center;padding-block:22px}
.current>span:first-child{grid-column:1;grid-row:1/3}
.current strong{grid-column:2;grid-row:1;font-size:24px;line-height:1.25}
.current .current-end{grid-column:2;grid-row:2;margin:0;font-size:15px;line-height:1.5}
.current-arrow{grid-column:3;grid-row:1/3;font-size:26px;font-weight:400}
.logo-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px 40px}
.logo-cell{width:auto}
.logo-cell img,.logo-cell img[alt="Tikkurila"],.logo-cell img[alt="Jabra"]{filter:brightness(0) invert(1)}
.case-image-brand img[alt="Oura"]{width:32%;max-width:165px;height:52px}
.visual-case:nth-child(2) .case-image-brand img{filter:brightness(0) invert(1) drop-shadow(0 2px 12px #0004);opacity:1}
.text-link{display:inline-flex;align-items:center;justify-content:flex-start;gap:12px}
.text-link span{margin:0;padding:0}
footer{align-items:center}footer p{margin:0}footer>*{align-self:center}
@media(min-width:641px) and (max-width:1000px){
.hero{height:560px}.hero-photo img{width:1800px;height:1350px;left:calc(24% - 900px)}
.hero-content{margin-left:42%;width:58%;padding:50px 5% 45px 0}.hero h1{font-size:clamp(44px,5.5vw,55px)}
.hero .eyebrow{font-size:9px;letter-spacing:.6px}.hero-bottom p{font-size:14px}
.logo-grid{gap:20px}.current{column-gap:25px}
}
@media(max-width:640px){
.hero{height:clamp(630px,calc(540px + 25vw),700px);min-height:0;max-width:none;padding:0}
.hero-photo img{width:1150px;height:862.5px;left:calc(50% - 575px);bottom:0}
.hero-content{width:100%;height:auto;margin:0;padding:28px 5% 0;align-items:center;text-align:center}
.hero h1{font-size:clamp(38px,10.3vw,58px);line-height:1.04;margin-top:23px}
.hero .eyebrow{font-size:9px;letter-spacing:.8px}
.hero-bottom{margin-top:21px;padding:0;justify-content:center}.hero-bottom p{font-size:14px}
.current{grid-template-columns:1fr auto;gap:5px 15px;padding:20px 6%}
.current>span:first-child{grid-column:1;grid-row:1;font-size:10px}
.current strong{grid-column:1;grid-row:2;font-size:22px}
.current .current-end{grid-column:1;grid-row:3;font-size:13px}
.current-arrow{grid-column:2;grid-row:1/4}
.logo-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 22px}.logo-cell{width:auto}
footer{align-items:center}footer p{line-height:1.5}
}
@media(max-width:380px){.hero{height:620px}.hero-photo img{width:1080px;height:810px;left:calc(50% - 540px)}.hero h1{font-size:10.3vw}.hero-content{padding-top:24px}}

/* Optical sizing for the expanded vector wall. */
.logo-cell img[alt="Jabra"]{max-width:175px}
.logo-cell img[alt="Panda"]{height:78px;max-width:155px}
.logo-cell img[alt="Warner Music Group"]{height:80px;max-width:225px}
.logo-cell img[alt="Syöpäjärjestöt"]{max-width:240px}
.logo-cell img[alt="The Salvation Army"]{height:95px;max-width:130px}
@media(max-width:640px){
.logo-cell img[alt="Jabra"]{max-width:135px}
.logo-cell img[alt="Panda"]{height:62px;max-width:115px}
.logo-cell img[alt="Warner Music Group"]{height:63px}
.logo-cell img[alt="The Salvation Army"]{height:76px}
}

.logo-cell img[alt="Red Bull"]{max-width:185px;height:65px}@media(max-width:640px){.logo-cell img[alt="Red Bull"]{max-width:140px;height:48px}}

/* Revision 5: one proportional coordinate system for portrait and headline. */
.hero{max-width:none;width:100%;height:auto;min-height:0;max-height:none;aspect-ratio:1408/716;margin:0;display:block}
.hero-photo{position:absolute;inset:0;width:100%;height:100%;z-index:-1}
.hero-photo picture{display:block;width:100%;height:100%}
.hero-photo img{display:block;position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:cover;object-position:center;transform:none}
.hero-content{position:absolute;inset:0 0 0 auto;margin:0;width:51%;height:100%;padding:calc(11.8vw - 38px) 5.6vw 0 0;justify-content:flex-start;align-items:flex-end;text-align:right}
.hero .eyebrow{font-size:clamp(9px,.75vw,18px);line-height:16px;letter-spacing:1px}
.hero h1{font-size:5.35vw;line-height:1.04;margin-top:22px;letter-spacing:-.045em}
.hero-bottom{margin-top:2.5vw;padding:0;width:100%;justify-content:flex-end;gap:2vw}
.hero-bottom p{font-size:clamp(12px,1.1vw,26px);line-height:1.5}
.hero .round-link{display:grid;width:clamp(36px,3.5vw,70px);height:clamp(36px,3.5vw,70px);font-size:clamp(20px,1.8vw,36px)}
.logo-cell img[alt="Warner Music Group"]{max-width:205px;height:85px}
.case-content .case-bottom{display:block;text-align:left}
@media(max-width:640px){
.hero{aspect-ratio:auto;height:calc(160px + 118vw);min-height:560px}
.hero-photo img{inset:auto 0 0;width:100%;height:auto;object-fit:initial}
.hero-content{position:relative;inset:auto;width:100%;height:auto;padding:28px 5% 0;align-items:center;text-align:center}
.hero .eyebrow{font-size:9px;line-height:14px;letter-spacing:.8px}
.hero h1{font-size:clamp(34px,10.3vw,58px);line-height:1.04;margin-top:23px;letter-spacing:-.04em}
.hero-bottom{margin-top:21px;justify-content:center;gap:0}.hero-bottom p{font-size:14px;line-height:1.5}
.hero .round-link{display:none}
.logo-cell img[alt="Warner Music Group"]{height:68px}
}

/* Revision 7: quieter logo wall and two-column hero down to 561px. */
.logo-grid .logo-cell img{transform:scale(.85)}
@media(min-width:561px) and (max-width:640px){
.hero{max-width:none;width:100%;height:auto;min-height:0;max-height:none;aspect-ratio:1408/716;margin:0;display:block}
.hero-photo{position:absolute;inset:0;width:100%;height:100%;z-index:-1}
.hero-photo picture{display:block;width:100%;height:100%}
.hero-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;transform:none}
.hero-content{position:absolute;inset:0 0 0 auto;margin:0;width:51%;height:100%;padding:calc(11.8vw - 38px) 5.6vw 0 0;justify-content:flex-start;align-items:flex-end;text-align:right}
.hero .eyebrow{font-size:8px;line-height:16px;letter-spacing:.4px}
.hero h1{font-size:5.35vw;line-height:1.04;margin-top:22px;letter-spacing:-.045em}
.hero-bottom{margin-top:2.5vw;padding:0;width:100%;justify-content:flex-end;gap:0}
.hero-bottom p{font-size:12px;line-height:1.5}
.hero .round-link{display:none}
}

.logo-cell img[alt="Warner Music Group"]{width:139px;max-width:100%;height:55px}

/* Reaktor: another 12% reduction relative to the rest of the logo wall. */
.logo-grid .logo-cell img[alt="Reaktor"]{transform:scale(.748)}

/* Panda's script needs more optical presence than the compact wordmarks. */
.logo-grid .logo-cell img[alt="Panda"]{max-width:185px;height:92px;transform:scale(1)}
@media(max-width:640px){.logo-grid .logo-cell img[alt="Panda"]{max-width:145px;height:78px}}

/* Render vectors at their final layout size, without a transformed image layer. */
.logo-grid .logo-cell img{transform:none;image-rendering:auto;width:85%;max-width:174px;height:55px}
.logo-grid .logo-cell img[alt="Oura"]{max-width:136px}
.logo-grid .logo-cell img[alt="VR"]{width:75%;max-width:93px;height:48px}
.logo-grid .logo-cell img[alt="Sampo Group"]{width:95%;max-width:220px;height:67px}
.logo-grid .logo-cell img[alt="Helsingin Sanomat"]{width:100%;max-width:231px;height:71px}
.logo-grid .logo-cell img[alt="Jabra"]{width:75%;max-width:131px;height:48px}
.logo-grid .logo-cell img[alt="Birdietime"],.logo-grid .logo-cell img[alt="Tikkurila"]{height:72px}
.logo-grid .logo-cell img[alt="Finnkino"]{max-width:128px;height:72px}
.logo-grid .logo-cell img[alt="Warner Music Group"]{width:118px;height:47px}
.logo-grid .logo-cell img[alt="Syöpäjärjestöt"]{max-width:204px}
.logo-grid .logo-cell img[alt="The Salvation Army"]{max-width:111px;height:81px}
.logo-grid .logo-cell img[alt="Red Bull"]{max-width:134px;height:47px}
.logo-grid .logo-cell img[alt="Reaktor"]{transform:none;max-width:153px;height:49px}
.logo-grid .logo-cell img[alt="Panda"]{width:100%;max-width:185px;height:92px;transform:none}
@media(max-width:640px){
.logo-grid .logo-cell img{height:41px}
.logo-grid .logo-cell img[alt="Oura"]{max-width:111px}
.logo-grid .logo-cell img[alt="VR"]{max-width:71px;height:36px}
.logo-grid .logo-cell img[alt="Sampo Group"]{height:53px}
.logo-grid .logo-cell img[alt="Helsingin Sanomat"]{height:55px}
.logo-grid .logo-cell img[alt="Jabra"]{max-width:101px;height:36px}
.logo-grid .logo-cell img[alt="Birdietime"]{height:58px}
.logo-grid .logo-cell img[alt="Tikkurila"]{height:56px}
.logo-grid .logo-cell img[alt="Finnkino"]{height:55px}
.logo-grid .logo-cell img[alt="The Salvation Army"]{height:65px}
.logo-grid .logo-cell img[alt="Red Bull"]{max-width:101px;height:35px}
.logo-grid .logo-cell img[alt="Reaktor"]{height:36px}
.logo-grid .logo-cell img[alt="Panda"]{max-width:145px;height:78px}
}

/* Brand lockups: use the boxed Tikkurila mark and keep the Oikotie sign crisp. */
.logo-grid .logo-cell img[alt="Tikkurila"]{width:92px;max-width:92px;height:92px;object-fit:contain;filter:none}
.logo-grid .logo-cell img[alt="Oikotie"]{shape-rendering:geometricPrecision}
@media(max-width:640px){.logo-grid .logo-cell img[alt="Tikkurila"]{width:72px;max-width:72px;height:72px}}

.logo-grid .logo-cell img[alt="Oikotie"]{filter:none;width:100%;max-width:185px;height:55px}
@media(max-width:640px){.logo-grid .logo-cell img[alt="Oikotie"]{max-width:145px;height:43px}}

/* Official Oikotie Asunnot SVG: invert its black sign to the white-wall variant. */
.logo-grid .logo-cell img[alt="Oikotie"]{filter:invert(1);}