/* Creative showcase: original artwork, editorial framing. */
.creative-section{--head:'TIU Gia',Gia,Arial,sans-serif;--mint:#a9e9e0;--wash:#173f42;--soft:#bccbcb;background:#11191c;color:#f5f4ef;overflow:hidden}.creative-whole-story{--mint:#ccbaff;--wash:#342744;background:#18151f}.creative-opening{background:radial-gradient(ellipse at 80% 0%,#32364e 0,transparent 55%),#12181c}.creative-heading{position:relative;padding:0 0 48px}.creative-heading h1{position:relative;z-index:1;font:400 clamp(44px,6.4vw,100px)/1.02 var(--head);letter-spacing:-.045em;max-width:1100px;margin:18px 0}.creative-heading h1 em{font-weight:400;color:var(--mint)}.creative-kicker{font:11px/1.5 Arial,sans-serif;letter-spacing:.18em;text-transform:uppercase;color:var(--mint);margin:0 0 24px}.creative-route-number{position:absolute;right:0;bottom:22px;font:300 clamp(130px,20vw,300px)/1 var(--head);letter-spacing:-.08em;color:var(--mint);opacity:.07;pointer-events:none}.creative-route-links{display:grid;grid-template-columns:1fr 1fr;gap:32px}.creative-route-card{display:block;border-top:1px solid #ffffff36;padding-top:18px}.creative-preview{overflow:hidden;background:#f6f6f6}.creative-preview img{display:block;width:100%;height:auto;transition:transform .8s cubic-bezier(.2,.7,.2,1)}.creative-route-card:hover img{transform:scale(1.025)}.creative-card-label{display:grid;grid-template-columns:auto 1fr auto;gap:20px;align-items:start;padding:24px 0}.creative-card-label>span{color:var(--mint);font-size:14px}.creative-card-label h2{font:400 clamp(24px,2.5vw,38px)/1.15 var(--head);letter-spacing:-.025em;margin:0}.creative-route-card:last-child{--mint:#ccbaff}.creative-gallery{border-top:1px solid #ffffff30;padding-top:16px}.creative-stage{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain;background:#080b0d;border:1px solid #ffffff14;box-shadow:0 22px 60px #0003}.creative-stage::-webkit-scrollbar{display:none}.creative-frame{margin:0;flex:0 0 100%;width:100%;min-width:0;aspect-ratio:2001/1126;scroll-snap-align:start;scroll-snap-stop:always;display:grid;place-items:center;overflow:hidden}.creative-frame img,.creative-frame video{display:block;width:100%;height:100%;min-height:0;object-fit:contain}.creative-film-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;background:radial-gradient(ellipse,#283b40,#131a1d);color:#c5e6e3}.creative-film-placeholder>span{font-size:64px;line-height:1}.creative-film-placeholder p{font:400 clamp(28px,4vw,60px)/1.1 var(--head);margin:20px 0}.creative-film-placeholder small{font:12px/1.4 Arial;color:#b7c2c6}.creative-toolbar{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:24px 0}.creative-caption strong{font:400 23px/1.2 var(--head)}.creative-caption p{font:14px/1.5 Arial;color:var(--soft);margin:7px 0 0}.creative-controls{display:flex;align-items:center;gap:12px;flex-shrink:0}.creative-controls button,.creative-viewer button{border:1px solid #ffffff38;background:transparent;border-radius:0;padding:10px 15px;color:inherit;font:13px/1.5 Arial;min-height:44px}.creative-controls button:hover,.creative-viewer button:hover{background:#ffffff15;border-color:var(--mint)}.creative-controls button:disabled{opacity:.3;cursor:default}.creative-count{font:11px/1.5 Arial;letter-spacing:.08em;font-variant-numeric:tabular-nums;min-width:50px;text-align:center}.creative-thumbnails{display:flex;gap:12px;overflow-x:auto;padding:8px 0 20px;scrollbar-color:#718185 transparent;scrollbar-width:thin}.creative-thumbnails button{border:1px solid #ffffff26;background:#ffffff03;padding:5px;flex:0 0 146px;width:146px;text-align:left;transition:border-color .25s,background .25s}.creative-thumbnails button[aria-pressed=true]{border-color:var(--mint);background:color-mix(in srgb,var(--mint) 16%,transparent)}.creative-thumbnails img,.creative-thumb-placeholder{display:block;width:100%;height:76px;object-fit:contain;background:#0a0d0f}.creative-thumb-placeholder{text-align:center;font-size:40px}.creative-thumbnails button>span:last-child{display:block;font:10px/1.5 Arial;margin:8px 4px 4px;color:var(--soft)}.creative-rationale{border-top:1px solid #ffffff28;border-bottom:1px solid #ffffff28;margin-top:32px}.creative-rationale summary{display:flex;justify-content:space-between;gap:24px;padding:26px 0;cursor:pointer;list-style:none;font:400 24px/1.2 var(--head);color:var(--mint)}.creative-rationale summary::-webkit-details-marker{display:none}.creative-rationale[open] summary>span:last-child{transform:rotate(45deg)}.creative-rationale>div{columns:2;column-gap:7%;padding:0 0 24px}.creative-rationale p{break-inside:avoid;margin:0 0 22px;font:16px/1.7 Arial;color:#d5d7d9}.creative-next{display:flex;justify-content:space-between;gap:24px;padding:35px 0 0;font:400 24px/1.2 var(--head);color:var(--mint)}.creative-next span{transition:transform .3s}.creative-next:hover span{transform:translateY(5px)}
dialog.creative-viewer{background:#080b0f;padding:20px 28px;color:#f4f4f4;--mint:#ccbaff;overflow:hidden}dialog.creative-viewer[open]{opacity:1;transform:none;display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:16px}dialog.creative-viewer::backdrop{background:#080b0f}.creative-viewer-bar,.creative-viewer-nav{display:flex;justify-content:space-between;align-items:center;gap:20px}.creative-viewer-bar>div{display:flex;gap:10px}.creative-viewer-title{font:400 20px/1.25 'TIU Gia',Arial,sans-serif}.creative-viewer-content{overflow:auto;display:grid;place-items:center;min-height:0}.creative-viewer-content img,.creative-viewer-content video{display:block;width:100%;height:100%;min-height:0;object-fit:contain}.creative-viewer-content.is-zoomed{display:block}.creative-viewer-content.is-zoomed img{width:200%;max-width:none;height:auto}.creative-viewer-count{font:12px Arial;letter-spacing:.12em}body.creative-viewer-open{overflow:hidden}.creative-section .creative-route-card{transition:opacity .7s,translate .7s}.motion-enabled .creative-section:not(.in-view) .creative-route-card{opacity:0;translate:0 30px}.creative-route-card:nth-child(2){transition-delay:.1s}
@media(min-width:1151px){header nav{gap:18px}}
@media(max-width:760px){.creative-heading{padding-bottom:28px}.creative-route-links{grid-template-columns:1fr;gap:20px}.creative-toolbar{align-items:flex-start;flex-direction:column;gap:18px}.creative-controls{width:100%;justify-content:space-between;gap:8px}.creative-caption strong{font-size:21px}.creative-controls button{padding:10px 12px}.creative-rationale>div{columns:1}.creative-thumbnails button{flex-basis:120px}.creative-thumbnails img{height:62px}.creative-film-placeholder>span{font-size:34px}.creative-film-placeholder p{margin:10px 0}.creative-film-placeholder small{font-size:9px}.creative-viewer-bar{align-items:flex-start;gap:10px}.creative-viewer-title{font-size:15px}.creative-viewer-bar>div{gap:5px}.creative-viewer button{padding:9px;font-size:11px}dialog.creative-viewer{padding:14px}.creative-next{font-size:20px}}
@media(prefers-reduced-motion:reduce){.creative-section *{transition:none!important;scroll-behavior:auto!important}.motion-enabled .creative-section:not(.in-view) .creative-route-card{opacity:1;translate:none}}
/* Keep the artwork and its navigation in one presentation viewport. */
.creative-section{padding:18px 5vw 22px;min-height:0!important;height:calc(100svh - 86px);display:flex;flex-direction:column;gap:14px;scroll-margin-top:86px}.creative-section>*{width:100%;min-width:0}.creative-section .section-label{margin:0;padding-bottom:10px;flex-shrink:0}.creative-section .creative-heading{padding:0;flex-shrink:0}.creative-section .creative-heading h1{font-size:clamp(25px,3.2vw,48px);margin:0;line-height:1.05;max-width:none}.creative-section .creative-heading h1 br{display:none}.creative-section .creative-kicker,.creative-section .creative-route-number{display:none}.creative-section .creative-gallery{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1fr) 145px;grid-template-rows:minmax(0,1fr) 54px;gap:12px 18px;padding-top:12px}.creative-section .creative-stage{grid-column:1;grid-row:1;min-width:0;min-height:0;height:100%;box-shadow:none}.creative-section .creative-frame{height:100%;aspect-ratio:auto}.creative-section .creative-frame img,.creative-section .creative-frame video{aspect-ratio:16/9;object-fit:contain}.creative-section .creative-thumbnails{grid-column:2;grid-row:1/-1;flex-direction:column;min-height:0;overflow:auto;padding:0 6px 0 0;gap:8px}.creative-section .creative-thumbnails button{flex:0 0 auto;width:100%;padding:4px}.creative-section .creative-thumbnails img,.creative-section .creative-thumb-placeholder{height:64px}.creative-section .creative-thumbnails button>span:last-child{font-size:9px;margin:4px 2px}.creative-section .creative-toolbar{grid-column:1;grid-row:2;padding:0;gap:14px;min-width:0}.creative-section .creative-caption{min-width:0}.creative-section .creative-caption strong{font-size:18px}.creative-section .creative-caption p{font-size:11px;margin-top:3px;line-height:1.35}.creative-section .creative-controls{gap:8px}.creative-section .creative-controls button{padding:8px 11px}.creative-footline{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-shrink:0;border-top:1px solid #ffffff20;padding-top:10px}.creative-thinking-button{background:none;border:0;padding:4px 0;font:12px/1.5 Arial;color:var(--soft)}.creative-footline .creative-next{padding:0;margin:0;max-width:none;gap:20px;font-size:15px}.creative-opening .creative-route-links{flex:1;min-height:0;align-items:center}.creative-opening .creative-route-card{min-height:0;max-height:100%;display:flex;flex-direction:column;padding-top:10px}.creative-opening .creative-preview{min-height:0;background:transparent}.creative-opening .creative-preview img{max-height:calc(100svh - 285px);object-fit:contain}.creative-opening .creative-card-label{padding:16px 0 0;gap:14px}.creative-opening .creative-card-label h2{font-size:clamp(20px,2.5vw,34px)}
dialog.creative-thinking-dialog{padding:clamp(24px,6vw,80px);background:#151b21;overflow:auto}dialog.creative-thinking-dialog[open]{opacity:1;transform:none}.creative-thinking-dialog .creative-rationale{max-width:1000px;margin:40px auto}.creative-thinking-dialog .creative-rationale h2{font:400 clamp(28px,4vw,52px)/1.15 'TIU Gia',Arial;color:#ccbaff}.creative-thinking-close{display:block;margin-left:auto;background:transparent;border:1px solid #ffffff40;padding:10px 20px;color:inherit}
@media(max-width:760px){.creative-section{padding:14px 20px 18px;gap:10px}.creative-section .creative-gallery{grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr) 76px 48px;gap:8px}.creative-section .creative-thumbnails{grid-column:1;grid-row:3;flex-direction:row;overflow-x:auto;padding:0;gap:6px}.creative-section .creative-thumbnails button{flex:0 0 110px;width:110px;padding:5px}.creative-section .creative-thumbnails img,.creative-section .creative-thumb-placeholder{display:none}.creative-section .creative-thumbnails button>span:last-child{font-size:10px}.creative-section .creative-toolbar{grid-row:2;gap:6px;flex-direction:column}.creative-section .creative-caption{display:flex;gap:10px;align-items:baseline}.creative-section .creative-caption strong{font-size:15px}.creative-section .creative-caption p{font-size:10px;max-width:55%}.creative-section .creative-controls{width:100%;justify-content:space-between}.creative-section .creative-controls button{min-height:36px;padding:6px 10px}.creative-footline .creative-next{font-size:12px;gap:8px}.creative-thinking-button{font-size:11px}.creative-opening .creative-route-links{grid-template-columns:1fr 1fr;gap:14px}.creative-opening .creative-card-label{grid-template-columns:1fr;gap:8px}.creative-opening .creative-card-label h2{font-size:20px}.creative-opening .creative-card-label>span:last-child{display:none}}
@media(max-height:540px) and (min-width:761px){.creative-section{gap:8px;padding-top:10px;padding-bottom:12px}.creative-section .section-label{padding-bottom:5px}.creative-section .creative-heading h1{font-size:26px}.creative-section .creative-gallery{grid-template-columns:minmax(0,1fr) 120px;grid-template-rows:minmax(0,1fr) 44px;padding-top:6px;gap:8px}.creative-footline{padding-top:4px}.creative-section .creative-caption p{display:none}}
/* Route-two idea reveal, before the artwork carousel. */
.creative-rationale-reveal{--head:'TIU Gia',Gia,Arial,sans-serif;--mint:#ccbaff;--wash:#342744;--soft:#c5bed3;background:radial-gradient(ellipse at 8% 42%,#302941 0,transparent 58%),#18151f;min-height:calc(100svh - 86px)!important;padding:26px 5vw 30px;display:flex;flex-direction:column;gap:24px}.creative-rationale-reveal>*{width:100%;min-width:0}.creative-rationale-reveal .section-label{margin:0;padding-bottom:12px}.reveal-route-heading{display:flex;align-items:baseline;justify-content:space-between;gap:24px}.reveal-route-heading>p{margin:0;font:11px/1.5 Arial;letter-spacing:.16em;text-transform:uppercase;color:var(--mint)}.reveal-route-heading h1{font:400 clamp(36px,4.3vw,66px)/1.05 var(--head);letter-spacing:-.04em;margin:0}.reveal-route-heading h1 em{color:var(--mint)}.reveal-route-grid{display:grid;grid-template-columns:1.05fr 1fr;gap:5%;align-items:center;flex:1}.reveal-route-moodboard{margin:0;min-width:0}.reveal-route-moodboard img{display:block;width:100%;height:auto;box-shadow:0 25px 70px #0004}.reveal-route-moodboard figcaption{display:flex;justify-content:space-between;gap:20px;padding-top:15px;font:10px/1.5 Arial;letter-spacing:.05em;color:var(--soft)}.reveal-route-copy p{font:clamp(14px,1.12vw,17px)/1.55 Arial;color:#d7d2df;margin:0 0 17px}.reveal-route-copy p:first-child{font-family:var(--head);font-size:clamp(19px,1.55vw,24px);line-height:1.3;color:#f4f1f8}.reveal-route-copy p:last-child{margin-bottom:0;color:#ddd0fb}.reveal-route-cta{display:flex;justify-content:space-between;border-top:1px solid #ffffff30;padding-top:16px;color:var(--mint);font:400 22px/1.2 var(--head)}.reveal-route-cta span:last-child{transition:transform .3s}.reveal-route-cta:hover span:last-child{transform:translateY(5px)}.motion-enabled .creative-rationale-reveal .reveal-route-moodboard,.motion-enabled .creative-rationale-reveal .reveal-route-copy p{transition:opacity .9s ease,transform .9s cubic-bezier(.2,.7,.2,1);opacity:0;transform:translateY(24px)}.motion-enabled .creative-rationale-reveal.in-view .reveal-route-moodboard,.motion-enabled .creative-rationale-reveal.in-view .reveal-route-copy p{opacity:1;transform:none}.creative-rationale-reveal .reveal-route-copy p:nth-child(1){transition-delay:.15s}.creative-rationale-reveal .reveal-route-copy p:nth-child(2){transition-delay:.3s}.creative-rationale-reveal .reveal-route-copy p:nth-child(3){transition-delay:.45s}.creative-rationale-reveal .reveal-route-copy p:nth-child(4){transition-delay:.6s}
@media(max-width:760px){.creative-rationale-reveal{padding:22px 20px 28px;gap:20px}.reveal-route-heading{display:block}.reveal-route-heading>p{margin-bottom:12px}.reveal-route-grid{grid-template-columns:1fr;gap:24px}.reveal-route-moodboard{max-width:560px;margin:auto}.reveal-route-copy p{font-size:15px}.reveal-route-copy p:first-child{font-size:22px}}
@media(prefers-reduced-motion:reduce){.motion-enabled .creative-rationale-reveal .reveal-route-moodboard,.motion-enabled .creative-rationale-reveal .reveal-route-copy p{transition:none;opacity:1;transform:none}}
/* Two-line statement, sized against the available text width. */
#s17 .section-head{container-type:inline-size}
#s17 .section-head h1{font-size:5.6vw;font-size:clamp(20px,6.6cqw,96px);max-width:none!important;line-height:1.12;letter-spacing:-.035em}
#s17 .section-head h1>span{display:block;white-space:nowrap}
#s17 .section-head h1 em{display:inline;margin-left:0;white-space:nowrap}
/* Slowly moving light stays behind the artwork and navigation. */
#creative-perspective,#creative-whole-story{isolation:isolate}
#creative-perspective:before,#creative-whole-story:before{display:none}
#creative-perspective>.creative-atmosphere,#creative-whole-story>.creative-atmosphere{position:absolute;inset:-18%;width:auto;max-width:none;margin:0;z-index:0;pointer-events:none;overflow:hidden;opacity:.8}
#creative-perspective>:not(.creative-atmosphere),#creative-whole-story>:not(.creative-atmosphere){position:relative;z-index:1}
.creative-atmosphere:before,.creative-atmosphere:after{content:'';position:absolute;inset:0;transform-origin:center}
#creative-whole-story{background:#141526}
#creative-whole-story>.creative-atmosphere:before{background:radial-gradient(ellipse at 17% 35%,#468bff99,transparent 48%),radial-gradient(ellipse at 83% 65%,#ee78b78c,transparent 49%);filter:blur(55px);animation:creativeColourDrift 19s ease-in-out infinite alternate}
#creative-whole-story>.creative-atmosphere:after{background:radial-gradient(ellipse at 65% 10%,#678cf15c,transparent 42%),radial-gradient(ellipse at 30% 85%,#ec94ce55,transparent 42%);filter:blur(65px);animation:creativeColourDrift 26s ease-in-out -11s infinite alternate-reverse}
#creative-perspective{background:#101c23}
#creative-perspective>.creative-atmosphere:before{background:conic-gradient(from 26deg at 25% 42%,transparent 0deg,#7ce4df28 42deg,#dcfffd7a 44deg,#4398c344 48deg,transparent 87deg,transparent 176deg,#bccaf343 180deg,#8ce9dc60 183deg,transparent 220deg),conic-gradient(from 143deg at 76% 60%,transparent 0deg,#57849b35 49deg,#b9e8ec65 51deg,#b4a9d94a 57deg,transparent 100deg,#577e9230 166deg,#b7e6f056 170deg,transparent 177deg);filter:blur(12px);animation:creativePrismDrift 24s ease-in-out infinite alternate}
#creative-perspective>.creative-atmosphere:after{inset:-15%;background:repeating-linear-gradient(118deg,transparent 0%,transparent 18%,#86c5d421 19%,#d6fbf45a 19.5%,#8cb0e131 20%,transparent 22%,transparent 38%);filter:blur(7px);mix-blend-mode:screen;opacity:.5;animation:creativePrismSheen 20s ease-in-out -8s infinite alternate}
#creative-perspective:not(.in-view)>.creative-atmosphere:before,#creative-perspective:not(.in-view)>.creative-atmosphere:after,#creative-whole-story:not(.in-view)>.creative-atmosphere:before,#creative-whole-story:not(.in-view)>.creative-atmosphere:after{animation-play-state:paused}
@keyframes creativeColourDrift{0%{transform:translate(-4%,-3%) rotate(-6deg) scale(1)}50%{transform:translate(3%,4%) rotate(4deg) scale(1.1)}100%{transform:translate(5%,-2%) rotate(9deg) scale(1.05)}}
@keyframes creativePrismDrift{from{transform:translate(-3%,-2%) rotate(-7deg) scale(1)}to{transform:translate(4%,3%) rotate(8deg) scale(1.14)}}
@keyframes creativePrismSheen{from{transform:translateX(-7%) rotate(-4deg)}to{transform:translateX(9%) rotate(6deg)}}
@media(prefers-reduced-motion:reduce){.creative-atmosphere:before,.creative-atmosphere:after{animation:none!important}}
/* Concept one: individual image planes alongside the supplied rationale. */
#creative-perspective-reveal{--mint:#a9e9e0;--wash:#173f42;background:radial-gradient(ellipse at 12% 60%,#2b4e544d,transparent 65%),#11191c}
#creative-perspective-reveal .reveal-route-heading{align-items:center}
#creative-perspective-reveal .reveal-route-heading h1{font-size:clamp(32px,3.7vw,56px)}
#creative-perspective-reveal .reveal-route-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:5%;align-items:center}
#creative-perspective-reveal .reveal-route-copy p:last-child{color:#c4e7e2}
.perspective-moodboard{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(2,clamp(155px,19vw,240px));gap:12px;padding:28px 0;min-width:0}
.inspiration-image{margin:0;min-width:0;transform:translateY(var(--image-y,0px));will-change:transform}
.inspiration-image:nth-child(3n+2){margin-top:-18px;margin-bottom:18px}
.inspiration-image img{display:block;width:100%;height:100%;object-fit:cover;border:1px solid #ffffff1c;box-shadow:0 14px 30px #0003}
.perspective-intro.images-enhanced .inspiration-image img{opacity:0;transform:translateY(42px) scale(.96);transition:opacity .9s ease var(--entry-delay),transform 1.15s cubic-bezier(.2,.7,.2,1) var(--entry-delay)}
.perspective-intro.images-arrived .inspiration-image img{opacity:1;transform:none}
@media(max-width:760px){#creative-perspective-reveal .reveal-route-grid{grid-template-columns:1fr;gap:20px}.perspective-moodboard{grid-template-rows:repeat(2,clamp(125px,27vw,190px));gap:9px;padding:20px 0}.inspiration-image:nth-child(3n+2){margin-top:-10px;margin-bottom:10px}}
@media(prefers-reduced-motion:reduce){.perspective-intro .inspiration-image{transform:none!important;will-change:auto}.perspective-intro.images-enhanced .inspiration-image img{opacity:1;transform:none;transition:none}}
/* Both concept-intro titles follow the same left edge as their artwork. */
.creative-rationale-reveal .reveal-route-heading{display:block;text-align:left;min-width:0}
.creative-rationale-reveal .reveal-route-heading>p{margin:0 0 14px}
.creative-rationale-reveal .reveal-route-heading>h1{margin:0;max-width:100%;min-width:0;overflow-wrap:normal;text-align:left}
.creative-rationale-reveal .reveal-route-heading>h1 em{margin-left:0}