/* One person, several worlds. Character and object layers share one transition. */
:root{--scene-control:#ffffff55;--scene-control-hover:#ffffffaa;--scene-paper:#f4f0e9;--scene-ink:#272727;--scene-muted:#69615e;--scene-accent:#b14842;--scene-glow:#eac5bd;--scene-cool:#cadbdc;--scene-line:#312c2829}
html[data-world=ai]{--scene-paper:#eef3ee;--scene-ink:#152d2c;--scene-muted:#4c6662;--scene-accent:#187666;--scene-glow:#a6d9cd;--scene-cool:#c4d8e2;--scene-line:#173c3228}
html[data-world=development]{--scene-paper:#efedf4;--scene-ink:#272638;--scene-muted:#646078;--scene-accent:#6a4ea1;--scene-glow:#cec0e6;--scene-cool:#d5dced;--scene-line:#362c4628}
html[data-world=websites]{--scene-paper:#f5eee9;--scene-ink:#2c3042;--scene-muted:#666377;--scene-accent:#a9472f;--scene-glow:#edcab5;--scene-cool:#c8d5ee;--scene-line:#442e2628}
html[data-world=business]{--scene-paper:#eef0ed;--scene-ink:#273630;--scene-muted:#5c6860;--scene-accent:#446954;--scene-glow:#cbd7c5;--scene-cool:#d1d7de;--scene-line:#293a2d28}
html[data-world=riding]{--scene-paper:#f4f0ed;--scene-ink:#35292f;--scene-muted:#715f66;--scene-accent:#a33869;--scene-glow:#efc3d3;--scene-cool:#cbdadf;--scene-line:#49313928}
html[data-world=explore]{--scene-paper:#f2f0e8;--scene-ink:#313931;--scene-muted:#616a60;--scene-accent:#687846;--scene-glow:#d6dbbb;--scene-cool:#c4d8d6;--scene-line:#36412b28}
html{scroll-padding-top:30px}
.header{position:absolute;inset:0 0 auto;z-index:8;height:94px;max-width:none;padding:24px 5.5%;color:var(--scene-ink);border-bottom:1px solid var(--scene-line)}
.header .signature img,html[data-world=ai] .header .signature img,html[data-world=development] .header .signature img{filter:none;mix-blend-mode:multiply;width:145px}
.header-worlds{display:flex;align-items:center;gap:12px;font-size:10px;letter-spacing:.1em;text-transform:uppercase}
.world-mark{display:block;width:7px;height:7px;border-radius:50%;background:var(--scene-accent);box-shadow:0 0 0 5px color-mix(in srgb,var(--scene-accent) 8%,transparent);transition:background .6s}
.header-worlds-mobile{display:none}.header .contact-pill{border-color:var(--scene-line);font-size:12px;gap:25px;padding:9px 17px}.header .contact-pill:hover{background:var(--scene-ink);color:var(--scene-paper)}
.hero{--pointer-x:0px;--pointer-y:0px;position:relative;isolation:isolate;display:block;margin:0;padding:0;max-width:none;width:100%;height:100svh;min-height:800px;max-height:1080px;color:var(--scene-ink);background:var(--scene-paper);overflow:hidden;overflow-anchor:none;touch-action:pan-y pinch-zoom;transition:background .7s,color .7s}
.hero-atmosphere{position:absolute;inset:0;z-index:-2;overflow:hidden;pointer-events:none}.ambient-field{position:absolute;width:60vw;height:65vw;max-height:1000px;border-radius:50%;filter:blur(45px);opacity:.55;transition:background 1s;animation:light-drift 26s ease-in-out infinite alternate}.ambient-one{left:-8%;top:18%;background:radial-gradient(ellipse,var(--scene-glow),transparent 65%)}.ambient-two{right:-14%;top:6%;background:radial-gradient(ellipse,var(--scene-cool),transparent 65%);animation-direction:alternate-reverse;opacity:.4}
.stage-grid{position:absolute;left:7%;right:7%;top:130px;bottom:180px;background:radial-gradient(var(--scene-line) .7px,transparent .8px);background-size:24px 24px;mask-image:radial-gradient(ellipse,#0003,transparent 67%);opacity:.4}
.scene-word{position:absolute;top:12%;left:50%;transform:translateX(-50%);font:400 clamp(120px,20vw,300px)/1 var(--display);letter-spacing:-.07em;white-space:nowrap;color:var(--scene-accent);opacity:.055;transition:color .65s;user-select:none}
.hero-copy{position:absolute;z-index:3;left:6.5%;top:clamp(148px,20vh,210px);padding:0;width:27%;max-width:405px}
.hero .eyebrow{font-size:9px;font-weight:500;letter-spacing:.13em;gap:10px;color:var(--scene-muted)}.hero .world-number{border:0;border-right:1px solid var(--scene-line);padding:0 10px 0 0;font:10px var(--mono);color:var(--scene-accent)}
.hero h1,html[data-world=development] .hero h1{font:400 clamp(44px,4.9vw,79px)/1.01 'DM Serif Display',Georgia,serif;letter-spacing:-.045em;margin:20px 0 20px;max-width:none}.hero h1 em,html[data-world=development] .hero h1 em{color:var(--scene-accent);font-style:italic;transition:color .65s}
.hero-description{font-size:14px;line-height:1.75;max-width:305px;color:var(--scene-muted);text-wrap:pretty}.hero-actions{gap:20px;margin-top:21px;flex-wrap:wrap}.hero .primary-link{background:none;border-bottom:1px solid var(--scene-accent);border-radius:0;color:var(--scene-ink);padding:8px 0;font-size:12px;gap:25px;min-height:44px}.hero .primary-link:hover{transform:none}.hero .primary-link span{color:var(--scene-accent);font-size:20px;transition:transform .2s}.hero .primary-link:hover span{transform:translate(2px,3px)}.hero .text-link{color:var(--scene-muted);border:0;font-size:11px;display:none;padding:8px 0;min-height:44px}.hero-footnote{margin-top:23px;font-size:10px;max-width:250px;color:var(--scene-muted);display:flex}.hero-footnote .tiny-line{background:var(--scene-accent)}
.portrait-stage{align-self:stretch;position:absolute;inset:113px 0 155px;height:auto;width:100%;max-width:none;margin:0;z-index:2;isolation:isolate}.stage-floor{position:absolute;left:50%;bottom:5px;width:27%;height:35px;background:radial-gradient(ellipse,#28342d25,transparent 67%);transform:translateX(-50%);filter:blur(9px);pointer-events:none}
.scene-panel{position:absolute;inset:0;opacity:0;pointer-events:none}.scene-panel.active{opacity:1;pointer-events:auto}.scene-panel.revealing{transition:opacity .68s cubic-bezier(.25,.46,.45,.94)}
.character-depth{position:absolute;top:0;bottom:0;left:50%;width:min(42%,520px);transform:translate(calc(-50% + var(--pointer-x) * .22),calc(var(--pointer-y) * .22));transition:transform .7s ease;pointer-events:none}.portrait-motion{position:absolute;inset:0;border-radius:0;overflow:visible;background:none;animation:portrait-breathe 9s ease-in-out infinite;transform-origin:50% 100%;will-change:transform}.portrait-layer{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;object-position:50% 100%;opacity:1;transition:none;max-width:none;pointer-events:none;filter:drop-shadow(0 10px 15px #28302c12)}.portrait-layer.is-reference{mix-blend-mode:multiply;filter:none}
.scene-prop{position:absolute;display:flex;align-items:center;flex-direction:column;justify-content:center;padding:0;background:none;width:180px;text-align:left;color:var(--scene-ink);pointer-events:auto}.prop-left{left:15%;bottom:1%;transform:translateX(-50%)}.prop-right{right:10%;top:17%;width:195px}.prop-depth{display:block;width:100%;aspect-ratio:1;transform:translate(calc(var(--pointer-x) * -.85),calc(var(--pointer-y) * -.85));transition:transform .8s ease}.prop-image{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 12px 9px #31382f1a);animation:object-float 10s ease-in-out infinite}.prop-right .prop-image{animation-delay:-5s}.scene-prop:not(.has-object) .prop-depth{display:none}.prop-label{width:100%;display:flex;align-items:center;justify-content:space-between;gap:15px;padding:13px 0;border-top:1px solid var(--scene-line);font-size:11px;line-height:1.5;letter-spacing:.015em}.prop-arrow{color:var(--scene-accent);font-size:16px}.scene-prop:hover .prop-label{border-color:var(--scene-accent)}.scene-prop:hover .prop-arrow{transform:translate(2px,-2px)}.scene-prop:focus-visible{outline:2px solid var(--scene-accent);outline-offset:7px}
.stage-caption{position:absolute;right:7%;top:67%;width:190px;color:var(--scene-muted);font:italic 18px/1.45 'DM Serif Display',Georgia,serif}.portrait-tag{position:absolute;z-index:2;right:3%;top:40%;writing-mode:vertical-rl;font:9px var(--mono);letter-spacing:.12em;color:var(--scene-muted);opacity:.7}
.world-nav{position:absolute;inset:auto 6.5% 24px;padding:0;background:none;border:0;box-shadow:none;z-index:5;display:block;transition:none;color:var(--scene-ink)}.world-nav-caption{display:flex;align-items:center;gap:14px;min-height:35px;margin-bottom:9px;font-size:11px;letter-spacing:.03em}.world-nav-caption>span:first-child{display:flex;align-items:center;gap:10px}.dock-arrow{color:var(--scene-accent);font-size:16px}.scene-position{margin-left:auto;font:10px var(--mono);letter-spacing:.1em;color:var(--scene-muted)}.scene-position span{color:var(--scene-accent)}
.motion-toggle{display:flex;align-items:center;justify-content:center;width:44px;height:35px;border:1px solid var(--scene-line);border-radius:20px;margin:0;background:transparent;color:var(--scene-ink);font-size:14px;flex-shrink:0}.motion-toggle:hover{background:var(--scene-control-hover)}.motion-toggle:disabled{cursor:default;opacity:.5}
.world-links{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:7px;overflow:visible;scrollbar-width:auto}.world-link{display:flex;align-items:center;justify-content:space-between;gap:6px;position:relative;min-height:55px;padding:13px 15px;background:var(--scene-control);border:1px solid var(--scene-line);border-radius:4px;color:var(--scene-muted);font-size:12px;font-weight:500;white-space:nowrap;transition:background .4s,color .4s,border-color .4s,transform .3s}.world-link .world-link-number{font:10px var(--mono);opacity:.65;display:block}.world-link .world-link-name{display:block;font:inherit;opacity:1}.world-link:hover{background:var(--scene-control-hover);color:var(--scene-ink);transform:translateY(-2px)}.world-link[aria-current=page]{background:var(--scene-ink);border-color:var(--scene-ink);color:var(--scene-paper);box-shadow:0 6px 20px #27352713}.world-link[aria-current=page] .world-link-name,.world-link[aria-current=page] .world-link-number{color:inherit}.world-link[aria-current=page] .world-link-number{opacity:.7}
.hero a:focus-visible,.hero button:focus-visible,.header a:focus-visible{outline:2px solid var(--scene-accent);outline-offset:4px}.marquee{margin-top:0;padding-block:19px;background:var(--ink);color:var(--bg);border:0;font-size:10px}.section-enter{animation:scene-copy .45s ease both}.scene-error{position:absolute;left:24px;top:105px;z-index:6;max-width:300px;background:var(--scene-paper);color:var(--scene-ink);padding:12px 15px;border:1px solid var(--scene-line);font-size:13px;border-radius:4px}.scene-error[hidden]{display:none}.scene-error button{background:none;color:var(--scene-accent);text-decoration:underline;padding:5px 8px;min-height:44px}
.paused .portrait-motion,.paused .prop-image,.paused .ambient-field{animation-play-state:paused!important}.paused .character-depth,.paused .prop-depth{transform:none}.paused .character-depth{transform:translateX(-50%)}
@keyframes portrait-breathe{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}@keyframes object-float{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-8px) rotate(1deg)}}/* Rest at each end before the ambient light gently changes direction. */
@keyframes light-drift{0%,.64%{transform:translate(-3%,1%)}99.36%,100%{transform:translate(8%,-5%)}}@keyframes scene-copy{from{opacity:.25;transform:translateY(5px)}to{opacity:1;transform:none}}
@media(min-width:1800px){.hero-copy{left:9%;width:25%}.header{padding-inline:8%}.world-nav{left:9%;right:9%}.prop-left{left:21%}.prop-right{right:17%}.stage-caption{right:15%}.character-depth{width:36%}}
/* Keep the lower-left object clear of the introduction on desktop. */
@media(min-width:701px){.hero-footnote{display:none}}
@media(min-width:1101px){.hero-copy{top:clamp(140px,15vh,165px)}}
@media(min-width:1101px) and (max-height:980px){.hero-copy{top:126px}.hero h1,html[data-world=development] .hero h1{font-size:clamp(38px,3.65vw,60px);margin-block:16px}.hero-description{font-size:13px;line-height:1.65}.hero-actions{margin-top:16px}.prop-left{width:156px;bottom:-10px}}
@media(max-width:1100px) and (min-width:701px){.hero{min-height:820px}.hero-copy{left:5%;width:28%;top:155px}.hero h1,html[data-world=development] .hero h1{font-size:48px}.hero-description{font-size:13px}.hero-footnote{display:none}.portrait-stage{top:145px}.character-depth{width:43%}.prop-left{left:16%;width:130px}.prop-right{right:5%;width:135px;top:20%}.stage-caption{right:5%;width:135px;font-size:16px}.world-nav{left:4%;right:4%}.world-link{padding:13px 10px;font-size:11px}.world-link .world-link-number{display:none}}
@media(max-width:1100px) and (min-width:701px) and (max-height:980px){.hero-copy{top:126px;width:31%}.hero h1,html[data-world=development] .hero h1{font-size:38px;margin-block:16px}.hero-description{font-size:12px;line-height:1.65}.hero-actions{margin-top:16px}.prop-left{width:112px;bottom:-10px}}
@media(max-width:700px){
 .header{height:64px;padding:13px 20px;border:0;gap:12px}.header .signature img{width:112px}.header-worlds{gap:7px;font-size:8px;letter-spacing:.04em;margin-left:auto}.header-worlds>span:nth-child(2){display:none}.header-worlds-mobile{display:block}.world-mark{width:5px;height:5px;box-shadow:none}.header .contact-pill{font-size:10px;padding:4px 8px;min-height:34px;gap:0}.header .contact-pill span{display:none}
 .hero{height:100svh;min-height:650px;max-height:980px;display:block;padding:0;gap:0}.hero-copy{left:22px;right:22px;top:85px;width:auto;max-width:none;padding:0;text-align:center}.hero .eyebrow{justify-content:center;font-size:8px;letter-spacing:.11em;gap:8px}.hero .world-number{font-size:8px;padding-right:8px}.hero h1,html[data-world=development] .hero h1{font-size:clamp(32px,8.6vw,49px);line-height:1.03;letter-spacing:-.035em;margin:13px 0 0}.hero h1 br{display:none}.hero h1 em{display:block}.hero-description{display:none}.hero-actions{display:none}.hero-footnote{display:none}.portrait-tag{display:none}
 .hero-atmosphere .scene-word{top:30%;font-size:clamp(96px,25vw,180px);opacity:.055}.ambient-field{width:120vw;height:140vw;opacity:.6;filter:blur(25px)}.ambient-one{left:-55%;top:18%}.ambient-two{right:-55%;top:25%}.stage-grid{inset:230px 10px 175px}
 .portrait-stage{inset:222px 0 169px;height:auto;width:100%;max-width:none;margin:0}.character-depth{width:68%;max-width:360px;top:0;bottom:0}.stage-floor{width:44%;bottom:-2px;height:22px}.portrait-layer{object-position:center bottom;filter:drop-shadow(0 7px 9px #27332c12)}.portrait-motion{inset:0}.portrait-layer.is-reference{filter:none}.scene-prop{width:90px}.prop-left{left:2%;bottom:18%;transform:none}.prop-right{right:2%;top:10%;width:90px}.prop-label{padding:8px 0;font-size:9px;line-height:1.45;gap:4px;align-items:flex-start;border-top-color:color-mix(in srgb,var(--scene-accent) 25%,transparent)}.prop-arrow{font-size:12px}.prop-depth{width:86%;align-self:center}.prop-image{filter:drop-shadow(0 7px 6px #31382f15)}.stage-caption{left:22px;right:22px;top:auto;bottom:145px;width:auto;font:italic 11px/1.4 'DM Serif Display',Georgia,serif;text-align:center}
 .world-nav{inset:auto 18px 16px;display:block;padding:0}.world-nav-caption{font-size:9px;margin-bottom:7px;min-height:26px}.motion-toggle{height:28px;width:38px;margin:0}.scene-position{font-size:8px}.world-links{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:5px;overflow:visible}.world-link{grid-column:span 3;min-height:40px;padding:9px 4px;justify-content:center;font-size:10px;border-radius:4px;gap:0}.world-link:nth-child(n+5){grid-column:span 4}.world-link .world-link-number{display:none}.world-link .world-link-name{display:block}.world-link:hover{transform:none}
 .marquee{padding-block:15px;font-size:9px;letter-spacing:.12em}.scene-error{top:205px;left:18px;font-size:11px;max-width:260px}
}
@media(max-width:700px) and (min-height:850px){.hero-copy{top:92px}.hero h1,html[data-world=development] .hero h1{font-size:41px;margin-top:15px}.portrait-stage{top:244px;bottom:183px}.stage-caption{bottom:150px}.world-nav{bottom:20px}.scene-prop{width:98px}.prop-right{width:98px}}
@media(max-width:359px){.header{padding-inline:15px}.header .signature img{width:102px}.header-worlds{display:none}.hero-copy{left:15px;right:15px}.hero h1,html[data-world=development] .hero h1{font-size:31px}.scene-prop{width:72px}.prop-right{width:72px}.prop-label{font-size:8px}.world-nav{left:14px;right:14px}.world-link{font-size:9px}.character-depth{width:70%}}
@media(prefers-reduced-motion:reduce){.portrait-motion,.prop-image,.ambient-field{animation:none!important;transform:none;will-change:auto}.character-depth{transform:translateX(-50%)!important}.prop-depth{transform:none!important}.scene-panel.revealing{transition:none!important}.section-enter{animation:none!important}}

/* Blend only the temporary white-background source photograph. Final assets use alpha. */
.portrait-stage:has(.scene-panel.active .is-reference){mix-blend-mode:multiply}

@media(max-width:700px) and (max-height:740px){.hero-copy{top:76px}.hero h1,html[data-world=development] .hero h1{font-size:32px;margin-top:10px}.portrait-stage{top:192px}.scene-prop{width:76px}.prop-right{width:76px}.prop-label{font-size:8px}.stage-caption{font-size:10px}.header{height:58px}}

/* The finished alpha portraits unlock distinct stage materials and light.
   The opaque source photograph stays on the pale development palette. */
html[data-has-final-character=true][data-world=ai]{--scene-paper:#101d21;--scene-ink:#edf7f4;--scene-muted:#b0c4c2;--scene-accent:#73e8c7;--scene-glow:#087c79;--scene-cool:#1c4f5b;--scene-line:#cfeee333}
html[data-has-final-character=true][data-world=development]{--scene-paper:#191b2a;--scene-ink:#f4f0ff;--scene-muted:#bfb7cf;--scene-accent:#c5a4ff;--scene-glow:#533781;--scene-cool:#283957;--scene-line:#ded0f433}
html[data-has-final-character=true][data-world=business]{--scene-paper:#14232e;--scene-ink:#f4eee4;--scene-muted:#bdc7cc;--scene-accent:#e5c39b;--scene-glow:#495847;--scene-cool:#3e5565;--scene-line:#e2d3bd33}
html[data-has-final-character=true][data-world=riding]{--scene-paper:#142130;--scene-ink:#f9edf6;--scene-muted:#d2bdce;--scene-accent:#ff92c8;--scene-glow:#993b80;--scene-cool:#245b9c;--scene-line:#efd3e333}
html[data-has-final-character=true]:is([data-world=ai],[data-world=development],[data-world=business],[data-world=riding]){--scene-control:#ffffff08;--scene-control-hover:#ffffff15}
html[data-has-final-character=true]:is([data-world=ai],[data-world=development],[data-world=business],[data-world=riding]) .header .signature img{filter:invert(1);mix-blend-mode:screen}
html[data-has-final-character=true]:is([data-world=ai],[data-world=development],[data-world=business],[data-world=riding]) .ambient-field{opacity:.42}
html[data-has-final-character=true]:is([data-world=ai],[data-world=development],[data-world=business],[data-world=riding]) .ambient-two{opacity:.5}
html[data-has-final-character=true]:is([data-world=ai],[data-world=development],[data-world=business],[data-world=riding]) .hero-atmosphere:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,#00000020,transparent 35%,#00000017);pointer-events:none}
html[data-has-final-character=true]:is([data-world=ai],[data-world=development],[data-world=business],[data-world=riding]) .scene-word{opacity:.045}
html[data-has-final-character=true]:is([data-world=ai],[data-world=development],[data-world=business],[data-world=riding]) .stage-floor{width:34%;height:42px;bottom:0;background:radial-gradient(ellipse,color-mix(in srgb,var(--scene-accent) 16%,transparent),transparent 65%);filter:blur(13px)}
html[data-has-final-character=true][data-world=riding] .ambient-one{opacity:.52}
html[data-has-final-character=true][data-world=riding] .ambient-two{opacity:.65}

/* The original Armor-Dilloz bottle photograph keeps its tall proportions. */
[data-scene=business] .prop-right .prop-depth{height:240px;aspect-ratio:auto}
[data-scene=business] .prop-right .prop-image{display:block;animation:none}
@media(max-width:700px){[data-scene=business] .prop-right .prop-depth{height:120px}}
