:root{--blue:#0031c8;--ink:#303449;--muted:#8694b3;--paper:#f0f1f7}*{box-sizing:border-box}html{scroll-behavior:auto}body{margin:0;background:#14110f;color:white;font:16px/1.45 Inter,Arial,sans-serif}button,a{font:inherit}button{cursor:pointer}a{color:inherit}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid #71a5ff;outline-offset:3px}[hidden]{display:none!important}.site-nav{height:76px;position:absolute;top:0;left:0;right:0;z-index:30;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(22px,4.2vw,84px);gap:25px}.site-logo img{width:115px;height:auto;display:block}.site-nav nav{display:flex;align-items:center;gap:clamp(14px,2.3vw,44px);font-size:13px;white-space:nowrap}.site-nav a{text-decoration:none}.nav-demo{border:1px solid #ffffffa8;border-radius:40px;background:#ffffff16;color:white;padding:11px 17px}.stage,.journey{height:100svh;min-height:560px;position:relative;overflow:hidden;background:#17110d}.scene-image{width:100%;height:100%;object-fit:contain;display:block}.opening-shade{position:absolute;inset:0;background:linear-gradient(90deg,#080706a8 0%,#08070648 31%,transparent 66%)}.scene-copy{position:absolute;top:22%;left:4.4%;width:min(570px,46vw);z-index:4}.eyebrow{display:block;font-size:11px;letter-spacing:.22em;color:#e9e1d3;opacity:.86;margin-bottom:22px}.scene-copy h1,.scene-copy h2{font:400 clamp(43px,4.4vw,77px)/.99 Georgia,serif;letter-spacing:-.045em;margin:0 0 28px;text-wrap:balance}.scene-copy p{font-size:17px;line-height:1.55;max-width:430px;color:#f1ece8;margin:0 0 32px}.pill{display:inline-flex;align-items:center;justify-content:space-between;gap:35px;border:0;border-radius:32px;padding:15px 23px;text-decoration:none;font-size:14px;min-height:49px}.pill.light{background:#f6f0e7;color:#241c18}.pill.blue{background:var(--blue);color:white}.pill.outline{color:var(--blue);border:1px solid var(--blue);background:transparent}.scroll-hint{position:absolute;bottom:4%;right:4%;display:flex;gap:14px;align-items:center;font-size:12px;letter-spacing:.06em;z-index:3}.scroll-hint span:last-child{font-size:26px}.identity-visual{position:absolute;inset:0;opacity:0;transition:opacity 1.35s;pointer-events:none}.identity-visual img{width:100%;height:100%;object-fit:contain}.paris-marker{position:absolute;left:43%;top:25%;font-size:20px;text-shadow:0 0 14px #0031c8}.identity-card{position:absolute;left:51%;top:54%;z-index:5;display:flex;align-items:center;gap:13px;padding:12px 18px;background:#1f1b1acc;border:1px solid #ffffff55;backdrop-filter:blur(7px);border-radius:12px;box-shadow:0 10px 35px #0005;opacity:0;transform:translateY(8px);transition:opacity 1s .45s,transform 1s .45s}.identity-card strong{display:block;font-size:12px;letter-spacing:.17em;font-weight:500}.identity-card small{font-size:11px;color:#c6d8f7}.identity-symbol{font-size:26px;color:#75a1ff}.identity-copy{opacity:0;pointer-events:none;transform:translateY(12px);transition:opacity 1s .35s,transform 1s .35s}.identity-copy h2{max-width:500px}.is-identity .opening-shade{background:linear-gradient(90deg,#080706bf,transparent 67%)}.is-identity .identity-visual,.is-identity .identity-card{opacity:1;transform:none}.is-identity .identity-copy{opacity:1;transform:none;pointer-events:auto}.is-identity #openingCopy,.is-identity .scroll-hint{opacity:0;pointer-events:none;transition:opacity .6s}.journey video{display:block;width:100%;height:100%;object-fit:contain;background:#000}.journey-copy{position:absolute;left:4.4%;bottom:11%;max-width:520px;text-shadow:0 2px 15px #000;pointer-events:none}.journey-copy h2{font:400 clamp(30px,3vw,48px)/1.06 Georgia,serif;margin:0 0 10px;transition:opacity .2s}.journey-copy p{font-size:13px;margin:5px 0;background:#0a1216a8;border-left:2px solid #6ba7ec;padding:7px 12px;max-width:395px}.journey-controls{position:absolute;top:23px;right:4%;display:flex;gap:10px}.journey-controls button{background:#101010a8;border:1px solid #fff8;color:white;border-radius:25px;padding:10px 17px}.journey-progress{position:absolute;bottom:0;height:4px;background:#ffffff30;width:100%}.journey-progress span{display:block;background:#eae6dc;height:100%;width:0}.portfolio{background:var(--paper);min-height:100vh;color:#303449}.app-header{height:58px;background:white;display:flex;align-items:center;padding:0 28px 0 56px;position:sticky;top:0;z-index:15;border-bottom:1px solid #eee}.app-header img{width:112px}.menu-glyph{font-size:19px;color:#4b5c83;margin-left:90px}.app-user{margin-left:auto;color:#4b5c83;font-size:11px;font-weight:700}.app-sidebar{position:fixed;top:58px;bottom:0;width:232px;background:white;color:#516386;display:flex;flex-direction:column;gap:21px;padding:25px 20px;z-index:11;font-size:14px;font-weight:600}.app-sidebar span{cursor:default}.record-scroll{margin-left:232px;padding:20px clamp(20px,2.4vw,45px) 0;min-height:100vh}.record-title{background:white;border-radius:9px;margin:0 0 24px;padding:17px 21px;min-height:70px;font-size:20px;font-weight:700;display:flex;align-items:center;justify-content:space-between}.record-title button{color:var(--blue);background:transparent;border:1px solid #d5dcf2;border-radius:18px;font-size:13px;padding:9px 14px}.record-grid{display:grid;grid-template-columns:minmax(300px,34%) 1fr;gap:32px;align-items:start}.record-left{display:grid;gap:23px}.record-card{background:white;border-radius:9px;overflow:hidden}.record-card h3{font-size:16px;color:#2e3036;margin:0;padding:16px 19px;border-bottom:1px solid #ececf0}.timeline ol{list-style:none;padding:13px 21px 12px 56px;margin:0}.timeline li{border-left:1px solid #d6def2;padding:0 0 16px 25px;position:relative;font-size:12px;color:#111}.timeline li:before{content:'';width:8px;height:8px;border-radius:50%;background:#94a2c1;position:absolute;left:-4.5px;top:5px}.timeline li:last-child{border-left-color:transparent}.timeline li span{font-size:12px;color:#8c9abc}.timeline li p{margin:3px 0 0}.location img{width:calc(100% - 22px);height:220px;object-fit:cover;display:block;margin:12px auto 0;border-radius:7px}.location p{margin:9px 16px 16px;color:#536184;font-size:13px}.asset-detail{padding:16px;overflow:visible}.identity-row{display:flex;gap:25px;align-items:flex-start}.photo-slot{width:256px;height:256px;flex:0 0 256px;border:1px solid #d1d7df;border-radius:8px;display:grid;place-items:center;background:#e5e7ea;overflow:hidden}.photo-slot img{display:block;width:100%;height:100%;object-fit:contain}.identity-fields h2{font-size:17px;margin:3px 0 17px;color:#303034}.identity-fields dl{margin:0;display:grid;gap:11px;font-size:13px}.identity-fields dl div{display:flex;gap:4px}.identity-fields dt{font-weight:700;color:#111}.identity-fields dd{margin:0;color:#8c9abb}.description{margin:22px 0 23px;font-size:13px}.description h3,.information h3,.components h3,.documents h3{border:0;padding:0;font-size:14px;color:#111;margin:0 0 10px}.description p{color:#8190af;line-height:1.65;margin:0}.information table,.components table{border-collapse:collapse;width:100%;font-size:13px}.information th,.information td,.components th,.components td{border:1px solid #d8dde2;text-align:left;padding:13px}.information th{width:40%;font-weight:500;color:#333}.information td{color:#526181;font-weight:600}.information a,.documents a{color:var(--blue)}.components,.documents{margin-top:42px}.components th{font-weight:600}.documents{padding:22px 0 20px}.documents p{margin:-6px 0 22px;color:#8592ae;font-size:12px}.document-item{display:flex;justify-content:space-between;align-items:center;border:1px solid #d7dce2;background:#f8f9fb;border-radius:12px;padding:16px;margin:10px 0;gap:20px;font-size:13px}.document-item small{display:block;color:#8b98b4;margin-top:4px}.document-item a{background:var(--blue);color:white;text-decoration:none;padding:9px 17px;border-radius:5px}.below-record{text-align:center;padding:86px 15px 100px}.below-record h2{font:400 clamp(30px,3.3vw,48px)/1.1 Georgia,serif;margin:0 0 28px}.below-record>div{display:flex;justify-content:center;gap:16px;flex-wrap:wrap}.handover-photo{position:fixed;z-index:22;pointer-events:none;display:none;overflow:hidden;background:#141414}.handover-photo img{width:100%;height:100%;object-fit:contain}.payoff-copy{position:fixed;z-index:25;left:4.4%;bottom:9%;color:white;font:400 clamp(32px,3.4vw,54px)/1.1 Georgia,serif;text-shadow:0 2px 15px #000;display:none;pointer-events:none}dialog{max-width:490px;width:calc(100% - 32px);border:0;border-radius:12px;padding:29px;box-shadow:0 14px 65px #0006}dialog::backdrop{background:#1119}dialog h2{font:400 30px Georgia,serif;margin:0}dialog p{font-size:14px;color:#59617a}dialog label{display:block;font-size:13px;margin:14px 0}dialog input,dialog textarea{display:block;border:1px solid #bdc5d4;border-radius:5px;padding:10px;width:100%;margin-top:6px}.dialog-close{float:right;border:0;background:none;font-size:25px}
.journey-fallback{position:absolute;inset:0;z-index:3;background:#17110d;display:grid;place-items:center}.journey-fallback img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}.journey-fallback>div{position:absolute;left:4.4%;bottom:10%;z-index:1;background:#17110dde;padding:15px 20px;border-radius:8px}.journey-fallback p{margin:0 0 8px}.journey-fallback button{background:#f6f0e7;color:#241c18;border:0;border-radius:25px;padding:10px 18px}.journey-copy{z-index:4}.journey-controls{z-index:10}.journey-progress{z-index:10}
@media(max-width:850px){.site-nav{height:66px;padding:0 18px}.site-logo img{width:95px}.site-nav nav{gap:12px;font-size:11px}.site-nav nav a:nth-child(1),.site-nav nav a:nth-child(3){display:none}.nav-demo{padding:9px 10px;font-size:11px}.stage,.journey{min-height:480px}.scene-image{object-fit:cover;object-position:58% center}.opening-shade{background:linear-gradient(90deg,#080706bf,transparent 100%)}.scene-copy{left:6%;top:auto;bottom:12%;width:82%}.scene-copy h1,.scene-copy h2{font-size:clamp(34px,8vw,55px)}.scene-copy p{font-size:15px;max-width:300px}.identity-card{left:41%;top:27%;padding:8px;font-size:11px}.identity-card strong{font-size:10px}.identity-visual img{object-fit:cover}.scroll-hint{bottom:3%;right:6%}.app-sidebar{display:none}.record-scroll{margin:0;padding:15px}.record-grid{display:flex;flex-direction:column-reverse;gap:18px}.record-left{width:100%}.asset-detail{width:100%}.app-header{padding:0 17px}.menu-glyph{margin-left:32px}.identity-row{gap:14px}.photo-slot{width:35%;height:auto;aspect-ratio:1;flex:0 0 35%}.identity-fields h2{font-size:15px}.identity-fields dl{gap:6px;font-size:11px}.journey-copy{bottom:14%;max-width:85%}.journey-copy h2{font-size:31px}.payoff-copy{font-size:31px}}
@media(max-width:540px){.scene-image{object-position:61% center}.site-nav nav a{display:none}.site-nav nav .nav-demo{display:block}.scene-copy h1,.scene-copy h2{font-size:35px}.identity-card{top:28%;left:24%}.identity-visual .paris-marker{left:36%;top:22%}.app-user{font-size:9px}.menu-glyph{margin-left:16px}.identity-row{display:block}.photo-slot{width:100%;height:auto;aspect-ratio:1.15;margin-bottom:15px}.record-title{font-size:16px}.record-title button{font-size:11px}.journey-controls{top:15px;right:14px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}.identity-visual{display:none}}

.journey-static{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#17110d;z-index:1}.record-back{margin-left:auto;border:1px solid #ccd3e3;border-radius:5px;padding:8px 12px;background:#fff;color:#1232b8;font-size:12px;font-weight:600;cursor:pointer}@media(max-width:700px){.record-back{font-size:11px;padding:6px 8px}.journey-controls{max-width:94vw;flex-wrap:wrap;justify-content:flex-end}}

/* Approved translucent identification tag proportions and chair placement. */
.identity-card{left:49.55%;top:51.7%;width:340px;min-height:64px;padding:10px 15px 10px 12px;gap:0;border:1px solid rgba(255,255,255,.25);background:rgba(30,23,20,.46);border-radius:12px;box-shadow:0 8px 24px rgba(0,0,0,.14);-webkit-backdrop-filter:blur(7px)}
.identity-tag-logo{display:block;width:100px;height:auto;flex:none;object-fit:contain;margin-right:15px}.identity-divider{width:1px;height:36px;flex:none;background:rgba(255,255,255,.26);margin-right:16px}.identity-tag-meta{display:block;font-size:10px;line-height:1.25;color:rgba(255,255,255,.94);white-space:nowrap}.identity-tag-meta strong{font-weight:500;font-size:11px;letter-spacing:.04em}.identity-tag-meta small{display:block;font-size:10px;color:rgba(255,255,255,.78);margin-top:3px}
@media(max-width:700px){.identity-card{left:43%;top:53%;width:min(300px,53vw);padding:8px;min-height:56px}.identity-tag-logo{width:70px;margin-right:8px}.identity-divider{margin-right:8px}.identity-tag-meta strong{font-size:9px}.identity-tag-meta small{font-size:8px}}

/* Approved Stage 03 overlay, positioned on the exact Paris room canvas. */
.identity-visual{z-index:2;transition:opacity 1.75s cubic-bezier(.2,.7,.2,1)}
.identity-visual img{object-fit:contain;object-position:center}
.identity-card{z-index:5}
@media(prefers-reduced-motion:reduce){.identity-visual{display:block}}

.journey-progress span{width:100%;transform:scaleX(0);transform-origin:left center;will-change:transform}
.journey-fallback:not([hidden])~.journey-copy{visibility:hidden}

/* v19: calm copy fades, fallback-to-film fade, handover layering */
.journey-copy h2{opacity:0;transition:opacity .45s ease}
.journey-copy h2.is-visible{opacity:1}
.journey-fallback{transition:opacity .3s ease}
.journey-fallback.is-fading{opacity:0}
.payoff-copy{margin:0;opacity:0;transition:opacity .45s ease;z-index:25}
.payoff-copy.is-visible{opacity:1}
.handover-photo{z-index:22;will-change:transform}
body[data-stage="handover"] .journey-controls #pauseBtn{display:none}

.record-title:focus{outline:none}
.journey-copy h2,.payoff-copy{text-wrap:balance}
/* v19b: the tag arrives first, then the Paris map. Leaving identification is quick and simultaneous. */
.identity-card{transition:opacity .4s,transform .4s}
.identity-visual{transition:opacity .4s}
.is-identity .identity-card{transition:opacity 1.1s ease-out,transform 1.1s ease-out}
.is-identity .identity-visual{transition:opacity 1.75s cubic-bezier(.2,.7,.2,1) 1.3s}
/* v19e: map nudged right, clear of the headline text (desktop only) */
@media(min-width:851px){.identity-visual img{transform:translateX(3.5%)}}
/* v19f: map scaled to 80% about the Paris marker, so Paris stays put and the network pulls in from the text and the chair */
@media(min-width:851px){.identity-visual img{transform-origin:44.6% 29.7%;transform:translateX(2.5%) scale(.8)}}
/* v19g: map back 1.5% so "Paris" sits in the window's shade; the nav gets a soft top scrim so it reads against sunlight */
@media(min-width:851px){.identity-visual img{transform:translateX(1%) scale(.8)}}
.site-nav::before{content:'';position:absolute;left:0;right:0;top:0;height:150px;z-index:-1;pointer-events:none;background:linear-gradient(180deg,rgba(12,9,7,.62) 0%,rgba(12,9,7,.34) 55%,rgba(12,9,7,0) 100%)}
.site-nav nav a,.site-nav nav button{text-shadow:0 1px 10px rgba(0,0,0,.6);font-weight:500}
.nav-demo{background:rgba(20,15,12,.38);border-color:rgba(255,255,255,.7);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
/* v19h: the S of "Paris" sits directly above the u of "lucett" on the tag (desktop). Calibrated by eye from a 1620 px screenshot. */
@media(min-width:851px){.identity-visual img{transform:translateX(calc(2.81% + 60px)) scale(.8)}}

/* v19i: the finished photograph waits for a gesture; a quiet cue appears once it is active */
.rest-hint{position:fixed;z-index:26;left:50%;bottom:5%;transform:translateX(-50%);background:rgba(16,16,16,.55);border:1px solid rgba(255,255,255,.55);color:#fff;border-radius:25px;padding:10px 18px;font-size:13px;letter-spacing:.04em;opacity:0;transition:opacity .6s ease;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.rest-hint.is-visible{opacity:1}

/* v19j: square asset slot showing a square crop of the photograph, centred on the chair (numbers match CROP in app.js) */
.photo-slot{position:relative;aspect-ratio:1}
.photo-slot img{position:absolute;display:block;max-width:none;object-fit:fill;width:213.3333%;height:120%;left:-84.1667%;top:-20%}
@media(max-width:540px){.photo-slot{aspect-ratio:1}}

/* v19l: cue moved to the bottom right (same place as the opening's scroll cue); soft veil for Skip and Replay */
.rest-hint{left:auto;right:4%;bottom:4%;transform:none}
.veil{position:fixed;inset:0;z-index:40;background:#0d0a08;opacity:0;pointer-events:none}

/* v19n: timeline as in the live Lucett record: newest first, relative times, capitals, scrolls inside its card */
.timeline ol{max-height:440px;overflow-y:auto;padding:22px 21px 8px 34px}
.timeline li{padding:0 0 22px 25px;font-size:12px;line-height:1.5;text-transform:uppercase;color:#111}
.timeline li span{display:block;font-size:14px;color:#8c9abc;margin-bottom:2px}
.timeline li p{margin:0}
.timeline li:last-child{border-left-color:transparent}

/* v19o: record page matched to the live Lucett page: image gallery arrows, field list, capitals, empty documents box */

.slot-arrow{position:absolute;top:50%;transform:translateY(-50%);width:32px;height:32px;border:0;border-radius:6px;background:rgba(120,128,146,.72);display:grid;place-items:center;padding:0;opacity:0;pointer-events:none;transition:opacity .4s ease;z-index:2}
.slot-arrow.prev{left:10px}.slot-arrow.next{right:10px}
.slot-arrow svg{width:18px;height:18px;fill:none;stroke:#fff;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.slot-arrow:hover{background:rgba(96,104,124,.9)}
.photo-slot.show-arrows .slot-arrow{opacity:1;pointer-events:auto}
.description p,.information td,.components td{text-transform:uppercase}
.description p{line-height:1.55}
.docs-empty{border:1px dashed #cfd6e4;border-radius:12px;min-height:240px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:6px;padding:24px}
.docs-empty svg{width:38px;height:38px;fill:none;stroke:#b4bccd;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;margin-bottom:22px}
.docs-empty strong{font-size:14px;color:#1c2130;font-weight:600}
.docs-empty small{font-size:12px;color:#8b98b4}

/* v19r: gallery of angle photographs supplied for A044 (crops set from data-crop in app.js); price under the title */
.asset-price{margin:-8px 0 16px;font-size:20px;font-weight:700;color:#1c2130}

/* v22: story copy removed. Only the controls remain on the opening and identification scenes, sitting bottom left. */

/* v22: short landscape screens keep the controls on screen; on narrow screens the finished-photograph line sits above the cue */
@media(max-height:600px){.stage,.journey{min-height:0}}
@media(max-width:850px){.payoff-copy{bottom:17%}}

/* v22: approved copy is back on the opening and identification scenes; the identification headline is a little smaller because it is longer */
.identity-copy h2{font-size:clamp(34px,3.5vw,60px);max-width:560px}
@media(max-width:850px){.identity-copy h2{font-size:clamp(28px,7vw,44px)}}
/* v22: approved film copy, second line smaller */
.journey-copy h2 .sub-line{display:block;margin-top:.6em;font-size:.5em;line-height:1.35;font-weight:400;opacity:.9}

/* v22: line under the closing headline */
.below-record .below-line{max-width:560px;margin:-8px auto 28px;font-size:16px;line-height:1.55;color:#526181}
.timeline ol{max-height:560px}

/* v23: copy revision. Headlines are written as two phrases; each phrase starts a new line and wraps within itself if it must. */
.scene-copy h1 .phrase,.scene-copy h2 .phrase,.payoff-copy .phrase{display:block}
/* v23: film captions sit in one fixed lower-left box. The box height does not change with the caption, and the first line
   always starts at the top of it, so moving from a one-line to a two-line caption never shifts the text. */
.journey-copy{--cap:clamp(30px,3vw,48px);width:min(660px,46vw);max-width:none;height:calc(2.35 * var(--cap) + 16px);display:flex;flex-direction:column;justify-content:flex-start}
.journey-copy h2{font-size:var(--cap);margin:0}
.journey-copy h2 .sub-line{font-size:max(17px,.5em);margin-top:.55em}
/* v23: the finished-photograph line uses the film captions' size and lower-left position, clear of the bottom-right button */
.payoff-copy{font:400 clamp(30px,3vw,48px)/1.1 Georgia,serif;bottom:11%;width:min(660px,46vw)}
@media(max-width:850px){.journey-copy{--cap:clamp(24px,6.4vw,31px);width:85%;height:calc(3.4 * var(--cap) + 16px);bottom:14%}.payoff-copy{font-size:clamp(24px,6.4vw,31px);width:85%;bottom:17%}}
/* v23: on desktop the opening headline wraps as "Together in / one Portfolio." so it stays clear of the chair's arm */
@media(min-width:851px){#openingCopy h1{max-width:min(570px,36vw)}}
/* v23: the finished-photograph line is a touch smaller than the film captions so its first line stays clear of the chair's front leg */
@media(min-width:851px){.payoff-copy{font-size:clamp(28px,2.6vw,44px)}}
/* v23: a soft local shade behind the lower-left captions, for contrast over the bright rugs. No panel edge. */
.journey-copy::before,.payoff-copy::before{content:'';position:absolute;z-index:-1;left:-6%;right:-10%;top:-30%;bottom:-35%;pointer-events:none;background:radial-gradient(ellipse at 38% 55%,rgba(8,6,5,.42) 0%,rgba(8,6,5,.22) 45%,rgba(8,6,5,0) 72%)}
.journey-copy::before{opacity:0;transition:opacity .45s ease}
.journey-copy:has(h2.is-visible)::before{opacity:1}
/* v23: the identification headline wraps the same way, clear of the Paris label and the map */
@media(min-width:851px){.identity-copy h2{max-width:min(560px,34vw)}}

/* v23c: type. Source Serif 4 for headlines and captions, DM Sans for the marketing text and controls.
   Both are self-hosted (SIL Open Font Licence, files in assets/fonts), Latin subset. The asset record keeps the platform sans. */
@font-face{font-family:"Source Serif 4";src:url("assets/fonts/source-serif-4-latin.woff2") format("woff2");font-weight:200 900;font-style:normal;font-display:swap}
@font-face{font-family:"DM Sans";src:url("assets/fonts/dm-sans-latin.woff2") format("woff2");font-weight:100 1000;font-style:normal;font-display:swap}
:root{--serif:"Source Serif 4",Georgia,serif;--sans:"DM Sans",Arial,sans-serif}
body{font-family:var(--sans)}
.portfolio{font-family:Inter,Arial,sans-serif}
.below-record{font-family:var(--sans)}
.scene-copy h1,.scene-copy h2,.journey-copy h2,.payoff-copy,.below-record h2,dialog h2{font-family:var(--serif);font-optical-sizing:auto;letter-spacing:-.005em}
.scene-copy h1,.scene-copy h2{line-height:1.08}
.journey-copy h2{line-height:1.12}
.payoff-copy{line-height:1.14}

/* v23c: "Explore the journey" and "Follow its journey" share one fixed spot at the bottom right; the scroll hint sits to their left */
.stage-actions{position:absolute;right:4%;bottom:4%;z-index:6;display:flex;align-items:center;gap:24px}
.stage-actions .scroll-hint{position:static}
.cta-slot{display:grid;justify-items:end}
.cta-slot .pill{grid-area:1/1}
#explore{opacity:1;visibility:visible;transition:opacity .6s,visibility 0s}
#follow{opacity:0;visibility:hidden;transition:opacity .4s,visibility 0s .4s}
.is-identity #explore{opacity:0;visibility:hidden;transition:opacity .4s,visibility 0s .4s}
.is-identity #follow{opacity:1;visibility:visible;transition:opacity 1s ease-out .35s,visibility 0s}
.scene-copy p{margin-bottom:0}
@media(max-width:850px){.stage-actions{right:6%;bottom:3%;flex-direction:column;align-items:flex-end;gap:10px}.scene-copy{bottom:calc(3% + 112px)}}
@media(max-width:540px){.stage-actions{right:16px;left:16px}}
.cta-slot .pill{width:100%}
@media(min-width:851px){.scene-copy p{max-width:min(430px,34vw)}}

/* v23d: one reading position for the whole story on desktop. Film captions and the finished-photograph line start
   at the same upper-left point as the opening and identification headlines (4.4% left, 22% top). */
@media(min-width:851px){
  .journey-copy{top:22%;bottom:auto}
  .payoff-copy{top:22%;bottom:auto}
  .journey-copy::before,.payoff-copy::before{top:-45%;bottom:-40%;left:-8%;right:-14%;background:radial-gradient(ellipse at 36% 50%,rgba(8,6,5,.5) 0%,rgba(8,6,5,.26) 45%,rgba(8,6,5,0) 72%)}
}

/* v24: the three scene buttons (Explore the journey, Follow its journey, Open the asset record) share one style:
   black pill, cream text, same size, same bottom-right corner */
.pill.light,.rest-hint{background:#0d0a08;color:#f6f0e7;border:1px solid rgba(246,240,231,.32);border-radius:32px;min-height:49px;padding:15px 23px;font:400 14px var(--sans);letter-spacing:0;display:inline-flex;align-items:center;justify-content:space-between;gap:35px;-webkit-backdrop-filter:none;backdrop-filter:none}
.pill.light:hover,.rest-hint:hover{background:#221c17}
.rest-hint{right:4%;bottom:4%}
@media(max-width:850px){.rest-hint{right:6%;bottom:3%}}
@media(max-width:540px){.rest-hint{right:16px}}

/* v24: site header. Demonstration button and a menu button on every screen size. */
.site-nav nav:not(.site-menu){display:none}
.nav-right{display:flex;align-items:center;gap:14px}
.menu-btn{width:46px;height:46px;border-radius:50%;border:1px solid rgba(255,255,255,.7);background:rgba(20,15,12,.38);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);display:grid;place-content:center;gap:5px;padding:0}
.menu-btn span{display:block;width:18px;height:1.5px;background:#fff;border-radius:2px;transition:transform .25s ease,opacity .2s ease}
.menu-open .menu-btn span:nth-child(1){transform:translateY(6.5px) rotate(45deg)}
.menu-open .menu-btn span:nth-child(2){opacity:0}
.menu-open .menu-btn span:nth-child(3){transform:translateY(-6.5px) rotate(-45deg)}
.site-menu{position:absolute;top:70px;right:clamp(22px,4.2vw,84px);width:min(340px,calc(100vw - 32px));background:#0d0a08f2;border:1px solid rgba(246,240,231,.18);border-radius:14px;padding:8px;display:flex;flex-direction:column;box-shadow:0 18px 50px #0008;opacity:0;transform:translateY(-6px);transition:opacity .22s ease,transform .22s ease;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.site-menu.is-open{opacity:1;transform:none}
.site-menu a,.site-menu button{display:block;text-align:left;width:100%;background:none;border:0;color:#f6f0e7;text-decoration:none;padding:12px 14px;border-radius:9px;font:inherit;white-space:normal}
.site-menu a:hover,.site-menu button:hover{background:#221c17}
.site-menu strong{display:block;font:400 19px/1.25 var(--serif)}
.site-menu small{display:block;font:400 12.5px/1.4 var(--sans);color:#b9ae9f;margin-top:3px}
.site-menu [data-enquiry]{margin-top:4px;border-top:1px solid rgba(246,240,231,.12);border-radius:0 0 9px 9px}
@media(max-width:850px){.site-menu{top:60px;right:16px}.menu-btn{width:40px;height:40px}}
@media(max-width:540px){.site-nav nav .nav-demo,.nav-right .nav-demo{display:none}}

/* v24: record page set in Roboto to match the Lucett platform; labels dark, values muted blue-grey as in the live app */
@font-face{font-family:"Roboto";src:url("assets/fonts/roboto-latin.woff2") format("woff2");font-weight:100 900;font-stretch:75% 100%;font-style:normal;font-display:swap}
.portfolio{font-family:Roboto,Arial,sans-serif}
.record-title{font-weight:500;font-size:20px}
.record-card h3{font-weight:500;font-size:17px}
.identity-fields h2{font-weight:500;font-size:18px}
.identity-fields dt{font-weight:500}
.identity-fields dd{color:#8e9bb9}
.description h3,.information h3,.components h3,.documents h3{font-weight:500}
.information td{font-weight:500}
.status-cell{text-align:right}
.status-badge{display:inline-block;background:#fdf1d6;color:#5b4410;font-size:10.5px;font-weight:500;padding:4px 9px;border-radius:5px;letter-spacing:.01em;text-transform:none}
.information td.status-cell{text-transform:none}

/* v24: app sidebar and its hamburger, as in Lucett */
.menu-glyph{border:0;background:none;padding:6px;border-radius:6px;display:grid;place-items:center;cursor:pointer}
.menu-glyph svg{width:22px;height:22px;fill:none;stroke:#4b5c83;stroke-width:1.8;stroke-linecap:round}
.menu-glyph:hover{background:#eef1f8}
.app-sidebar{gap:4px;padding:18px 12px;transition:transform .28s ease}
.side-item{display:flex;align-items:center;gap:12px;width:100%;border:0;background:none;color:#516386;font:500 15px Roboto,Arial,sans-serif;padding:10px 10px;border-radius:8px;text-align:left;cursor:pointer}
.side-item:hover{background:#f1f3f9}
.side-item.is-active{color:#1f3fb8;background:#eef2ff}
.side-icon{width:19px;height:19px;flex:none;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.side-chev{width:14px;height:14px;margin-left:auto;fill:none;stroke:#9aa6c2;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.record-scroll{transition:margin-left .28s ease}
.sidebar-collapsed .app-sidebar{transform:translateX(-100%)}
.sidebar-collapsed .record-scroll{margin-left:0}
@media(max-width:850px){
  .app-sidebar{display:flex;transform:translateX(-100%);box-shadow:8px 0 30px #0002;width:260px}
  body.sidebar-open-mobile .app-sidebar{transform:none}
  .sidebar-collapsed .record-scroll{margin-left:0}
}
.app-toast{position:fixed;z-index:60;left:50%;bottom:28px;transform:translate(-50%,8px);background:#1c2130;color:#fff;font:400 14px Roboto,Arial,sans-serif;padding:12px 18px;border-radius:8px;box-shadow:0 10px 30px #0003;opacity:0;transition:opacity .25s ease,transform .25s ease;max-width:calc(100vw - 32px)}
.app-toast.is-visible{opacity:1;transform:translate(-50%,0)}

/* v24: timeline entry and document that open the condition report */
.tl-link{border:0;background:none;padding:0;font:inherit;color:#1f3fb8;text-align:left;text-transform:uppercase;cursor:pointer;text-decoration:underline;text-underline-offset:2px}
.doc-list{display:grid;gap:10px}
.document-item{align-items:center;gap:14px}
.doc-icon{width:30px;height:30px;flex:none;fill:none;stroke:#8e9bb9;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
.doc-text{flex:1;min-width:0}
.doc-text strong{font-weight:500;color:#1c2130}
.doc-view{background:var(--blue);color:#fff;border:0;border-radius:5px;padding:9px 18px;font:500 13px Roboto,Arial,sans-serif}
.report-dialog{max-width:min(900px,calc(100vw - 32px));width:100%;padding:0;border-radius:12px;overflow:hidden;background:#eef0f4;font-family:Roboto,Arial,sans-serif}
.report-dialog::backdrop{background:#0b0d14b3}
.report-bar{display:flex;align-items:center;gap:14px;padding:14px 18px;background:#fff;border-bottom:1px solid #e3e6ee}
.report-bar>div{flex:1;min-width:0}
.report-bar h2{font:500 17px Roboto,Arial,sans-serif;color:#1c2130;margin:0}
.report-bar p{margin:2px 0 0;font-size:12.5px;color:#8e9bb9}
.report-pdf{color:var(--blue);font-size:13px;font-weight:500;text-decoration:none;border:1px solid #d5dcf2;border-radius:6px;padding:8px 12px;white-space:nowrap}
.report-close{border:0;background:none;font-size:26px;line-height:1;color:#4b5c83;padding:4px 8px}
.report-pages{max-height:calc(100vh - 140px);overflow-y:auto;padding:18px;display:grid;gap:18px}
.report-pages img{width:100%;height:auto;display:block;background:#fff;box-shadow:0 4px 18px #0001}
@media(max-width:540px){.report-bar p{display:none}.report-pages{padding:10px;gap:10px}}
/* v24: keep the older nav rules from reaching the menu panel */
.site-nav .site-menu{display:flex;flex-direction:column;align-items:stretch;gap:0;font-size:inherit;white-space:normal}
.site-nav .site-menu a,.site-nav .site-menu button{display:block!important;font-weight:400;text-shadow:none}
.site-nav .site-menu[hidden]{display:none!important}
.pill.light,.rest-hint{min-width:242px}

/* ===== v25: demonstration Portfolio (My assets, My addresses, asset details), matched to the live Lucett screens ===== */
.visually-hidden{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.app-view:focus,.record-title:focus,.record-title-inline:focus{outline:none}
.record-title{gap:12px}
.title-actions{display:flex;gap:10px;flex-wrap:wrap}
.record-title .to-list{color:#4b5c83;background:#fff;border:1px solid #d5dcf2;border-radius:18px;font-size:13px;padding:9px 14px}
.app-bell{margin-left:auto;border:0;background:none;padding:6px;border-radius:6px;display:grid;place-items:center}
.app-bell svg{width:21px;height:21px;fill:none;stroke:#4b5c83;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.app-bell:hover{background:#eef1f8}
.app-bell+.app-user{margin-left:14px}
.app-header .record-back{margin-left:18px}

/* sidebar groups */
.side-group>.side-item .side-chev{transition:transform .2s ease}
.side-group.is-open>.side-item .side-chev{transform:rotate(90deg)}
.side-group.is-active>.side-item{color:#1f3fb8;background:#eef2ff}
.side-item.is-active{color:#516386;background:none}
.side-sub{display:none;flex-direction:column;padding:4px 0 6px 20px}
.side-group.is-open .side-sub{display:flex}
.side-subitem{border:0;background:none;text-align:left;font:500 13px Roboto,Arial,sans-serif;color:#3a4766;padding:8px 10px 8px 22px;border-radius:6px;position:relative;cursor:pointer}
.side-subitem::before{content:'';position:absolute;left:8px;top:50%;width:5px;height:5px;border:1.4px solid #8e9bb9;border-radius:50%;transform:translateY(-50%)}
.side-subitem:hover{background:#f1f3f9}
.side-subitem.is-current{color:#1f3fb8}
.side-subitem.is-current::before{background:#1f3fb8;border-color:#1f3fb8}

/* status badges, colours as in the live app */
.status-badge{white-space:nowrap}
.st-inventory{background:#fdf1d6;color:#5b4410}
.st-planned-in-operation{background:#fde0e3;color:#8f1d2c}
.st-delivered{background:#dcf3e2;color:#1f6b34}
.st-in-transit{background:#e1e8ff;color:#1f3fb8}
.st-in-storage,.st-in-warehouse{background:#d8f5ea;color:#17684b}

/* My assets: toolbar */
.assets-toolbar{display:flex;align-items:center;gap:16px;padding:18px 16px;margin-bottom:24px;overflow:visible;flex-wrap:wrap}
.assets-toolbar .search{flex:1 1 320px;display:flex;align-items:center;gap:10px;border:1px solid #c9d0e0;border-radius:3px;padding:0 12px;height:44px;min-width:0}
.assets-toolbar .search svg{width:18px;height:18px;fill:none;stroke:#303449;stroke-width:1.8;flex:none}
.assets-toolbar .search input{border:0;outline:0;flex:1;min-width:0;font:400 14px Roboto,Arial,sans-serif;color:#303449;background:transparent;text-transform:uppercase}
.assets-toolbar .search:focus-within{border-color:#1f3fb8;box-shadow:0 0 0 2px #1f3fb822}
.tb-btn{display:inline-flex;align-items:center;gap:8px;background:#1f3fb8;color:#fff;border:0;border-radius:3px;height:46px;padding:0 20px;font:500 16px Roboto,Arial,sans-serif;white-space:nowrap}
.tb-btn b{font-weight:500}
.tb-btn svg{width:18px;height:18px;fill:none;stroke:#fff;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.tb-btn:hover{background:#1a35a0}
.sort{position:relative}
.sort-menu{position:absolute;top:52px;left:0;z-index:20;background:#fff;border:1px solid #dfe3ee;border-radius:6px;box-shadow:0 10px 30px #1c21301f;min-width:210px;padding:6px;display:flex;flex-direction:column}
.sort-menu[hidden]{display:none}
.sort-menu button{border:0;background:none;text-align:left;padding:10px 12px;border-radius:4px;font:400 14px Roboto,Arial,sans-serif;color:#303449}
.sort-menu button:hover{background:#f1f3f9}
.layout-toggle{display:flex;border:1px solid #e3e6ee;border-radius:6px;padding:3px;gap:3px}
.layout-toggle button{width:66px;height:42px;border:0;border-radius:4px;background:#fff;display:grid;place-items:center}
.layout-toggle svg{width:18px;height:18px;fill:none;stroke:#1f3fb8;stroke-width:1.8;stroke-linecap:round}
.layout-toggle button.is-on{background:#1f3fb8}
.layout-toggle button.is-on svg{stroke:#fff}
.filters-toggle{display:none}

/* My assets: filters + results */
.assets-layout{display:grid;grid-template-columns:minmax(260px,31%) 1fr;gap:24px;align-items:start}
.filters{padding:4px 0}
.f-group{padding:18px 16px 14px;border-bottom:1px solid #eceef3}
.f-group:last-child{border-bottom:0}
.f-group h4{margin:0 0 12px;font:500 14px Roboto,Arial,sans-serif;color:#111}
.f-row{display:flex;align-items:center;gap:10px;padding:6px 0;font:500 13.5px Roboto,Arial,sans-serif;color:#303449;text-transform:uppercase;cursor:pointer}
.f-row input{width:15px;height:15px;accent-color:#1f3fb8;margin:0}
.f-row span{flex:1;min-width:0}
.f-row .f-plain{text-transform:none}
.f-row b{font-weight:500;font-size:11px;background:#f1f2f6;color:#303449;border-radius:4px;min-width:30px;text-align:center;padding:3px 6px}
.f-row.is-disabled{cursor:default;color:#303449}
.results-head{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr) minmax(0,.8fr);padding:14px 16px;margin-bottom:14px;font:500 12.5px Roboto,Arial,sans-serif;color:#4b5c83}
.results-head span:nth-child(2){padding-left:14px;border-left:1px solid #e3e6ee}
.results-head span:last-child{text-align:right}
.asset-row{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr) minmax(0,.8fr);gap:0;padding:16px;margin-bottom:14px;cursor:pointer;transition:box-shadow .15s ease}
.asset-row:hover,.asset-tile:hover{box-shadow:0 6px 22px #1c213014}
.asset-row:focus-visible,.asset-tile:focus-visible{outline:3px solid #71a5ff;outline-offset:2px}
.ar-main{display:flex;gap:16px;align-items:flex-start;min-width:0;padding-right:14px}
.ar-main img{width:64px;height:64px;object-fit:cover;border-radius:5px;border:1px solid #e3e6ee;flex:none;background:#fff}
.ar-main h3,.asset-tile h3{margin:6px 0 10px;font:500 13.5px/1.35 Roboto,Arial,sans-serif;color:#111;text-transform:uppercase}
.ar-main .artist,.asset-tile .artist{margin:0 0 8px;font:400 14px Roboto,Arial,sans-serif;color:#8e9bb9;text-transform:uppercase}
.ar-details{display:grid;grid-template-columns:1fr 1fr;gap:14px 10px;margin:0;padding:0 14px;border-left:1px solid #e3e6ee;border-right:1px solid #e3e6ee;min-width:0}
.ar-details dt{font:500 11px Roboto,Arial,sans-serif;color:#4b5c83;margin-bottom:6px}
.ar-details dd{margin:0;font:400 14px Roboto,Arial,sans-serif;color:#303449;text-transform:uppercase;display:flex;align-items:center;gap:8px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ar-details dd svg,.cat-cell svg{width:17px;height:17px;flex:none;fill:none;stroke:#303449;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.ar-value{display:flex;flex-direction:column;align-items:flex-end;text-align:right;gap:6px;padding-left:14px;min-width:0}
.ar-value span{font:500 11px Roboto,Arial,sans-serif;color:#4b5c83}
.ar-value strong{font:500 15px Roboto,Arial,sans-serif;color:#111}
.ar-actions{margin-top:auto;display:flex;gap:4px;flex-wrap:wrap;justify-content:flex-end}
.ar-actions button{display:inline-flex;align-items:center;gap:7px;background:#1f3fb8;color:#fff;border:0;border-radius:3px;padding:7px 10px;font:500 12px Roboto,Arial,sans-serif}
.ar-actions svg{width:15px;height:15px;fill:none;stroke:#fff;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.asset-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:18px}
.asset-tile{cursor:pointer;display:flex;flex-direction:column}
.asset-tile img{width:100%;height:auto;aspect-ratio:1;object-fit:cover;display:block;border-bottom:1px solid #eceef3;background:#fff}
.asset-tile>div{padding:12px 14px 16px}
.asset-tile .value{margin:12px 0 0;font:500 15px Roboto,Arial,sans-serif;color:#111}
.no-results{padding:40px 20px;text-align:center;display:flex;flex-direction:column;gap:14px;align-items:center;font-size:14px}
.no-results button{background:none;border:1px solid #d5dcf2;color:#1f3fb8;border-radius:18px;padding:8px 14px;font-size:13px}

/* My addresses */
.addr-layout{display:grid;grid-template-columns:minmax(300px,34%) 1fr;gap:18px;align-items:start}
.addr-list{padding:0 20px 20px}
.addr-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:22px 0 20px;margin:0 -20px 20px;padding-inline:20px;border-bottom:1px solid #eceef3}
.record-title-inline{margin:0;font:500 20px Roboto,Arial,sans-serif;color:#303449}
.add-btn{display:inline-flex;align-items:center;gap:8px;background:#1f3fb8;color:#fff;border:0;border-radius:4px;padding:10px 16px;font:500 15px Roboto,Arial,sans-serif}
.add-btn svg{width:18px;height:18px;fill:none;stroke:#fff;stroke-width:1.8;stroke-linecap:round}
.addr-card{border:1px solid #d9dde6;border-radius:10px;padding:16px 14px;margin-bottom:22px;position:relative}
.addr-top{display:flex;justify-content:space-between;align-items:flex-start;gap:10px}
.addr-top h3{display:flex;align-items:center;gap:10px;margin:0;font:500 18px Roboto,Arial,sans-serif;color:#1c2130}
.addr-top h3 svg{width:24px;height:24px;fill:none;stroke:#1f3fb8;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.addr-tools{display:flex;gap:8px}
.round-btn{width:32px;height:32px;border-radius:50%;background:#1f3fb8;border:0;display:grid;place-items:center;padding:0}
.round-btn svg{width:15px;height:15px;fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.addr-type{margin:12px 0 14px;font:500 14px Roboto,Arial,sans-serif;color:#4b5c83}
.addr-line{margin:0 0 12px;font:400 12.5px Roboto,Arial,sans-serif;color:#303449;text-transform:uppercase}
.view-assets{display:inline-flex;align-items:center;gap:7px;background:#1f3fb8;color:#fff;border:0;border-radius:4px;padding:9px 12px;font:500 13px Roboto,Arial,sans-serif;margin-top:4px}
.view-assets svg{width:15px;height:15px;fill:none;stroke:#fff;stroke-width:1.8}
.addr-map{position:relative;padding:0;overflow:hidden}
.addr-map img{display:block;width:100%;height:auto}
.map-note{position:absolute;right:10px;bottom:8px;margin:0;font-size:11px;color:#4b5c83;background:#ffffffcc;padding:3px 8px;border-radius:4px}

/* Asset details for the other assets */
.gallery-slot{background:#fff}
.gallery-slot .gallery-open{position:absolute;inset:0;border:0;padding:0;background:#fff;cursor:zoom-in}
.photo-slot .gallery-open img{position:static;width:100%;height:100%;object-fit:contain;left:auto;top:auto;max-width:100%}
.gallery-slot .slot-arrow{opacity:1;pointer-events:auto}
.cat-cell{display:inline-flex;align-items:center;gap:10px}
.cat-cell svg{stroke:#303449}
.photo-viewer{max-width:none;max-height:none;width:100vw;height:100vh;margin:0;padding:0;border:0;border-radius:0;background:#141722ee}
.photo-viewer::backdrop{background:#0b0d14cc}
.photo-viewer[open]{display:grid;place-items:center}
.photo-viewer img{max-width:calc(100vw - 180px);max-height:calc(100vh - 110px);object-fit:contain;background:#fff}
.pv-close{position:absolute;top:14px;right:18px;border:0;background:none;color:#fff;font-size:34px;line-height:1}
.pv-arrow{position:absolute;top:50%;transform:translateY(-50%);width:56px;height:56px;border-radius:50%;border:0;background:#2b2f3bcc;display:grid;place-items:center}
.pv-arrow svg{width:22px;height:22px;fill:none;stroke:#fff;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.pv-arrow.prev{left:20px}.pv-arrow.next{right:20px}
.pv-arrow[hidden]{display:none}
.pv-bar{position:absolute;left:0;right:0;bottom:0;margin:0;display:flex;justify-content:space-between;padding:14px 22px;color:#fff;font:500 16px Roboto,Arial,sans-serif;background:linear-gradient(0deg,#0008,transparent)}
.demo-note{color:#1f3fb8!important;font-weight:500}

/* phones and tablets */
@media(max-width:1100px){.asset-row{grid-template-columns:1fr;gap:14px}.ar-main{padding-right:0}.ar-details{border:0;padding:12px 0 0;border-top:1px solid #eceef3;grid-template-columns:repeat(4,minmax(0,1fr))}.ar-value{flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:space-between;padding:12px 0 0;border-top:1px solid #eceef3;text-align:left}.ar-value span{display:none}.ar-actions{margin-top:0}.results-head{display:none}}
@media(max-width:850px){
  .assets-layout,.addr-layout{grid-template-columns:1fr}
  .filters-toggle{display:inline-flex;align-items:center;gap:6px;margin:0 0 14px;background:#fff;border:1px solid #d5dcf2;color:#1f3fb8;border-radius:18px;padding:9px 16px;font:500 14px Roboto,Arial,sans-serif}
  .filters{display:none}
  .filters-open .filters{display:block}
  .assets-toolbar{gap:10px;padding:12px}
  .assets-toolbar .search{flex-basis:100%}
  .tb-btn{height:40px;padding:0 12px;font-size:14px}
  .layout-toggle{margin-left:auto}.layout-toggle button{width:44px;height:34px}
  .ar-details{grid-template-columns:1fr 1fr}
  .asset-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  .addr-map{order:-1}
  .record-title{flex-wrap:wrap}
  .photo-viewer img{max-width:calc(100vw - 24px)}
  .pv-arrow{width:44px;height:44px}
  .app-header .app-user{display:none}
}
@media(max-width:540px){.tb-btn[data-demo]{display:none}.assets-toolbar .sort{flex:1}.assets-toolbar .sort .tb-btn{width:100%;justify-content:center}}
.asset-row h3,.asset-tile h3{padding:0;border:0;margin:4px 0 8px}
.addr-top h3{padding:0;border:0}

/* v25b: live parts of the sidebar. A quiet blue dot marks them; after the record first settles they pulse three times
   in a lighter Lucett blue, with a small callout. */
:root{--lucett-blue:#1f3fb8;--lucett-blue-soft:#5b7cff}
.side-subitem.is-live::after{content:'';width:6px;height:6px;border-radius:50%;background:var(--lucett-blue-soft);position:absolute;right:10px;top:50%;transform:translateY(-50%);box-shadow:0 0 0 3px #5b7cff26}
.side-group.is-live{border-radius:10px}
@keyframes livePulse{0%{box-shadow:0 0 0 0 #5b7cff00,inset 0 0 0 1.5px #5b7cff00}35%{box-shadow:0 0 0 6px #5b7cff2e,inset 0 0 0 1.5px #5b7cffcc}100%{box-shadow:0 0 0 12px #5b7cff00,inset 0 0 0 1.5px #5b7cff00}}
.live-pulse .side-group.is-live{animation:livePulse 1.7s ease-out 3}
@media(max-width:850px){.live-pulse .side-group.is-live{animation:none}.live-pulse #appMenuBtn{animation:livePulse 1.7s ease-out 3;border-radius:8px}}
@media(prefers-reduced-motion:reduce){.live-pulse .side-group.is-live,.live-pulse #appMenuBtn{animation:none;box-shadow:inset 0 0 0 1.5px #5b7cffcc}}
.live-hint{position:fixed;z-index:30;max-width:250px;background:#fff;border:1px solid #d5ddfb;border-radius:10px;box-shadow:0 12px 34px #1c21302b;padding:13px 34px 13px 15px;font:400 13px/1.45 Roboto,Arial,sans-serif;color:#303449;opacity:0;transform:translateX(-6px);transition:opacity .3s ease,transform .3s ease}
.live-hint.is-visible{opacity:1;transform:none}
.live-hint strong{display:block;font-weight:500;font-size:14px;color:var(--lucett-blue);margin-bottom:2px}
.live-hint::before{content:'';position:absolute;width:12px;height:12px;background:#fff;border-left:1px solid #d5ddfb;border-bottom:1px solid #d5ddfb}
.live-hint[data-side="left"]::before{left:-7px;top:16px;transform:rotate(45deg)}
.live-hint[data-side="top"]::before{left:var(--ax,22px);top:-7px;transform:rotate(135deg)}
.live-hint-close{position:absolute;top:6px;right:8px;border:0;background:none;font-size:18px;line-height:1;color:#8e9bb9;padding:4px}

/* v25c: slower, calmer caption fades. In 1.1 s, out 0.8 s (FADE in app.js). The finished-photograph line fades in over 1.2 s
   and out over 0.8 s before the photograph moves (HANDOVER.copyOut 850 ms). */
.journey-copy h2{transition:opacity .8s cubic-bezier(.4,0,.2,1)}
.journey-copy h2.is-visible{transition:opacity 1.1s cubic-bezier(.25,.1,.25,1)}
.journey-copy::before{transition:opacity .8s ease}
.journey-copy:has(h2.is-visible)::before{transition:opacity 1.1s ease}
.payoff-copy{transition:opacity .8s cubic-bezier(.4,0,.2,1)}
.payoff-copy.is-visible{transition:opacity 1.2s cubic-bezier(.25,.1,.25,1)}

/* v25e: slower fade-in for the film captions and the finished-photograph line (1.8 s; FADE.in in app.js) */
.journey-copy h2.is-visible{transition:opacity 1.8s cubic-bezier(.25,.1,.25,1)}
.journey-copy:has(h2.is-visible)::before{transition:opacity 1.8s ease}
.payoff-copy.is-visible{transition:opacity 1.8s cubic-bezier(.25,.1,.25,1)}
/* v25e: the site menu uses the site's sans throughout, like the navigation */
.site-menu strong{font:500 15.5px/1.3 var(--sans);letter-spacing:.005em}
.site-menu small{font:400 12.5px/1.4 var(--sans)}
/* v25e: "Scroll to explore" centred at the bottom of the opening, level with the Explore button */
.stage>.scroll-hint{position:absolute;left:50%;right:auto;bottom:calc(4% + 6px);transform:translateX(-50%);z-index:6;white-space:nowrap}
@media(max-width:850px){.stage>.scroll-hint{bottom:calc(3% + 64px)}.scene-copy{bottom:calc(3% + 116px)}}

/* v26b: For Transporters in the top bar of the opening, beside Arrange a demonstration */
.nav-link{font:400 14px var(--sans);color:#fff;text-decoration:none;padding:10px 17px;background:#101010a8;border:1px solid #fff8;border-radius:25px;white-space:nowrap}
.nav-link:hover{background:#101010d0}
@media(max-width:540px){.nav-link{font-size:12px;padding:8px 12px}}
/* v27: group titles (Assets, My addresses) only open and close their list; no highlight on the title itself */
.side-group.is-active>.side-item{color:#516386;background:none}
.side-group.is-active>.side-item:hover{background:#f1f3f9}
/* v27: For Transporters is always reachable on the asset owner side: opening top bar, film controls and the record header */
.to-transporters{margin-left:18px;font:500 12px Roboto,Arial,sans-serif;color:#fff;background:#1f3fb8;border-radius:25px;padding:9px 16px;text-decoration:none;white-space:nowrap}
.to-transporters:hover{background:#1a35a0}
.to-transporters+.record-back{margin-left:10px}
.journey-controls .journey-transporters{background:#101010a8;border:1px solid #fff8;color:#fff;border-radius:25px;padding:10px 17px;text-decoration:none;font-size:inherit}
@media(max-width:540px){.to-transporters{margin-left:8px;padding:7px 11px;font-size:11px}.to-transporters+.record-back{margin-left:6px}.app-header img{width:84px}.app-bell{display:none}}
/* v27b: centred scroll cue at the end of the New York unpacking, matching the opening's cue */
.rest-scroll{position:fixed;z-index:26;left:50%;bottom:calc(4% + 6px);transform:translateX(-50%);display:flex;gap:14px;align-items:center;color:#fff;font:400 12px var(--sans);letter-spacing:.06em;text-shadow:0 1px 3px rgba(0,0,0,.7),0 1px 16px rgba(0,0,0,.8);opacity:0;transition:opacity .6s ease;pointer-events:none;white-space:nowrap}
.rest-scroll span:last-child{font-size:26px}
.rest-scroll.is-visible{opacity:1}
@media(max-width:850px){.rest-scroll{bottom:calc(3% + 64px)}}

/* v63: header is For Transporters and the menu; Sign in closes the menu list */
.site-menu [data-enquiry]{margin-top:0;border-top:0;border-radius:9px}
.site-menu .menu-sep{margin-top:4px;border-top:1px solid rgba(246,240,231,.12);border-radius:0 0 9px 9px}
.app-header .sm-btn{margin-left:10px;width:38px;height:38px}

/* v68: scroll hints are buttons; bottom-right journey buttons removed */
button.scroll-hint,button.rest-scroll{background:none;border:0;color:#fff;font-family:var(--sans);cursor:pointer;padding:8px 12px;pointer-events:auto}
.rest-hint{display:none!important}
.is-identity button.scroll-hint{opacity:1;pointer-events:auto}
.pause-logo{position:fixed;top:22px;left:clamp(22px,4.2vw,84px);z-index:40;background:none;border:0;padding:0;cursor:pointer;line-height:0;filter:drop-shadow(0 1px 8px rgba(0,0,0,.6))}
.pause-logo img{width:115px;display:block}
@media(max-width:850px){.pause-logo{top:20px;left:18px}.pause-logo img{width:95px}}
/* v77: no sidebar-collapse button on wide screens; it remains on phones, where it opens the sidebar */
@media(min-width:851px){.menu-glyph{display:none!important}}
/* v80: the Portfolio logo returns to the opening; the Back to opening button is gone */
.app-logo{background:none;border:0;padding:0;line-height:0;cursor:pointer;flex:none}
.app-logo img{display:block}
@media(max-width:850px){.app-header .to-transporters{margin-left:auto}}

/* v98: Sign in offers the two existing logins until there is a single one */
.site-menu .menu-signin{display:flex;align-items:center;gap:8px;margin-top:4px;padding:12px 14px 8px;border-top:1px solid rgba(246,240,231,.12)}
.site-menu .menu-signin span{font:500 15.5px/1.3 var(--sans);color:#f6f0e7;margin-right:auto}
.site-menu .menu-signin a{display:inline-block!important;width:auto;padding:8px 14px;border:1px solid rgba(246,240,231,.45);border-radius:30px;font:500 13px var(--sans);white-space:nowrap}
.site-menu .menu-signin a:hover{background:#f6f0e7;color:#14110f}

/* v135: the blue Paris point breathes on the same 4 second cycle as the demo glows. A separate halo image sits exactly over the approved map and only its opacity changes. */
.identity-visual img.paris-halo{position:absolute;left:0;top:0;opacity:0;mix-blend-mode:screen}
@keyframes parisPulse{0%,100%{opacity:0}50%{opacity:1}}
.is-identity .identity-visual img.paris-halo{animation:parisPulse 4s ease-in-out 3s infinite}
@media(prefers-reduced-motion:reduce){.is-identity .identity-visual img.paris-halo{animation:none;opacity:0}}

/* v143: on phones in portrait, "Scroll to explore" sits level with the chair's front foot (89.4% down the photograph, which fills the screen height) */
@media(max-width:850px) and (orientation:portrait){.stage>.scroll-hint{bottom:calc(10.6% - 27px)}}

/* v144: no progress bar under the Asset Owner film */
.journey-progress{display:none!important}

/* v145: Asset by locations */
.loc-wrap{display:grid;grid-template-columns:minmax(300px,380px) 1fr;padding:0;overflow:hidden;min-height:620px}
.loc-list{border-right:1px solid #e7eaf2;display:flex;flex-direction:column;max-height:760px}
.loc-head{display:flex;align-items:center;justify-content:space-between;padding:22px 24px 16px;border-bottom:1px solid #eceef3}
.loc-head h2{margin:0;font:500 18px Roboto,Arial,sans-serif;color:#303449}
.loc-close{border:0;background:none;font-size:24px;line-height:1;color:#8694b3;cursor:pointer;padding:4px 8px;border-radius:6px}
.loc-close:hover{background:#f1f3f9}
.loc-search{display:flex;align-items:center;gap:10px;margin:14px 16px 6px;border:1px solid #d5dbe8;border-radius:4px;padding:9px 12px}
.loc-search svg{width:18px;height:18px;fill:none;stroke:#8694b3;stroke-width:1.8;flex:none}
.loc-search input{border:0;outline:0;font:400 13px Roboto,Arial,sans-serif;color:#303449;width:100%;background:none}
.loc-filter{margin:8px 18px 0;font:500 12.5px Roboto,Arial,sans-serif;color:#303449;display:flex;align-items:center;gap:10px}
.loc-filter button{border:0;background:none;color:#1f3fb8;font:500 12.5px Roboto,Arial,sans-serif;cursor:pointer;padding:0;text-decoration:underline;text-underline-offset:3px}
.loc-cards{overflow-y:auto;padding:12px 16px 18px;display:grid;gap:12px;align-content:start}
.loc-card{display:grid;grid-template-columns:120px 1fr;gap:16px;border:1px solid #e3e6ee;border-radius:6px;padding:10px;cursor:pointer;background:#fff;transition:box-shadow .2s,border-color .2s}
.loc-card:hover{border-color:#c9d3ee;box-shadow:0 6px 18px #1c21301a}
.loc-card img{width:120px;height:140px;object-fit:cover;border-radius:3px;background:#f3f4f8}
.loc-card h3{margin:2px 0 6px;font:500 13px/1.35 Roboto,Arial,sans-serif;color:#1f3fb8}
.loc-card p{margin:0 0 5px;font:400 12px/1.4 Roboto,Arial,sans-serif;color:#303449}
.loc-card p b{font-weight:500;color:#1f3fb8}
.loc-card .loc-sub{color:#8694b3}
.loc-none{font:400 13px Roboto,Arial,sans-serif;color:#8694b3;padding:8px 4px}
.loc-map{background:#c9d9d6;display:grid;place-items:center;overflow:hidden}
.loc-canvas{position:relative;width:100%;aspect-ratio:2000/1520}
.loc-canvas img{display:block;width:100%;height:100%;object-fit:cover}
.loc-dot{position:absolute;transform:translate(-50%,-50%);width:30px;height:30px;border-radius:50%;border:2px solid #fff;background:#3b4fd6;color:#fff;font:500 12px Roboto,Arial,sans-serif;display:grid;place-items:center;cursor:pointer;box-shadow:0 2px 8px #0003;padding:0;transition:transform .2s,background .2s}
.loc-dot:hover{transform:translate(-50%,-50%) scale(1.1)}
.loc-dot.is-on{background:#0b1f8f;box-shadow:0 0 0 4px #3b4fd655,0 2px 8px #0003}
@media(max-width:850px){.loc-wrap{grid-template-columns:1fr;min-height:0}.loc-map{order:-1}.loc-list{border-right:0;max-height:none}.loc-dot{width:24px;height:24px;font-size:11px}.loc-dot[data-loc="LONDON"]{margin:-5px 0 0 -5px}.loc-dot[data-loc="PARIS"]{margin:5px 0 0 5px}}
@media(max-width:420px){.loc-card{grid-template-columns:96px 1fr}.loc-card img{width:96px;height:118px}}
.loc-card h3{padding:0!important;border:0!important;text-indent:0;display:block}
.loc-card h3::before,.loc-card h3::after{display:none!important}
.loc-map{background:#c9d8d5}