/* Light, editorial portfolio. Static HTML stays complete without JavaScript. */
.portfolio-page,.portfolio-case{--portfolio-blue:#315df0;--portfolio-ink:#17243d;--portfolio-muted:#4a5871;--portfolio-line:#cbd4e4;--portfolio-paper:#f7f8fc;color:var(--portfolio-ink)}
.portfolio-page p,.portfolio-case p{color:var(--portfolio-muted)}
.portfolio-page .kicker,.portfolio-case .kicker{font-size:12px;line-height:1.6;letter-spacing:.1em;color:var(--portfolio-muted)}
.portfolio-page h1,.portfolio-case h1{font-size:clamp(46px,6.5vw,88px);line-height:1.04;font-weight:480;letter-spacing:-.06em;overflow-wrap:normal}
.portfolio-page h1 em,.portfolio-case h1 em{font-style:normal;color:var(--portfolio-blue)}
.portfolio-intro{padding:56px 6% 48px}
.portfolio-intro-line{display:grid;grid-template-columns:1.3fr 1fr;gap:70px;align-items:end}
.portfolio-intro-line>p{max-width:430px;font-size:18px;line-height:1.7;padding-bottom:6px}
.portfolio-lead{margin:0 6%;padding:40px;display:grid;grid-template-columns:.95fr 1.35fr;gap:48px;align-items:center;background:#e9eef9;border:1px solid #d7e0f0;border-radius:14px}
.portfolio-eyebrow{display:flex;justify-content:space-between;gap:24px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:#405379;margin-bottom:28px}
.portfolio-lead h2{font-size:clamp(48px,5.5vw,76px);line-height:.97;letter-spacing:-.055em;font-weight:550;color:#13233d}
.portfolio-lead-copy>p{font-size:16px;line-height:1.75;margin-top:25px;max-width:420px}
.portfolio-scope{list-style:none;padding:0;margin:25px 0;display:flex;flex-wrap:wrap;gap:7px 13px;font-size:11px;color:#405379}
.portfolio-scope li{border-bottom:1px solid #b9c9e7;padding-bottom:5px}
.portfolio-lead-links{display:flex;align-items:flex-start;flex-direction:column;gap:16px;margin-top:30px}
.portfolio-lead .button{font-size:14px;background:var(--portfolio-blue);padding:13px 22px;min-height:48px}
.portfolio-lead .button:hover{background:#2048ce}
.portfolio-domain{display:inline-flex;align-items:center;gap:20px;font-size:13px;font-weight:650;color:#2049c9;line-height:1.65;overflow-wrap:anywhere}
.portfolio-domain>span:first-child{border-bottom:1px solid transparent;transition:border-color .2s}
.portfolio-domain:hover>span:first-child{border-color:currentColor}
.portfolio-domain>span:last-child{transition:transform .2s}
.portfolio-domain:hover>span:last-child{transform:translate(2px,-2px)}
.portfolio-lead-image{display:block;min-width:0}
.portfolio-browser{overflow:hidden;border:1px solid #b2bfd7;border-radius:7px;background:#fff;box-shadow:0 18px 38px #13233d12}
.portfolio-browser-top{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:10px 13px;background:#f9fbff;border-bottom:1px solid #cbd4e4;font-size:10px;font-weight:500;line-height:1.4;color:#4c5b74}
.portfolio-browser-top>span:first-child{color:#9cabc3;font-size:8px;letter-spacing:3px}
.portfolio-browser img{display:block;width:100%;height:auto}
.portfolio-image-caption{display:flex;justify-content:space-between;align-items:center;gap:20px;font-size:12px;line-height:1.7;color:#405379;margin-top:15px}
.portfolio-lead-image .portfolio-browser{transition:transform .35s,box-shadow .35s}
.portfolio-lead-image:hover .portfolio-browser{transform:translateY(-5px);box-shadow:0 24px 45px #13233d22}
.portfolio-catalog-head{padding:85px 6% 28px}
.portfolio-catalog-head>div{display:grid;grid-template-columns:1.3fr 1fr;gap:70px;align-items:end}
.portfolio-catalog-head h2,.portfolio-next h2{font-size:clamp(35px,4.2vw,56px);line-height:1.1;letter-spacing:-.05em}
.portfolio-catalog-head p{font-size:16px;max-width:440px;line-height:1.75}
.portfolio-category-nav{margin:0 6%;padding:22px 0;display:flex;flex-wrap:wrap;gap:12px 25px;border-top:1px solid var(--portfolio-line);border-bottom:1px solid var(--portfolio-line)}
.portfolio-category-nav a{font-size:12px;line-height:1.7;color:#294caa;padding:4px 0}
.portfolio-category-nav a:hover{text-decoration:underline;text-underline-offset:5px}
.portfolio-catalog{padding:12px 6% 60px}
.portfolio-group{padding-top:45px;scroll-margin-top:110px}
.portfolio-group>header{display:flex;justify-content:space-between;align-items:center;gap:25px;margin-bottom:24px}
.portfolio-group>header h2{font-size:26px;letter-spacing:-.035em;line-height:1.25;font-weight:500}
.portfolio-group>header>span{font-size:12px;white-space:nowrap;color:var(--portfolio-muted)}
.portfolio-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:38px 24px}
.portfolio-card{min-width:0;scroll-margin-top:110px}
.portfolio-card-image{position:relative;display:block;padding:16px 13px 0;aspect-ratio:1.48;overflow:hidden;border-radius:9px;background:#e0e7f3;border:1px solid #d0daeb;color:#fff}
.portfolio-card-image>img{width:100%;height:100%;display:block;object-fit:cover;object-position:top;border-radius:4px 4px 0 0;box-shadow:0 9px 22px #1428471a;transition:transform .45s}
.portfolio-card-image>span[aria-hidden=true]{display:none}
.portfolio-image-label{position:absolute;right:14px;bottom:14px;padding:8px 12px;border-radius:30px;background:#f9fbfff0;color:#172f62;box-shadow:0 4px 15px #0f1e3810;font-size:10px;font-weight:650;line-height:1.6;transition:background .2s,color .2s}
.portfolio-card-image:hover>img{transform:scale(1.025)}
.portfolio-card-image:hover .portfolio-image-label{background:#315df0;color:#fff}
.portfolio-card-meta{display:flex;flex-wrap:wrap;gap:4px 14px;margin-top:18px;font-size:10px;line-height:1.7;color:#4d5d78}
.portfolio-card h3{font-size:24px;font-weight:550;letter-spacing:-.035em;line-height:1.2;margin-top:8px}
.portfolio-card>p{font-size:14px;line-height:1.75;margin-top:13px}
.portfolio-card>.portfolio-domain{margin-top:17px;font-size:12px}
.portfolio-next{padding:55px 6% 70px;border-top:1px solid var(--portfolio-line);display:grid;grid-template-columns:1fr 1fr;gap:22px 70px;background:#eef2fa}
.portfolio-next>.kicker{grid-column:1/-1;margin-bottom:0}
.portfolio-next p{font-size:17px;line-height:1.8;max-width:500px}
.portfolio-next>div{grid-column:2;display:flex;flex-wrap:wrap;gap:20px 30px}
.portfolio-next .text-button{font-size:14px}
/* LUUX: the case keeps the media and the agency's contribution distinct. */
.case-intro{padding:54px 6% 42px}
.case-intro h1{max-width:1200px;font-size:clamp(43px,6.2vw,84px)}
.case-intro-bottom{margin-top:32px;display:flex;justify-content:space-between;align-items:flex-end;gap:50px}
.case-intro-bottom>p{max-width:690px;font-size:20px;line-height:1.65}
.case-intro-bottom .button{flex-shrink:0;font-size:14px;background:var(--portfolio-blue)}
.case-opening{margin:0 6%}
.case-opening>.portfolio-browser{padding:0;background:#111318;border-color:#252c3c}
.case-opening>.portfolio-browser>img{max-height:640px;object-fit:cover;object-position:top}
.case-opening figcaption,.case-studio-image figcaption{margin-top:13px;font-size:12px;line-height:1.7;color:var(--portfolio-muted)}
.case-facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:26px;margin:32px 6% 0;padding:25px 0;border-top:1px solid var(--portfolio-line);border-bottom:1px solid var(--portfolio-line)}
.case-facts dt{font-size:11px;color:var(--portfolio-muted);margin-bottom:6px}
.case-facts dd{font-size:14px;line-height:1.7;margin:0;font-weight:600}
.case-chapter{padding:80px 6%;display:grid;grid-template-columns:1fr 1fr;gap:80px}
.case-chapter h2,.case-section-heading h2,.case-studio h2,.case-outcome h2,.case-related h2{font-size:clamp(34px,4vw,55px);line-height:1.1;letter-spacing:-.05em}
.case-chapter-copy{align-self:end}
.case-chapter-copy p{font-size:17px;line-height:1.85;max-width:550px}
.case-chapter-copy p+p{margin-top:20px}
.case-approach{padding:65px 6%;background:#edf1f9}
.case-section-heading{max-width:750px}
.case-section-heading>p{font-size:18px;line-height:1.8;margin-top:24px;max-width:620px}
.case-decisions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px;margin-top:45px}
.case-decisions article{border-top:1px solid #b8c6de;padding-top:20px;min-width:0}
.case-decisions article>span{font-size:12px;color:#315df0}
.case-decisions h3{margin-top:26px;font-size:26px;line-height:1.25;letter-spacing:-.035em}
.case-decisions p{font-size:15px;line-height:1.85;margin-top:19px}
.case-decisions a{display:inline-block;font-size:13px;color:#2049c9;border-bottom:1px solid #b8c6de;padding-bottom:3px;margin-top:24px}
.case-studio{padding:80px 6%;display:grid;grid-template-columns:.9fr 1.1fr;gap:65px;align-items:center}
.case-studio-copy>p{font-size:16px;line-height:1.85;margin-top:23px}
.case-studio .button{background:#315df0;font-size:13px;margin-top:28px}
.case-studio-image{margin:0;min-width:0}
.case-studio-image img{width:100%;height:auto;display:block;border:1px solid #cbd4e4;border-radius:6px}
.case-page-tour{padding:65px 6%;background:#e9eef9}
.case-page-tour>.case-section-heading{display:grid;grid-template-columns:1fr 1fr;gap:20px 70px;max-width:none;align-items:end}
.case-page-tour>.case-section-heading>.kicker{grid-column:1/-1;margin:0}
.case-page-tour>.case-section-heading>p{font-size:16px;margin:0;line-height:1.8}
.case-tour-browser{max-width:1050px;margin:36px auto 0;border:1px solid #aabbd9;border-radius:8px;overflow:hidden;background:#fff;box-shadow:0 15px 40px #18305512}
.case-tour-scroll{height:540px;max-height:65svh;overflow:auto;overscroll-behavior:contain;scrollbar-color:#6e84b4 #eef2fa;scrollbar-width:thin;outline-offset:-4px}
.case-tour-scroll>img{display:block;width:100%;height:auto}
.case-tour-scroll:focus-visible{outline:3px solid #315df0}
.case-media-note{max-width:1000px;margin:20px auto 0;font-size:12px;line-height:1.75}
.case-outcome{padding:75px 6%;background:#101a35;color:#f7f9ff}
.case-outcome>.kicker{color:#b7c8eb}
.case-outcome>p{color:#c3d0e9;max-width:760px;margin-top:26px;font-size:18px;line-height:1.8}
.case-outcome>div,.case-related>div{display:flex;flex-wrap:wrap;gap:26px 34px;align-items:center;margin-top:32px}
.case-outcome .button{background:#4267ff;font-size:14px}
.case-outcome .text-button{font-size:14px;color:#f1f5ff}
.case-related{padding:70px 6%}
.case-related>p{max-width:720px;font-size:17px;line-height:1.8;margin-top:25px}
.case-related .text-button{font-size:15px}
@media(max-width:1100px){.portfolio-intro-line,.portfolio-catalog-head>div{gap:40px}.portfolio-lead{gap:30px;padding:30px}.portfolio-lead h2{font-size:57px}.portfolio-lead-copy>p{font-size:15px}.portfolio-scope{font-size:10px}.portfolio-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.case-intro-bottom>p{font-size:18px}.case-chapter{gap:50px}.case-studio{gap:35px}.case-decisions{gap:28px}}
@media(max-width:760px){
 .portfolio-intro{padding-top:38px;padding-bottom:35px}.portfolio-intro-line,.portfolio-catalog-head>div{grid-template-columns:1fr;gap:25px}.portfolio-intro-line>p{font-size:17px;max-width:560px;padding:0}.portfolio-page h1{font-size:clamp(47px,8.5vw,68px)}
 .portfolio-lead{grid-template-columns:1fr;gap:28px;padding:27px}.portfolio-lead h2{font-size:58px;line-height:1}.portfolio-lead h2 br{display:none}.portfolio-eyebrow{margin-bottom:20px}.portfolio-lead-copy>p{font-size:16px;max-width:550px;margin-top:20px}.portfolio-scope{font-size:11px;margin-bottom:0}.portfolio-lead-links{flex-direction:row;flex-wrap:wrap;align-items:center;gap:17px 23px;margin-top:24px}.portfolio-lead-image{grid-row:2}.portfolio-image-caption{font-size:11px}
 .portfolio-catalog-head{padding-top:55px}.portfolio-catalog-head>div{gap:23px}.portfolio-catalog-head p{max-width:560px}.portfolio-category-nav{gap:9px 22px;padding-block:18px}.portfolio-group>header h2{font-size:24px}.portfolio-grid{gap:34px 19px}.portfolio-card-meta{font-size:10px}.portfolio-card h3{font-size:23px}.portfolio-card>p{font-size:14px}.portfolio-card-image{padding:10px 9px 0;aspect-ratio:1.4}.portfolio-image-label{font-size:9px;padding:7px 9px;right:9px;bottom:10px}.portfolio-card>.portfolio-domain{font-size:11px;gap:10px}
 .portfolio-next{display:block;padding-top:45px;padding-bottom:50px}.portfolio-next h2{margin-bottom:24px}.portfolio-next p{font-size:16px}.portfolio-next>div{margin-top:25px}
 .case-intro{padding-top:37px;padding-bottom:32px}.case-intro h1{font-size:clamp(42px,7.5vw,66px)}.case-intro-bottom{display:block;margin-top:25px}.case-intro-bottom>p{font-size:17px;max-width:580px}.case-intro-bottom .button{margin-top:25px}.case-facts{grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}.case-facts dd{font-size:13px}.case-opening figcaption{font-size:11px}.case-chapter{grid-template-columns:1fr;gap:28px;padding-top:55px;padding-bottom:55px}.case-chapter-copy p{font-size:17px;max-width:none}.case-approach{padding-top:50px;padding-bottom:50px}.case-section-heading>p{font-size:17px}.case-decisions{grid-template-columns:1fr;gap:30px;margin-top:32px}.case-decisions article{display:grid;grid-template-columns:40px 1fr;gap:0 12px}.case-decisions article>span{grid-row:1/4;padding-top:5px}.case-decisions h3{margin:0;font-size:26px}.case-decisions h3 br{display:none}.case-decisions p{margin-top:14px;font-size:16px}.case-decisions a{justify-self:start;margin-top:17px;font-size:14px}.case-studio{grid-template-columns:1fr;gap:32px;padding-top:55px;padding-bottom:55px}.case-studio-copy>p{font-size:16px}.case-studio-image{max-width:650px}.case-page-tour{padding-top:50px;padding-bottom:40px}.case-page-tour>.case-section-heading{display:block}.case-page-tour>.case-section-heading>.kicker{margin-bottom:22px}.case-page-tour>.case-section-heading>p{font-size:16px;margin-top:24px}.case-tour-scroll{height:420px;max-height:58svh}.case-media-note{font-size:11px}.case-outcome{padding-top:55px;padding-bottom:55px}.case-outcome>p{font-size:17px}.case-related{padding-top:55px;padding-bottom:55px}.case-related>p{font-size:16px}
}
@media(max-width:480px){.portfolio-page h1{font-size:48px}.portfolio-page .kicker,.portfolio-case .kicker{font-size:10px}.portfolio-lead{padding:22px;margin-inline:5%}.portfolio-lead h2{font-size:48px}.portfolio-lead h2 br{display:block}.portfolio-lead-copy>p{font-size:15px}.portfolio-lead-links{gap:18px}.portfolio-lead .button{font-size:13px}.portfolio-lead .portfolio-domain{font-size:12px}.portfolio-catalog-head h2{font-size:36px}.portfolio-category-nav a{font-size:11px}.portfolio-grid{grid-template-columns:1fr;gap:35px}.portfolio-card-image{aspect-ratio:1.55;padding:15px 13px 0}.portfolio-card-meta{font-size:11px;margin-top:16px}.portfolio-card h3{font-size:26px}.portfolio-card>p{font-size:15px;margin-top:12px}.portfolio-card>.portfolio-domain{font-size:13px}.portfolio-image-label{font-size:10px;padding:8px 12px;right:13px}.portfolio-group>header{gap:15px}.portfolio-group>header h2{font-size:23px}.portfolio-group>header>span{font-size:10px}.case-intro h1{font-size:41px;line-height:1.08}.case-intro-bottom>p{font-size:16px}.case-intro-bottom .button{font-size:13px}.case-facts{margin-top:22px;gap:20px 15px}.case-chapter h2,.case-section-heading h2,.case-studio h2,.case-outcome h2,.case-related h2{font-size:36px}.case-chapter-copy p{font-size:16px}.case-decisions article{grid-template-columns:24px 1fr;gap:0 10px}.case-decisions h3{font-size:24px}.case-outcome>p{font-size:16px}.case-outcome>div{gap:22px}.case-outcome .button{font-size:13px}.portfolio-browser-top{padding:8px 10px;font-size:9px}.portfolio-browser-top>span:first-child{font-size:6px}}
@media(prefers-reduced-motion:reduce){.portfolio-page *,.portfolio-case *{transition:none!important;animation:none!important}}
