/* The photograph opens into colour, passes through a response, then resolves. */
.chromatic-story{background:#eae8e1;color:#252722;overflow:clip}.chromatic-intro{padding-top:100px;padding-bottom:50px;display:flex;align-items:end;justify-content:space-between;gap:40px}.chromatic-intro h2{font-size:clamp(48px,6.4vw,94px);line-height:1;letter-spacing:-.04em}.chromatic-intro>p{max-width:410px;font-size:19px;line-height:1.5;color:#65675e}.chromatic-scroll{height:330svh}.chromatic-pin{position:sticky;top:76px;height:calc(100svh - 76px);min-height:620px;display:flex;flex-direction:column;justify-content:center;gap:14px}.chromatic-copy{text-align:center;height:116px;flex:none;position:relative;z-index:3}.chromatic-copy h3{font-size:clamp(34px,4vw,58px);letter-spacing:-.04em;line-height:1.05;margin:0 0 14px;text-wrap:balance}.chromatic-copy p{font-size:16px;line-height:1.5;color:#64675c;max-width:550px;margin:auto;text-wrap:balance}.chromatic-stage{height:50svh;max-height:550px;min-height:310px;position:relative;isolation:isolate;width:100%;perspective:1200px}.chromatic-diagram{position:absolute;inset:-20px -4%;pointer-events:none;opacity:var(--field,0)}.chromatic-spectrum{width:100%;height:100%;overflow:visible}.chromatic-threads path{fill:none;stroke-width:1.3;vector-effect:non-scaling-stroke}.chromatic-gate{opacity:var(--gate,0);transform:translateX(calc((1 - var(--gate,0))*150px));transform-origin:center}.chromatic-gate path:first-child{fill:#eeede4;fill-opacity:.45;stroke:#8b9180;stroke-width:1}.chromatic-gate path+path{fill:none;stroke:#8b9180;stroke-width:.6}.chromatic-signal-label{position:absolute;top:50%;font-size:11px;letter-spacing:.02em;color:#4a5240;background:#eae8e1;padding:7px}.input-label{left:0}.output-label{right:0}.chromatic-proof{position:absolute;top:50%;left:50%;margin:0;width:var(--photo-width,62%);transform:translate(-50%,-50%) scale(var(--photo-scale,1)) rotateY(calc(var(--split,0)*-12deg));z-index:2;will-change:transform}.chromatic-photo-device{padding:8px;background:rgba(37,38,34,var(--frame,1));border-radius:15px;box-shadow:0 22px 50px rgba(34,37,31,calc(var(--frame,1)*.18));}.chromatic-device-top{display:flex;gap:9px;align-items:center;padding:6px 8px 12px;color:#cfcec6;font-size:10px;opacity:var(--frame,1)}.chromatic-device-top img{width:17px;height:16px}.chromatic-device-dot{margin-left:auto;width:5px;height:5px;border-radius:50%;background:#9aaa79}.chromatic-photo{position:relative;aspect-ratio:1.502;overflow:visible}.chromatic-originals{position:absolute;inset:0;border-radius:5px;overflow:hidden;opacity:calc(1 - var(--split,0))}.chromatic-photo img{width:100%;height:100%;display:block;object-fit:cover}.chromatic-photo .chromatic-overlay{position:absolute;inset:0;opacity:0}.chromatic-fragments{position:absolute;inset:0;opacity:var(--split,0);pointer-events:none}.chromatic-fragment{position:absolute;inset:0;will-change:transform}.chromatic-fragment img{position:absolute;inset:0}.chromatic-fragment img+img{opacity:var(--film,0)}.chromatic-photo-label{display:flex;justify-content:space-between;align-items:center;color:#e7e6dc;padding:14px 10px 8px;font-size:13px;opacity:var(--frame,1)}.chromatic-photo-label span+span{font-size:10px;color:#bcc0ae}.chromatic-controls{width:100%;position:relative;z-index:4}.chromatic-choices{display:flex;justify-content:center;gap:38px}.chromatic-choices button{border:0;border-radius:0;background:none;padding:12px 0;color:#686c60;position:relative;font:inherit;font-size:13px;cursor:pointer;min-height:44px}.chromatic-choices button[aria-pressed=true]{color:#22251f}.chromatic-choices i{position:absolute;bottom:0;left:0;width:100%;height:2px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform 200ms}.chromatic-choices button[aria-pressed=true] i{transform:scaleX(1)}.chromatic-choices button:disabled{cursor:wait}#chromatic-evidence{text-align:center;font-size:11px;color:#646a5d;margin:16px 0 0}.chromatic-error{text-align:center;font-size:12px}.chromatic-error button{font:inherit;background:none;border:0;text-decoration:underline;cursor:pointer}.chromatic-bottom{display:flex;align-items:center;gap:25px;color:#69715f;font-size:10px;margin-top:25px}.chromatic-track{height:1px;background:#c6cabe;flex:1}.chromatic-track i{display:block;width:100%;height:1px;background:#555c48;transform:scaleX(0);transform-origin:left}.chromatic-foundation{padding-block:80px 100px;border-top:1px solid #cfcec5;display:grid;grid-template-columns:1fr 1fr;gap:12%}.chromatic-foundation>p{font-size:36px;letter-spacing:-.04em;line-height:1.08}.chromatic-foundation>div>p{font-size:18px;line-height:1.55;color:#64675c;margin-bottom:30px}.chromatic-foundation details{border-top:1px solid #cecec4;font-size:13px}.chromatic-foundation summary{display:flex;justify-content:space-between;padding:19px 0;cursor:pointer;list-style:none}.chromatic-foundation details p{padding-bottom:20px;color:#64675c;line-height:1.65}.colour-scenes{padding-bottom:100px}.colour-scenes figcaption{display:none}
.batch-workflow{padding:24px;background:#e8e6df;border:1px solid #d9d7ce;border-radius:18px;margin-top:48px}.batch-toolbar,.batch-toolbar>div,.batch-footer,.batch-footer>div{display:flex;align-items:center;gap:14px}.batch-toolbar,.batch-footer{justify-content:space-between}.batch-toolbar svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.4}.batch-toolbar{font-size:14px}.batch-toolbar strong{font-weight:400;font-size:11px;color:#777a6e}.batch-recipe{padding:10px 12px;border:1px solid #d1d1c5;border-radius:8px;background:#f2f0e9}.batch-recipe img{width:20px;height:18px}.batch-recipe span span{color:#787b6c}.batch-route{display:flex;align-items:center;gap:20px;padding:28px 0;font-size:11px;color:#737668}.batch-route>div{flex:1;height:1px;background:#cccec0;overflow:hidden}.batch-route i{display:block;width:100%;height:100%;background:#6b7959;transform:scaleX(var(--batch,0));transform-origin:left}.batch-workflow .contact-sheet{gap:10px;margin:0;align-items:start}.batch-workflow .contact-sheet figure{position:relative;transform:none!important;opacity:1!important;min-width:0;border-radius:5px;overflow:hidden;border:2px solid transparent;transition:border-color 250ms}.batch-workflow .contact-sheet figure[data-done=true]{border-color:#85946d}.batch-workflow .contact-sheet img{border-radius:2px;width:100%;aspect-ratio:2/3;object-fit:cover;transform:none!important}.batch-selected{position:absolute;top:9px;right:9px;width:20px;height:20px;border-radius:50%;background:#f3f0e8d9;display:grid;place-items:center;color:#4a5540}.batch-selected svg{width:15px;fill:none;stroke:currentColor;stroke-width:1.5}.batch-workflow figure[data-done=true] .batch-selected{background:#6b7c55;color:white}.batch-workflow figcaption{display:flex;justify-content:center;font-size:10px;padding:9px 0 5px;color:#777b6c}.batch-footer{margin-top:22px;font-size:12px;color:#666b5b;gap:30px}.batch-footer p{max-width:430px;line-height:1.5}.batch-footer>div{flex-shrink:0}.batch-footer button{border:0;background:none;font:inherit;padding:10px 0;display:flex;align-items:center;gap:8px;cursor:pointer;color:#303729}.batch-footer button svg{width:15px;height:15px;fill:currentColor}.batch-proof{text-align:center;font-size:11px;color:#818477;margin-top:18px}.personal-images{isolation:isolate}.native-phones>span{font-size:11px}

@media(max-width:760px){.chromatic-intro{display:block;padding-top:70px;padding-bottom:35px}.chromatic-intro h2{font-size:52px}.chromatic-intro>p{font-size:16px;margin-top:24px;max-width:320px}.chromatic-scroll{height:310svh}.chromatic-pin{top:64px;height:calc(100svh - 64px);min-height:580px;gap:10px}.chromatic-copy{height:140px;padding-top:10px}.chromatic-copy h3{font-size:36px;max-width:330px;margin:0 auto 16px}.chromatic-copy p{font-size:14px;line-height:1.5;max-width:310px}.chromatic-stage{height:36svh;min-height:260px;max-height:330px}.chromatic-diagram{inset:0 -4%}.chromatic-threads path{stroke-width:1}.chromatic-signal-label{font-size:9px;top:94%;padding:3px}.chromatic-proof{width:88%}.chromatic-photo-device{padding:5px;border-radius:10px}.chromatic-device-top{padding:4px 4px 7px;font-size:8px}.chromatic-device-top img{width:14px;height:13px}.chromatic-photo-label{padding:9px 5px 4px;font-size:10px}.chromatic-photo-label span+span{font-size:8px}.chromatic-choices{gap:28px}.chromatic-choices button{font-size:12px}#chromatic-evidence{font-size:10px;margin-top:13px}.chromatic-bottom{margin-top:23px;font-size:9px;gap:20px}.chromatic-bottom>span:last-child{display:none}.chromatic-foundation{display:block;padding-block:50px}.chromatic-foundation>p{font-size:32px;margin-bottom:28px}.chromatic-foundation>div>p{font-size:16px}.colour-scenes{padding-bottom:60px}.batch-workflow{padding:14px;margin-top:28px;border-radius:12px}.batch-toolbar{align-items:start;gap:12px;font-size:12px}.batch-toolbar>div{gap:7px;flex-wrap:wrap}.batch-toolbar strong{width:100%;padding-left:26px;font-size:10px}.batch-recipe{padding:7px;flex-wrap:nowrap!important;gap:5px!important;white-space:nowrap;font-size:11px}.batch-recipe img{width:15px;height:14px}.batch-recipe>svg{display:none}.batch-route{padding:22px 0;gap:10px;font-size:9px}.batch-workflow .contact-sheet{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.batch-selected{width:16px;height:16px;top:5px;right:5px}.batch-selected svg{width:12px}.batch-workflow figcaption{font-size:9px;padding-block:7px 2px}.batch-footer{display:block;margin-top:18px}.batch-footer>div{justify-content:space-between;margin-top:8px}.batch-proof{font-size:10px;line-height:1.5}.training-strip figcaption{font-size:11px}}
@media(max-height:640px){.chromatic-scroll{height:auto}.chromatic-pin{position:relative;top:0;height:auto;min-height:0;padding-block:40px 55px}.chromatic-stage{height:340px}.chromatic-bottom{display:none}}
@media(prefers-reduced-motion:reduce){.chromatic-scroll{height:auto}.chromatic-pin{position:relative;top:0;height:auto;min-height:0;padding-block:40px 60px}.chromatic-diagram,.chromatic-bottom{display:none}.chromatic-choices i{transition:none}.chromatic-stage{height:400px}.chromatic-proof,.chromatic-fragment{will-change:auto}}
.personal-images .personal-after{opacity:1!important;clip-path:inset(0 0 0 var(--personal-split,50%));transition:none!important}.personal-divider{position:absolute;z-index:3;top:0;bottom:0;left:var(--personal-split,50%);width:1px;background:#fff9;pointer-events:none}.personal-divider>span{position:absolute;top:50%;left:0;transform:translate(-50%,-50%);width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:#f9f8f0e8;color:#343a30;box-shadow:0 2px 12px #0003;font-size:20px}.personal-comparison-labels{position:absolute;inset:16px 16px auto;display:flex;justify-content:space-between;z-index:2;font-size:11px;color:white;pointer-events:none}.personal-comparison-labels span{background:#1e241ed9;border-radius:4px;padding:6px 9px}#personal-split{position:absolute;inset:0;width:100%;height:100%;z-index:4;margin:0;opacity:0;cursor:ew-resize;touch-action:pan-y}#personal-split:focus-visible{opacity:1;outline:3px solid white;outline-offset:-3px;background:transparent;appearance:none}#personal-split:focus-visible::-webkit-slider-thumb{appearance:none;width:3px;height:100%;background:white}.personal-images:has(#personal-split:focus-visible){outline:3px solid var(--gold);outline-offset:3px}

/* A single typographic statement, followed by the photograph-led sequence. */
.chromatic-intro{display:block;text-align:center;padding-top:110px;padding-bottom:50px}.chromatic-intro h2{font-size:clamp(64px,8.2vw,96px);font-weight:570;line-height:.99;letter-spacing:-.04em}.chromatic-intro h2 span{font-weight:430;color:#626b59}.chromatic-intro>p{max-width:540px;margin:27px auto 0;font-size:18px;line-height:1.5}.chromatic-copy h3{font-weight:500}.chromatic-compare{display:block;margin:6px auto 0;padding:6px 12px;background:none;border:0;font:inherit;font-size:11px;min-height:34px;color:#58624c;text-decoration:underline;text-underline-offset:4px}.chromatic-compare[aria-pressed=true]{color:#242b1f}.chromatic-compare:disabled{visibility:hidden}.chromatic-controls #chromatic-evidence{margin-top:5px}.chromatic-controls .chromatic-bottom{margin-top:18px}
#looks[data-scene=daylight] .gallery-photo{aspect-ratio:.78}
@media(max-width:760px){.chromatic-intro{padding-top:75px;padding-bottom:30px}.chromatic-intro h2{font-size:65px}.chromatic-intro>p{font-size:15px;max-width:310px;margin-top:25px}.chromatic-copy h3{font-size:35px}.chromatic-pin{gap:4px}.chromatic-controls .chromatic-bottom{margin-top:14px}.chromatic-controls #chromatic-evidence{font-size:9px}.chromatic-stage{height:34svh;min-height:245px}#looks[data-scene=daylight] .gallery-frame{max-width:310px}}

/* The new Underground source: inspect the ceiling lights, not the escalator. */
.halation-explainer .detail-image img{top:0;transform:scale(1.45);transform-origin:25% 0}

@media(min-width:761px) and (min-height:641px) and (max-height:800px){.chromatic-pin{min-height:0;gap:4px}.chromatic-copy{height:100px}.chromatic-copy h3{font-size:40px;margin-bottom:10px}.chromatic-copy p{font-size:14px}.chromatic-stage{height:calc(100svh - 345px);min-height:280px}.chromatic-controls .chromatic-bottom{margin-top:8px}.chromatic-choices button{padding-block:8px;min-height:36px}}

/* Native screens are intact captures; the colour field is a photographic explainer. */
.chromatic-photo-device{padding:0;background:none;border-radius:0;box-shadow:none}.chromatic-photo-label{color:#353c2d;padding:15px 0 0}.chromatic-photo-label span+span{color:#68715e}.chromatic-originals{border-radius:3px;box-shadow:0 15px 45px #20271e24}
.hero-device.native-hero{padding:5px;border-radius:34px;background:#181a17;box-shadow:0 20px 50px #15171630;width:min(340px,calc((100svh - 145px)*.46));--lateral:60%}.native-hero .hero-photograph{aspect-ratio:1320/2868;border-radius:29px;overflow:hidden}.native-hero .hero-photograph>img{object-fit:contain;transition:opacity 240ms ease-out}.native-hero figcaption{position:absolute;top:calc(100% + 12px);display:flex;justify-content:space-between;align-items:center;color:#666b60;font-size:11px}.native-hero figcaption span{max-width:none!important;display:inline!important}.native-hero figcaption button{padding:10px 0;font-size:11px;text-decoration:underline;text-underline-offset:4px}
.native-interaction{min-width:0;max-width:500px;width:100%;justify-self:center}.native-flow-tabs{display:flex;justify-content:center;gap:20px;margin-bottom:28px}.native-flow-tabs button{font-size:12px;padding:12px 0;color:#737a6d;border-bottom:1px solid transparent;min-height:44px}.native-flow-tabs button[aria-pressed=true]{border-color:#353d2e;color:#353d2e}.native-flow-phone{width:min(330px,100%);padding:5px;border-radius:34px;background:#181a17;box-shadow:0 20px 50px #15171626;margin:0 auto}.native-flow-phone img{width:100%;border-radius:29px}#native-flow-caption{font-size:12px;line-height:1.5;text-align:center;margin:24px auto 6px;max-width:320px}.native-flow-evidence{font-size:10px;color:#7a8172;text-align:center}
@media(max-width:760px){.hero-device.native-hero{width:min(245px,calc((100svh - 280px)*.46));min-width:200px;--lateral:0%}.native-interaction{margin-top:25px}.native-flow-tabs{gap:20px}.native-flow-tabs button{font-size:11px}.native-flow-phone{max-width:290px}.native-section{gap:35px}}
@media(prefers-reduced-motion:reduce){.native-hero .hero-photograph>img{transition:none}}

.native-hero figcaption .app-mode{display:none!important}.native-hero figcaption{color:#666b60}
